Elixir – Phoenix LiveView Native | Hacker News Reader

Elixir – Phoenix LiveView Native

native.live

246 pointslefrenchy81 comments

If this is like react native except where most of the logic is server-side (but sends down some kind of native DOM that gets rendered natively), I'm sold.

This seems to be a more detailed link: https://dockyard.com/blog/2022/09/01/dockyard-r-d-build-elix...

Eww, that page renders “post not found” (though with a 200 response), and then replaces it with the actual content via client-side scripting. The effrontery of the header text “It looks like you’re checking to see that we’re server-side rendering. We are!” is palpable.

This is a MUCH better link, thank you for sharing.

That should be the post link. The current link doesn't really explain anything at all.

Yes, that is what it is.

For the last few months as we’ve been adopting liveview more. I’ve been researching what would be needed to build something like this in my spare time since we have much more elixir talent than react native.

So glad you guys have been working on this. Very excited and looking forward to trying it out next week.

We will likely adopt this and make a bet on it.

I’m having a super hard time understanding why you’d want a native app require 100% connectivity.

When the app feels like (or is) a web app, then at least the user understands intuitively that nothing is going to survive connection loss. However with a native feel, seeing the app freeze and navigation become disabled is going to feel completely wrong..

Did i miss something ??

A good number of native apps are unusable without an internet connection.

We just accept that our fragmented software landscape spans several backend technology stacks, web browsers and two dominant mobile platforms that are in constant flux. ES6, Typescript, Swift and Kotlin didn't even exist a decade ago and their constantly shifting ecosystems are nearly impossible for a single developer to keep up with. Higher barriers to entry work well for the large companies that dominate our industry so they continue to churn out complexity as best practice.

Allowing a single developer to deliver customer-facing applications without the context switch and coordination overhead of a team is a big deal. In the 80s and 90s, this was possible. Today, even deployment has become a specialised role. Not every engineer wants to be forced into a backend or frontend role in an agile team with product owners and ceremonies. There needs to be room for the craftsman in our industry. This is a step towards empowering the individual hacker again.

Liveview Native is not hugely compelling if you're only looking at it from the perspective of an established company or funded startup that can afford a team of more than 3-6 engineers and devops. As a solo dev or bootstrapped startup with limited resources, this is a killer feature for elixir and phoenix.

I don't want to use JavaScript for everything. I have to, because my team is only 6 people, and we're responsible for the entire stack. If I chose literally any other technology, I'd be the only one able to maintain it when things go wrong.

If it was a choice between JavaScript or Elixir, it would be Elixir every single time for me.

Interesting perspective that resonates with me. What do you think of firebase + flutter with regards to single dev empowerment and entry barriers?

I guess that Phoenix LiveView is going to blow B2B apps up at some point. I'm thinking of ATM / smart vending machine / smart ads board. Yes, those that are 100% internet connected.

What do you mean when you say "blow up"?

Not OP, but I interpret it as "dominate; take over; disrupt", ie a pretty hearty endorsement.

My assumption was that you ship the server software together with the desktop software, maybe could even be one file. So running the binary runs the server + open the UI, shutting everything down when the UI closes.

You can do something similar with Tauri in Rust, so you get a desktop application communicating via local http in just one binary.

Yes, I’ve done this with LiveView and Tauri and it works.

At the time, the barrier to my investigations was LiveView interop with component frameworks. Even Ionic Vue was tricky to get the re-rendering right.

Having a native framework ontop of liveview unlocks shipping it for desktop apps. Bundle a local first database and you have a highly productive stack for building snappy, small bundle, native apps with web technologies.

I think AirBnB is using Server-Driven UIs (SDUI) in its native apps. One may have at least one native screen just for fallback. Most of the apps are not offline-first anyway, in the best case they implement some speculative/optimistic UI with retries for cases when connection suddenly drops for short amount of time.

I'd say only tiny number of mobile apps support true offline operation, e.g. supporting following buzzwords:

  Offline-first
  Occasionally-connected systems
  Infrequently-connected systems
  Partial connectivity
  Intermittent connectivity

Packaging a webserver together with an app is also an old idea, though clearly hackish, it's probably better fit for embedded devices/IoT and desktop apps, much less for mobile.

Social networks, news sites, online marketplaces or retail.

I would imagine the experience to not be any different from trying to use the Twitter app when you lose connectivity. The app can choose to either: 1. Degrade the experience gracefully. Still function in a limited way. 2. Display a network error message, pausing whatever action the user was about to take. Keep retrying for a bit.

