How would you explain Phoenix LiveView to a newbie?

Learning Questions & Discussions What/How...
,
1

How would you explain LiveView to someone in an easy to understand way?

If you need a recap, here are the docs: Phoenix.LiveView — Phoenix LiveView v0.17.6

1 Like
2

LiveView allows to build a modern client app for the browser in Elixir without writing JS (or a minimal amount). It uses WebSockets behind the scenes. It is ideal to write application that need real-time updates.

2 Likes
3

Server-side rendering of pages with the help of stateful components.

SSR is reinvented every decade in different frameworks in response enhancements in web technologies. Pendulum swings between client side pages and server side rendering of pages.

Client side rendering of pages is fast, responsive, being decoupled from server side. They have criticism of poor SEO rendering, framework fatigue and on effort needed to build and maintain. Examples are jquery, angular js, knockout, react, vue, etc

SSR was very popular until around 2010-12. Examples are ASP.NET, JSP, Flask, PHP, Django and Ruby on Rails. Server side page frameworks showcase their strength in :

  • rapid development capabilities
  • simplified UI development,
  • server side validation
  • use of less development resources.
  • SEO ready

SSRs have criticism of being bulky, server round trip overhead and some amount of lag in UI and framework fatigue. SSR are very popular in enterprise world.

Java has JSF (Jakarta or Java Server Faces) with managed beans, components, events. They have partial rendering of pages - where part of page is refreshed. State is stored in managed beans and synced over network - initially using ajax, ws capabilities were added later. There are many implementations of JSF - Oracle ADF, Apache MyFaces, IBM Notes. JSF is very similar to LiveView in many ways. Jakarta Server Faces - Wikipedia

LiveView is a SSR - it brings in capabilities of Stateful Server Side rendering to elixir. All stateful server side rendering frameworks will have few features/constraints:

  • Lifecycle compliance - mounts, refresh, events, etc
  • Client side javascript hooks
  • Serverside refresh overwriting/patching of client state (html)
  • Lag on state sync (how much depends on network and what it is being used for)
  • Components
  • Templating for html

LiveView enables developers to write stateful interactive applications with less javascript and more elixir. LiveView will always require some amount javascript to be written. AlpineJS is popular with community.

A developer’s key to success is choosing right tool for right problem. If Phoenix views solves your problem it is your ultimate solution. If LiveView solves your problem, it is your ultimate solution. There is no one size fits all approach.

3 Likes