pillaiindu
A post from Dev Talk directed me to this todo demo at SvelteKit. I was surprised how slow the response of creating and deleting a todo was, considering the performance of Svelte. Then I opened the network tab and I realized it was sending requests to the server on my slow connection.
I realized it needed Optimistic UI updates / Latency compensation to be instant. Then I remebered that I had asked about the possibility of Optimistic UI in LiveView in Feb 2019.
I asked that question when LiveView was new. Now LiveView has matured and there are a couple of books on LiveView (one from Pragmatic Bookshelf and another one from Groxio), and a detailed video course from Pragmatic Studio.
What is the scenario now? Can LiveView make Optimistic UI updates, or we still need to use GraphQL, Apollo, etc to have Optimistic UI updates?
Where Next?
Trending in Discussions
Other Trending Topics
Latest Phoenix Threads
Latest on Elixir Forum
Sponsor Spotlight
Catch errors, track performance, monitor hosts and more.
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #library
- #deployment
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #elixirconf
- #channels
- #exunit
- #discussion
- #code-sync
- #podcasts
- #javascript
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #elixirconf-us
- #ai
- #blog-post
- #elixir-ls
- #phoenix_html
- #iex
- #graphql
- #genstage
- #websockets
- #supervisor
- #advent-of-code
- #distillery
- #processes
- #api
- #forms
- #hex
- #security
- #metaprogramming
Our Sponsors
Build Elixir applications with speed and confidence.
Supporting innovation across the BEAM ecosystem.
We build reliable cloud platforms for business-critical systems.
Catch errors, track performance, monitor hosts and more.
Elixir, Erlang & BEAM conferences from Code Sync - join us in 2026!
Practical resources that improve the lives of professional developers.
Bringing learning, work and compliance together since 1987.
Producing high quality Elixir screencasts since 2017.
The team behind Membrane, Popcorn, LiveDebugger. Available for hire.
Courses that'll move you from confusion to "Aha, now I get it!"
Showing Posts 6 to 1- Show Best Posts
- Show All (oldest first)
- Show All (newest first)
kelvinst
Plus the fact that it requires you to implement a lot of duplicated logic on server and client. With LiveView you can be productive because you are not reimplementing a lot of stuff over and over. With SPAs you implement a lot of validations on the server for data consistency reasons and you implement the same validations on the client to be able to actually be optimistic without giving the user a lot of false positives.
andreaseriksson
On the other hand, optimistic ui:s comes with some drawbacks. Just because you add/or delete an element in the interface and it instantly appears/disappears, you cant be 100% sure the server made the change (hence optimistic).
Besides that, you can sprinkle in some js to make the client side snappier when removing resources and other cases like that.
pillaiindu
Thank you for your answer! I loved the anology.
But maybe people like @josevalim and @chrismccord are able to create an airplane which can submerge in the ocean, at least in the BEAM world.
al2o3cr
IMO LiveView makes a totally different set of tradeoffs to run most/all of the logic on the server-side: GraphQL + Apollo is designed to run much of that logic on the client side.
Translating to physical objects, this question is like asking “can Airplane now dive to the bottom of the ocean, or do we still need to use Oxygen Tanks and Submarines?” Both things are designed for their particular use-case, and while similar they aren’t interchangeable.
pillaiindu
I think “phx-disable-with” has a good use case. When you want to prevent user from performing an action which is already performed but the feedback is not yet arrived from the server.
You can use it for enhancing the user experience and preventing user from making a mistake (performing the action twice which s/he intended to perform once), but I don’t think it’s an alternative to a full blown Optimistic UI.
BartOtten
You should be able to use phx-disable-with for optimistic UI on the client. However, that seems to be only applicable to the element you are interacting with. Maybe it’s a start though…Can’t check it myself as I am on mobile.