woutdp
LiveSvelte - E2E reactivity in LiveView with Svelte
Hi!
I wanted to introduce my latest project LiveSvelte. It allows you to render Svelte inside LiveView with end-to-end reactivity. It’s an extension on top of LiveView for those cases where something like hooks or alpine.js doesn’t cut it.
With LiveSvelte it’s relatively easy to get client side only state working. It’s also great for animations as Svelte has great support. And hooking into npm packages becomes easier.
It’s just a component so you can add it wherever you want inside your LiveView so you can take a hybrid approach.
Interested to hear feedback!
Most Liked
woutdp
daveboo
I’m wondering why there is not more excitement about this?
I get that the key advantage of LiveView in the first place is getting away from the client-side js framework du jour, but this seems like quite a step up from using Alpine.js to do your sprinkling (I’m not sure what the latest phraseology is for that last bit of client-side functionality not easily workable in LiveView).
Others have mentioned that Alpine has security concerns in LiveView - does Svelte have the same problem?
I’m not questioning the feasibility of LiveSvelte, but I’m wondering how niche (or how valuable) a LiveView/Svelte developer will be in the job market. I am currently focussing on Phoenix/LiveView development and this thread has made me take a good long look at Svelte.
Great stuff Wout!
woutdp
@victorbjorklund @ziazek
Both issues are fixed I believe. Best to reinstall the entire package with version 0.4.0 and follow the installation guide.
2 Extra steps have been added to the installation which I’ll try to simplify some time in the future, but for now I just want to make sure it’s working in a production environment. Works for me on fly.io and performance is good but that’s just a sample of 1 
If anyone has it running in production please let me know.
Popular in Announcing
Other popular topics
Latest Phoenix Threads
Latest on Elixir Forum
Sponsor Spotlight
Real-time error tracking, performance insights, and observability for devs.
Categories:
Sub Categories:
Forums
Popular Tags
- #ecto
- #liveview
- #troubleshooting
- #learning-elixir
- #deployment
- #library
- #erlang
- #testing
- #genserver
- #mix
- #absinthe
- #remote-other
- #otp
- #plug
- #how-to-question
- #macros
- #postgres
- #channels
- #elixirconf
- #exunit
- #discussion
- #code-sync
- #javascript
- #podcasts
- #onsite
- #dialyzer
- #docker
- #authentication
- #umbrella
- #full-time-contract
- #podcasts-by-brainlid
- #ecto-query
- #elixir-ls
- #phoenix_html
- #iex
- #blog-post
- #graphql
- #genstage
- #ai
- #websockets
- #supervisor
- #advent-of-code
- #elixirconf-us
- #distillery
- #processes
- #forms
- #api
- #metaprogramming
- #security
- #performance
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.
Real-time error tracking, performance insights, and observability for devs.
Develop your skills with books, videos, and courses.
Enabling companies to succeed by building software people love.
The deployment platform built for Elixir: PaaS ease, VPS control.
Courses that'll move you from confusion to "Aha, now I get it!"