Explanation of Flow's 2-way communication protocol?

Hi,

is there anywhere a (high-level) documentation on how the Vaadin Flow 2-way communication works, e.g. in form of a sequence diagram. I just don’t want to dive into the code to get an impression of how it works. Is it incremental? Does it use a binary or human readable data format?

I wasn’t able to find this in the official documentation, but maybe I just missed the right page :confused:

Kind regards,
Thomas

Hi,

I don’t think there is documentation about that anywhere as it’s mostly considered an internal implementation detail. If you go to any Flow app, e.g. https://bakery-flow.demo.vaadin.com/ and open Chrome inspector and the network tab, you can see the JSON it uses by looking at the ?v-r=uidl&v-uiId=<something> requests.

It’s “human readable” as it’s JSON but in reality not very readable. As the UI state is on the server, the server knows what has changed and only sends state changes to the client, not the full state. In the other direction, it is RPC style communication which is also JSON.

Thank you very much for the explanation!

I will have a look into the bakery app.