The biggest benefit to this would be gaining access to all the UI component libraries in the JavaScript ecosystem. The lack of such components in LV is one of the things that slows us down the most.
90% of those components are in/for React tho?
LiveView Is Best with Svelte
141–150 of 158 posts
Re: LiveView Is Best with Svelte
#142Article misses a comparison to newer frameworks like Remix which are server side driven
Server side, Remix does not hold a candle against Elixir.
Re: LiveView Is Best with Svelte
#143Earlier quoted context omitted.
That's what I did with: https://territoriez.io/ It's a clone of https://generals.io/ It's built with LiveSvelte. It doesn't need any predictive features as it's basically a board game and runs at 2 ticks per second. It does use optimistic updates to show game state before it actually updates on the server. The server overrides the game state if they're not in sync. All game logic is done inside Elixir. To do predicti…
> To do predictive correctly, you'd need to share logic between the server and the client. > > One possible solution […] is to write all game logic in gleam […] Rust, with Uniffi, can also be a good candidate. You’d be targeting WebAssembly.
Is there a way to emit WebAssembly with Uniffi? I looked for it before, but I couldn't find it (I'm using it in a project to share login between the backend and Kotlin/Swift apps. I wanted to share it with JS for a web frontend, but didn't find any docs mentioning it)
Re: LiveView Is Best with Svelte
#144You may give ts-liveview a try. It is easy to inline client-side script and possible to share the exact function between client and server.
I suppose it's also possible with remix
Re: LiveView Is Best with Svelte
#145Have you guys considered htmx before going that way? If you can share pro/cons I'd love to hear.
Author here. We did not. We briefly tried Alpine, which I think is comparable? I think Alpine is cool, but it didn't really stick with the team. I think that's because we were still writing our components in LiveView and sprinkling in Alpine. A big unlock with LiveSvelte was getting to move so much into `.svelte` files, but not converting the whole thing to a SPA. Working in a `.svelte` file gives you a lot of niceti…
Alpine isn't really comparable to HTMX, though their names often come up together.
Alpine is something like "AngularJS lite," a lightweight JavaScript framework with some similarities to the original version of Angular.
HTMX is a collection of HTML attributes that simplify replacing HTML on your page with HTML partials from your server.
In the article's example of interdependent dropdowns, you'd have HTMX attributes for catching the change event of the first select, specifying the server URL to fetch updated HTML from, and specifying the target to put the HTML into (the second select).
Some have recommended using HTMX for less complicated client-side interactivity and adding AlpineJS to pages that need more. That said, people have built impressive apps just by leveraging HTMX.
Re: LiveView Is Best with Svelte
#146> If a new row comes in, you just need to push it to your table, and LiveView will update the client for you. Don’t do this in line-of-business apps where those rows are interactive. The cognitive latency readily induces users into clicking the wrong thing, emailing the wrong customer, refunding the wrong transaction etc. My preferred UX instead is a sticky banner conveying “the data has changed, click here to refres…
This CAN work, if you animate in the new lines slowly and (maybe) disable clicks while new data is coming in.
I definitely prefer this over click-to-refresh banners. I want to make as few decisions as possible when completing a well-defined task on a computer.
Re: LiveView Is Best with Svelte
#147> There is a (literal) speed of light limitation with this approach: your server can only be so close to your users. The next step is to compile your server to WebAssembly and ship it to your clients. You can then use it to optimistically render responses while waiting for the real server to return. Sounds a little crazy, but we've actually pulled it off for a project, and its magic.
It sounds over-engineered. Lots of over-engineered stuff gets pulled off for no good reason.
Well, in this case, most online multiplayer video games wouldn't work without it!
Re: LiveView Is Best with Svelte
#148Earlier quoted context omitted.
I would strongly recommend using mise instead of asdf. It's a drop in replacement that is just flat out better for most people.
curious, what makes it better? asdf has always just worked for me, but this is the first time i’ve heard of mise, so i’m wondering what i’m potentially missing out on
The mise docs have a great comparison page: https://mise.jdx.dev/dev-tools/comparison-to-asdf.html
In personal experience, all of these have held true. Mise is just easier to use than asdf and I don't have to `asdf -h` every time I have to use it. The performance is significantly better and I can use mise exec in shebangs without sacrificing too much startup time. And it's easier to install because it's a SLSE. I wouldn't say it's worth deliberately switching from asdf (though I would, because asdf's CLI is an endless annoyance to me), but if you're on a new machine I don't think there is a reason to use asdf over mise.
Re: LiveView Is Best with Svelte
#149I honestly don’t understand how’s this different from react server components with nextjs but with less features? It seems like the same thing but with an even clearer border between server/client components and therefore missing all the optimizations (like streaming). Like islands architecture but made out of different technologies, is my understanding correct ? I would appreciate some feedback :)
LiveView has streaming. I would argue that if you're stuck in the React way of thinking about application design then it's not worth trying to sell you on what LiveView is doing. But there are multiple case studies out there showing that it results in far less build times than React for no compromise on user experience.
[dead]
Re: LiveView Is Best with Svelte
#150I've wanted something like this for Vue/React too with LiveView, because then you get access to this massive ecosystem of great components to put in your phoenix apps while still utilizing LiveView. (the LiveView component ecosystem is tiny). So maybe this can be the start of a general bridge that can bridge LV with React or Vue components too? And make it easy to put these in a page and interact with LV events, etc.
I've recently developed a LV/React bridge and am using it on a production app, but nothing open sourced at the moment. I'll open it up at some point soon and try and post back here!
Even putting it in a gist would be a great start! Looking forward to it.