3 ms·

Doesn’t the LV approach suffer from latency issues? If I understand correctly all state is managed by the server, which means even the most trivial UI interact

by brap 1y ago

Doesn’t the LV approach suffer from latency issues? If I understand correctly all state is managed by the server, which means even the most trivial UI interaction needs a roundtrip. Not to mention the cost of managing the state and connection of every client. So how does that work in practice?

akarshc 1y ago
latency is minimal because liveview sends only dom diffs, not full page updates. most interactions feel instant. each connection runs as a lightweight beam process, so managing per-user state scales efficiently. for very high-frequency ui updates, some client-side js may still be needed, but for forms, lists, modals, and live updates, liveview is smooth and responsive.
- asa400 1y ago
  The size of the diff and the latency of the underlying transport layer are independent. If your user in NY clicks a button that has to go to your server in SF, you pay for that ping both NY->SF and SF—>NY for the reply. Same goes for whether they’re on some flakey mobile connection in a car or on a train. It’s also super easy to accidentally send a ton of data down the wire on component mount. I worked on a massive LiveView app at a company you’ve heard of and these kinds of issues were a problem the whole time. You also give up the standard stateless HTTP request/response model when you go with LiveView. This is not necessarily bad, but people should be aware that they’re turning their stateless web tier into a stateful web tier. It’s an entirely different model (and in my opinion, more challenging). LiveView is cool technology but I don’t want people to overlook the fact that it has some sharp edges you have to be aware of when building large products.
lawn 1y ago
In practice it's mostly fine actually. But yes, for interactive elements it's not optimal. They have some JS helpers for simple things but you may need to drop down to JavaScript hooks yourself if you want do better. I've been playing around with Hologram, which transpiles Elixir to JavaScript. It's very early days but it has the potential to be a much better solution than LiveView. https://hologram.page/ https://hologram.page/

by brap 1y ago

akarshc 1y ago

latency is minimal because liveview sends only dom diffs, not full page updates. most interactions feel instant. each connection runs as a lightweight beam process, so managing per-user state scales efficiently. for very high-frequency ui updates, some client-side js may still be needed, but for forms, lists, modals, and live updates, liveview is smooth and responsive.

asa400 1y ago
The size of the diff and the latency of the underlying transport layer are independent. If your user in NY clicks a button that has to go to your server in SF, you pay for that ping both NY->SF and SF—>NY for the reply. Same goes for whether they’re on some flakey mobile connection in a car or on a train. It’s also super easy to accidentally send a ton of data down the wire on component mount. I worked on a massive LiveView app at a company you’ve heard of and these kinds of issues were a problem the whole time. You also give up the standard stateless HTTP request/response model when you go with LiveView. This is not necessarily bad, but people should be aware that they’re turning their stateless web tier into a stateful web tier. It’s an entirely different model (and in my opinion, more challenging). LiveView is cool technology but I don’t want people to overlook the fact that it has some sharp edges you have to be aware of when building large products.

lawn 1y ago

In practice it's mostly fine actually. But yes, for interactive elements it's not optimal. They have some JS helpers for simple things but you may need to drop down to JavaScript hooks yourself if you want do better. I've been playing around with Hologram, which transpiles Elixir to JavaScript. It's very early days but it has the potential to be a much better solution than LiveView. https://hologram.page/ https://hologram.page/