#156 Turbo 8 Morphing in real life

25/12/2023
frontend turbo8 morphing hotwire

Turbo 8 adds a new technique of sending HTML over the wire: refresh current page, preserve scroll.

This new approach opens EASYER ways to render elements on current page without passing too much context to TurboStreams.

👮‍♂️ however there some tricky scenarios that you should be aware of! 🚨

Level 1: We will try using PageRefreshes on a new Rails app.
Level 2: Use page refreshes to live-update nested comments in a real app.

Get access to superails.com source code:

  1. Sign in to superails.com with Github
  2. Leave a comment under the video

Episode source code: https://github.com/corsego/156-turbo8/commit/24277eb152f3f0a96f693c454b9244f36604f687
Based on this blogpost: https://blog.corsego.com/hotwire-turbo-8-morphing

0:00 Turbo 8 intro
2:44 Update Table with TurboStreams
6:10 Install Turbo8, enable morphing
10:16 preserve some elements after morph
11:46 live updates
16:18 Turbo Morphing in a real app

2
Join the conversation
Sign in to access PRO lessons, access private repos, leave comments, create watch lists.
We collect your email address, name and username to create your account. We do not share your email address with anyone else.