PWA can get you almost there. But LiveView is server rendered (business logic lives on the server). A loss of internet would render such an app unusable.

With this technology, I believe they are bundling the Phoenix LiveView server in the binary - to alleviate that gap. It’s like packaging node + app in a binary.

I think, the appeal here is LiveView. You can develop a SPA/OPA native app without writing any JavaScript. The code is entirely Elixir + HTML + CSS. Bundle it with SQLite and you’ve got a decent stack now that can even work offline.

Disclaimer: I didn’t see many details on the project page. My assumptions may be incorrect.

Let me check which native apps I'm using most.

Banking apps, all online

OSMAnd, offline

Cool Reader, offline

Some go (game) apps, one online, the others offline

K9, mostly online

NewPipe and YouTube, online

Maps, online

Gallery, Camera, Calculator, Notes, File Manager, offline.

So there is a space for about half of what I use to be built with Phoenix Native and probably I'm using less online apps than most people.

Yes, this feels like the exact opposite of an offline-first approach that many tout as being useful for applications in general.

Are you assuming that it is going to be online only or is there an architecture doc that says that?

There are already examples where iOS app has embedded Phoenix server to which the webview client talks to locally on the phone. The local server can then sync with a cloud server however it wishes.

Interesting. Do you remember which apps are doing that?

They talked about it on one of the podcasts [0].

[0] - https://podcast.thinkingelixir.com/98

47 minutes, no time for that. Luckily they link plenty of resources. It seems that the technology is https://github.com/elixir-desktop/runtimes

> I’m having a super hard time understanding why you’d want a native app require 100% connectivity.

> Did i miss something ??

