Frontend>Blogs/Talks

Restore LiveView State on Startup

brainlid

brainlid

Restore LiveView State on Startup

You are storing some Phoenix LiveView state in the browser. You want to retrieve that saved state as early as possible to improve the user experience.

The approach we used earlier waits for the LiveView to request the client to send the data. In your situation, you know you want the data, so why wait around to be asked for it? Can you have it automatically pushed from the client without being requested? Can you do it in a way that is reusable for other pages and other LiveViews and not just this one page?

This recipe improves the design and even makes it work for multiple LiveViews in the same application!

View thread on forum
/elixir/phoenix#blog-post#liveview
6 1329 0

Where Next?

View thread on forum
elixir
phoenix
blog-post
liveview
Home Frontend>Blogs/Talks
/elixir/phoenix#blog-post#liveview
6 1329 0
Last post

Popular Frontend topics Top

AstonJ
Frontend>Blogs/Talks

Intro to WebAssembly
This is a really good article explaining what WebAssembly is and how to get started with it - well worth a read! Pinning it for our /was...
blog.logrocket.com
#sticky/wasm
2 1671 0
New
First poster: bot
Frontend>Blogs/Talks

Vue vs React: Best Choice for Startups
Vue vs React: Best Choice for Startups. “I just have one question for you: Why Vue? I hope you’re not rolling your eyes thinking - “ah n...
swimm.io
/react
0 997 1
New
First poster: bot
Frontend>Blogs/Talks

The No-Framework Framework: JavaScript Without React
The No-Framework Framework: JavaScript Without React Part I. How I improved my programming speed by replacing React with plain JavaScrip...
youtube.com
/react/js
0 1383 0
New
First poster: bot
Frontend>Blogs/Talks

Why Become a TypeScript Fan?
In this article, I will discuss my journey from being an anti-TypeScript developer to a developer who now couldn’t think of going back to...
betterprogramming.pub
/typescript
0 1534 0
New
First poster: bot
Frontend>Blogs/Talks

Type-Level Programming in TypeScript
The TypeScript type system is immensely powerful, and while the language itself is, of course, Turing complete, so is the type system its...
mjj.io
/typescript#programming
0 1419 0
New
First poster: bot
Frontend>Blogs/Talks

_hyperscript: A jQuery and JavaScript Alternative
VanillaJS v. jQuery v. hyperscript Below are comparisons of how to implement various common UI patterns in vanilla javascript, jQuery an...
hyperscript.org
/js#jquery
0 1299 0
New
First poster: bot
Frontend>Blogs/Talks

Of Course We Can Make a CSS-Only Clock That Tells the Current Time
Let’s build a fully functioning and settable “analog” clock with CSS custom properties and the calc() function. Then we’ll convert it int...
css-tricks.com
#css#course
2 1034 0
New
AstonJ
Frontend>Blogs/Talks

Learn CSS Grid and Flexbox - the easy way
I can’t remember who was asking about CSS tuts now… but these just showed up on my YouTube feed and look pretty good/up to date :023:
youtube.com
#css#video#flexbox
18 1917 7
New
First poster: davearonson
Frontend>Blogs/Talks

Why your website should be under 14kb in size
What is surprising is that a 14kB page can load much faster than a 15kBpage — maybe 612ms faster — while the difference between a 15kB an...
endtimes.dev
9 1254 3
New
sundi
Frontend>Blogs/Talks

Utilizing Phoenix LiveView's Error HTML Pages
Learn to customize the Error HTML module in Phoenix LiveView, while enhancing the UX and retaining the typed URLs on branded 404 pages. ...
smartlogic.io
/elixir/phoenix#blog-post#liveview
1 852 0
New

Other popular topics Top

Devtalk
General Dev>Dev Chat

HELLO WORLD (Introductions thread!)
Hello Devtalk World! Please let us know a little about who you are and where you’re from :nerd_face:
#community
484 8259 119
New
PragmaticBookshelf
Hybrid>Learning Resources

Programming Flutter
Instantly view the changes you make to an app with stateful hot reload, and define a declarative UI in the same language as the app logic...
pragprog.com
#pragprog/book-programming-flutter#published-book/flutter
11 4501 1
New
PragmaticBookshelf
Data Science

Genetic Algorithms in Elixir
From finance to artificial intelligence, genetic algorithms are a powerful tool with a wide array of applications. But you don't need an ...
#pragprog#ai/elixir#published-book/book-genetic-algorithms-in-elixir
25 5243 6
New
PragmaticBookshelf
Game Dev>Learning Resources

