Hi everyone! I’m new to the forums and new to Elixir in general. To learn Elixir, I recently just completed my first app. It’s a todo app built with Phoenix LiveView, but with a twist, it can also work offline
By using the LiveSvelte package, I was able to use LiveView to render Svelte components which allows for offline-support. I know an offline app was not what LiveView was intended for, but I thought it was neat that it was possible to still use LiveView in such an app.
I haven’t gotten the chance to dive deeper into Phoenix Channels yet so I’m not sure if the app would perform better just using that instead. However, so far the app has been working well for me and the DX of using LiveView has been great. Anyhow, I thought I would share in case anyone else is interested in building offline-enabled apps with LiveView
Here’s a video I made walking through how I made the app:
Hi all! I wanted to give an update on this project-
In my video, I discussed using Yjs on the server-side in order to merge the states of the various clients. This worked, but was not ideal since it required running JS from Phoenix or from a separate JS backend server (which is what I did for my project via a Cloudflare Worker).
Since then, I have found out that it is not necessary at all to run Yjs on the server in order to sync the clients. I have updated my repo to no longer need a separate JS backend. I also made a video explaining how it is possible to do so. You can check it out here if interested:
Thanks! That’s quite interesting, but it is clearly problematic for any real-life cases with non-trivial amount of data. I think our best bet as community would be to create a Rustler wrapper package around yrs - Rust to be able to reconcile state diffs (patches). That way we could use it for realistic data amounts and keep the chattiness of the network traffic at bay.
But yeah, someone with Rust skills would have to create the wrapper first
Maybe we’ll have a production quality CRDT bindings in near future.
Cheers!
I definitely agree that sending the entire app state every time is not scalable and a Rustler wrapper would be awesome!
One other idea I had that may also work is: Instead of sending the entire app state every time, we could just send Yjs updates for each change. And, on the server, instead of keeping a single app state, we can keep a table of all updates sent. Then, when a client reconnects, it can request all the updates it has missed. I haven’t tried this out, but I think that it should work in theory.
Definitely still not as good as just having a Yjs port, but just thinking out loud
Indeed, using the diff on the client to send just the changed data might work. The only thing I dont like, it the in-ability on the server to process the data in any meaningful way. For your Elixir app this data is just a binary blob without much meaning. It really depends on the use case, for some apps this might be OK. My use case requires some insight into the data on the server, so it wont work out here. BUT… Still great, in case the server should stay dump and clients just exchange data.
Yup, it definitely depends on the use case. For the apps I had in mind, I was actually considering encrypting the user data so that it would only be available to the end user on the client-side. In those cases, not being able to process data server-side actually works out.
Thanks for all the feedback! I’ll definitely have to ponder this one a little more.