Yes. The article writers gave their reasons for why they are offering a native implementation of phoenix liveview.

  * Build complex, client-side applications that are faster and lighter than
    those built with heavy JavaScript frameworks
  * Deliver better user experiences across all platforms (no more "uncanny
    valley" effect)
  * Optimize productivity and resources with a single team, managing a single
    code base across the web and native

Would be interesting to see if the idea was to have the server + client native complete with local storage and then have the BEAM node connect elsewhere.

Don’t forget about Lumen (now called Firefly) — compile and run OTP on WASM.

What is lumen or firefly? I can't get to any website or github. Can you share a link?

Got a github link https://github.com/lumen/ but it seems abandoned and not actively maintained

Here's website and source code of Firefly:

https://getfirefly.org/

https://github.com/GetFirefly/firefly#about-firefly

Erlang and Elixir -> web assembly I belive.

Exactly that. Compiles down to it rather than shipping the full compiled BEAM and runtimes.

Firefly is the new name, Lumen the old. Lumen lost momentum for a bit, DockYard seems recommitted to finishing it up.

I think it has fantastic promise.

Source: was helping publish news back when

Try switching off the internet of your phone and report how many apps are still working after that, there's actually very few of them.

Just checked my phone:

- audible, work: I can access all previously downloaded books

- bitwarde and andotp: work

- sms, telegram and signal, work: I can access the full history

- countdown, alarm clock, click counter, work

- dynalist, work

- pi music player and vlc, work

- maps.me, organic map and osmand: work, as the maps are downloaded in advance

- firefox & chrome, work: I can access all the app menus and open html files

- podverse, spotify and netflix, work: everything I pre-downloaded is accessible

- twitter app, work. I can see all tweets previously seen and posted today

- pcloud and dropbox, work

- rbnb, work: my history is accessible

- K9 and yandex mail, work: I can access to all my imap inboxes

- oura ring, work: I can access my stats and history

- calendar, calculator, qt scanner, work

- gallery, explorer, home menu, settings: work

What doesn't on my phone:

- gmail, waze

- banks and cryptocoins appp

- stremio, youtube, and discord

I think many of the business apps I use (banking, train tickets, shops...) are literally just webviews, and could benefit from this kind of system to make a much more native-feeling app at a low budget. A lot of these apps aren't particularly useful without an internet connection.

It reminds me of so-called "hybrid" apps: https://signalvnoise.com/posts/3743-hybrid-sweet-spot-native...

I can’t do much with my native email app without connectivity.

Really? I haven't used a native email client in awhile, but I seem to recall being able to peruse already downloaded emails, as well as drafting emails without needing connection.

Then, when you reconnect, you get new emails that you missed while you were out, as well as the ability to send the emails you'd drafted while offline.

Those are some pretty handy features to just throw away.

You're right; the iOS Mail app works this way.

you can run the phoenix app locally, i guess?

Have led multiple teams on Elixir projects across a few companies. And while I still love the projects, the community just isn't there anymore.

I hope this project sparks some renewed interest in Elixir!

(That said, the linked site has basically zero information or examples)

The community seems stronger than ever. What was your experience of its fading away like? Projects like this don’t give the impression of a language falling by the wayside. People tend to fall in love with Elixir. You never forget falling in love.

Seems like the volume of posts on ElixirForum.com is way down over the last 12 months.

might be just that core elixir is pretty stable. I haven't consulted the elixir forums in months because I rarely run into issues that require external help. I write elixir every day though. Would love to see more people get into elixir though for when we start hiring more people.

I enjoy using Elixir but I've never been able to get into any of the forums, channels, etc.

Maybe there are better metrics to gage momentum.

The most recent StackOverflow poll shows Elixir as having the highest percentage of people happy with working with it (over 70%), taking top spots among all tech languages and platforms … and is among the lowest for tech people wish they are using for work, but are not.

In other words, many of the developers who want to be working with Elixir are working with Elixir, and are quite happy doing so.

The slack channel seems more active than ever.

I'm very active in Elixir but the forum just hasn't been my vibe.

What drives great web framework is a culture of making product. RoR and PHP based frameworks have massive product makers, thus it drives forces into libraries made for variety of products.

Elixir's culture is engineering-ish. So you will see decent libs that deal with weird mechanism stuff, but lack of vibe and forces driven from business needs.

This is very true. the ecosystem has astounding next gen tooling for solving all sorts of things easily that are real bugbears in other languages (oban, horde, genstage, numbat) but the libraries for interfacing with actual third party services or doing mundane things are a bit lacking.

Its the reason I tell startups to use laravel or node instead even though I built my startup in elixir. Yes its a huge advantage for what we do (realtime synced apps for managing restaurants) but its overkill for most saas products that are just glorified crud apps. laravel is a huge winner there with its library of prebuilt apps that handle user authentication, billing, tenancy as drop in components.

> the libraries for interfacing with actual third party services or doing mundane things are a bit lacking

Can you provide concrete examples for this? I work with Elixir every day and your statement does not resonate with me at all.

Integrating with third party services and doing mundane things are generally no harder in Elixir than any other language.

There's plenty of example. Stripity stripe is an example of one of the better integrated examples and even I've been a bit frustrated with it at times. We're currently stuck on a slightly older version and last I checked, it didn't support the latest version of the stripe API. And that's an example of a library thats relatively well maintained. If you want to use authorize.net for instance, you have to roll your own. (there's a hex package but its still very much in beta). If you wanted to do banking and use Synapsefi, be prepared to roll your own.

Now it wouldn't' be any harder to write these libraries in elixir vs ruby or laravel. The difference is there are well polished libraries for both those platforms you can just drop in and use. That makes what could be a week of work in elixir, about half a day in ruby by virtue of the work largely being done for you already.

If the library doesn't exist for either, then I agree, elixir isn't going to be any harder to integrate.

Datadog APM, Segment: both key to building day to day products, none first party support. Community libraries exist, but their bus factor isn’t looking good.

Spent weeks getting spandex (elixir Datadog lib) to work properly. Totally concur.

And then found out it was abandoned. But everyone is moving to open telemetry.

That hasn’t been my experience at all. ElixirConf was well attended this year and regional conferences are coming back. The Slack is active. Most of the podcasts are still running.

Elixir was one of the few languages I saw in companies (albeit, infrequently) that wasn't like Java, C#, Python, or JS (Scala here and there). Was always curious about it as perhaps something that could be reasonably pitched as having some nominal uptake.

Pure anecdata there also. Literally just ones I have personally seen on clients or heard about from coworkers.

We use it at a large company and employ almost 60 people writing it. It’s been great so far. The talent pool is really good and it’s easy to teach to junior devs.

Interesting, I was thinking the opposite. Elixir Forum has so much volume I stopped following it 1-2 years ago and now hang out in the much quieter Erlang Forum :D

What gave you that impression?

I'd be curious what gave you this impression?

Curious to take this for a spin. I've been wrapping LiveView apps in WebViews and they feel pretty good, but any improvement would be welcomed.