Hands-on Rust: Effective Learning through 2D Game Development and Play
Rust is an exciting new programming language combining the power of C with memory safety, fearless concurrency, and productivity boosters...
pragprog.com
#pragprog/rust#published-book/book-hands-on-rust
117 10879 30
New
PragmaticBookshelf
Frontend>Learning Resources

Modern CSS with Tailwind
Tailwind CSS is an exciting new CSS framework that allows you to design your site by composing simple utility classes to create complex e...
pragprog.com
#pragprog/tailwind#published-book/book-modern-css-with-tailwind
12 5813 4
New
PragmaticBookshelf
Backend>Learning Resources

Programming Phoenix LiveView
Build highly interactive applications without ever leaving Elixir, the way the experts do. Let LiveView take care of performance, scalabi...
pragprog.com
#pragprog/elixir/phoenix#published-book/book-programming-phoenix-liveview
84 14528 26
New
PragmaticBookshelf
Backend>Learning Resources

Programming Ruby 3.2 (5th Edition)
Programming Ruby is the most complete book on Ruby, covering both the language itself and the standard library as well as commonly used t...
twitter.com
#pragprog/ruby/rails#published-book/book-programming-ruby-3-2-5th-edition
28 8550 13
New
PragmaticBookshelf
General Dev>Learning Resources

A Common-Sense Guide to Data Structures and Algorithms in Python, Volume 1
Big O Notation can make your code faster by orders of magnitude. Get the hands-on info you need to master data structures and algorithms ...
pragprog.com
#pragprog/python#published-book/book-a-common-sense-guide-to-data-structures-and-algorithms-in-python-volume-1
24 5988 11
New
CommunityNews
General Dev>In The News

X can’t stop spread of explicit, fake AI Taylor Swift images
Will Swifties’ war on AI fakes spark a deepfake porn reckoning?
arstechnica.com
/swift
0 8379 0
New
PragmaticBookshelf
Backend>Learning Resources

The New and Improved Flask Mega-Tutorial
Overarching tutorial for Python beginner and intermediate developers that teaches web development with the Flask framework. Miguel Gr...
blog.miguelgrinberg.com
#pragprog/python/flask#published-book/book-the-new-and-improved-flask-mega-tutorial
1 3553 0
New
Back to top

Sponsor Spotlight

AppSignal

Catch errors, track performance, monitor hosts and more.

Latest in Elixir

Elixir Portal ❯

Latest in Phoenix

Phoenix Portal ❯

Frontend>Blogs/Talks

Frontend Blogs/Talks ❯

Latest on Devtalk

Devtalk ❯

We ❤️ helpful members!

We reward our most helpful members via our MOTM scheme - by giving away a whopping 25 books per year!

Member of the Month

Devtalk Sponsors

Pragmatic Bookshelf

Practical resources that improve the lives of professional developers.

Erlang Solutions

We build trusted fault-tolerant systems that scale to billions of users.

Honeybadger

Real-time error tracking, performance insights, and observability for devs.

EEF

Supporting innovation across the BEAM ecosystem.

coders51

We build reliable cloud platforms for business-critical systems.

Manning Publications

Develop your skills with books, videos, and courses.

AppSignal

Catch errors, track performance, monitor hosts and more.

WyeWorks

Enabling companies to succeed by building software people love.

Pragmatic Studio

Courses that move you from confusion to "Aha, now I get it!"

Linux New Media

Publishing Linux Magazine, ADMIN, and MakerSpace for 25+ years.

View all our sponsors ❯

Categories:

Sub Categories:

Popular Portals

Devtalk Sponsors

Pragmatic Bookshelf

Practical resources that improve the lives of professional developers.

Erlang Solutions

We build trusted fault-tolerant systems that scale to billions of users.

Honeybadger

Real-time error tracking, performance insights, and observability for devs.

EEF

Supporting innovation across the BEAM ecosystem.

coders51

We build reliable cloud platforms for business-critical systems.

Manning Publications

Develop your skills with books, videos, and courses.

AppSignal

Catch errors, track performance, monitor hosts and more.

WyeWorks

Enabling companies to succeed by building software people love.

Pragmatic Studio

Courses that move you from confusion to "Aha, now I get it!"

Linux New Media

Publishing Linux Magazine, ADMIN, and MakerSpace for 25+ years.

View all our sponsors ❯

We're in Beta

About us Mission Statement See our Roadmap