One thing that isn’t clear - does the elixir runtime (OTP) run on the iOS device?

It looks like a well integrated web view, but it’s not clear if it’s all running on device. Does apple support a web page not loaded from local?

There's no WASM involved and the BEAM is not running on the device. It works like LiveView, except instead of an HTML DOM you have a SwiftUI hierarchy. The client side of LiveView is a SwiftUI view itself, you can use many standard SwiftUI views, and also add your own custom ones for when you need something bespoke. It can be the whole app or just part of one.

People have shipped the BEAM VM as part of iOS apps recently though. I think Thinking Elixir covered it in an episode.

If it's anything like Phoenix, it's just websocket based on the client (iOS device in this case) which has a DOM diffing mechanism to patch in updates from the Elixir backend.

Short answer: no the client side is not elixir I suspect.

They jumped the gun a bit with the page, but what I have been able to piece together so far is that they renamed the WASM runtime from Lumen to FireFly and FireFly is what powers this through WASM.

So OTP is running natively on the phone.

This is essentially React Native reinvented with Elixir, which to me is pretty awesome because I really dislike React Native although we have done quite a few projects with it :)

Edit: Totally mistaken, I stand corrected! Turns out I jumped the gun instead. Hopefully FireFly and this CAN give me the RN replacement I desire.

It is not on the phone, no. I'm sure eventually you could run it on the phone like Elixir Desktop[1], but that isn't what it is at the moment. The phone connects to the server via a websocket and the SwiftUI "DOM" is pushed to the client just like HTML would be. In fact, I already built a hybrid Web & Native demo[2] that demonstrates that it's just bog-standard LiveView.

[1] https://github.com/elixir-desktop/desktop

[2] https://natetodd.com/building-for-web-and-native-with-livevi...

What do you dislike about RN?

Some are using ClojureScript to write RN apps, like the folks at vouch.io … here is a talk by David Nolan

https://youtu.be/3HxVMGaiZbc?t=1015

Tangential, but where can I watch the talks from ElixirConf 2022? Youtube channel has not uploaded any yet, and the website doesn't seem to have any recordings either. All I see is 250$ to attend virtually.

Shouldn't their target be to spread word fast and wide? I get paid tickets for in-person attendance, but online talks should ideally be live streamed for free, no?

The confs I've seen tend to release videos later.

Virtual tickets probably make decent money and I think most confa want to clean up the long-lived video before putting it out. Low incentives to stream for free it seems.

I've not been part of lot of conferences, but both Emacs conf and Nix conf put videos up pretty much as soon as they're presented.

But if the conference is independent and the aim is to make money, I get it. Conferences with aim to socialise/promote to/the userbase tend to make it as low friction as possible.

Is this the same?: https://github.com/elixir-desktop/desktop Looks quite similar to me.

No, Elixir Desktop is a great project as well. It packages up the BEAM entirely into a native binary. So Elixir/Erlang runs natively on the phone. LiveView Native will render actual native SwiftUI components into the SwiftUI viewtree. In other words, LVN is just a client whereas Elixir Desktop is the entire BEAM runtime/VM

Any additional info? The linked website is just a teaser.

Any example projects / code?

There is a tutorial up https://liveviewnative.github.io/liveview-client-swiftui/tut...

There’s the ElixirConf 2022 chat app: https://github.com/liveviewnative/elixirconf_chat

I sincerely hope this will be open source. Otherwise it'll just be another niche thing like various cool things in smaller languages.

It is open source https://github.com/liveviewnative

I don't see a repo on there for LiveView Native. Just a tutorial, example app, and a backend.

we have clients per device. So there is a SwiftUI client and a Jetpack Compose client

just this currently? no demo or something like that?

There is a sample app and tutorial here: https://github.com/liveviewnative

Is this what DHH and Rails did with Hotwire Turbo and their native iOS/Android libraries to allow you to use identical server rendered HTML content that you use for your web site in native mobile apps without needing to write native apps beyond a shell or whatever native controls you want to opt-into using?

They've been doing this with Turbolinks for years (I think it was first mentioned in a 2016 Railsconf keynote), seems like a good pattern. I'm so happy DHH came up with this pattern, especially the idea of leaning heavily on HTTP (not Websockets) and sending HTML over the wire for fast page updates.

I haven't done any Rails dev work in a while but as I understand it the Rails implementation is a Webview, not actual native UI

Reply on news.ycombinator.com