Digging into Turbo 8's Morphing Feature in Ruby on Rails

The gist of the blog post and talk is that Turbo frames and streams are useful but often cumbersome to integrate since they are highly focused containers of logic.

They won’t be going away but might be more of a _special-use_ tool coming up with the introduction of morphing which could be a more convenient and useful “default” much like the standard full-page reloads of historical Rails apps.

### Discovering the problem

The Basecamp team has been working on integrating a calendar into their HEY product. In building the new feature, they quickly spotted the constraints of turbo frames and streams. Having to broadcast and update many items on a given page is problematic and overly complex, so they looked for a better approach, one much closer to the default Rails full-page reload conventions.

## What is morphing?

No, this doesn’t relate to Power Rangers, though one could wish!

Morphing is the process of merging one DOM into another without too many side effects. It’s not necessarily natural but the perception our eyes see makes it feel as such.

**The TL;DR;**

Morphing provides smoother updates everywhere rather than selective updates like turbo streams and turbo frames.

Timestamps:
00:00 - Intro and inspiration
01:00 - Why Morphing is necessary for the Basecamp team
03:12 - Create a new app
04:09 - Add Tailwind CSS Rails gem
04:17 - Run tailwindcss-rails installer
04:45 - Boot and preview app locally
05:05 - Install beta versions of Turbo
06:23 - Scaffold out Post and User models
07:39 - Create new user using the Rails console
08:37 - Setup modeling
08:50 - Update posts index and show views and routes
10:38 - Add morph meta tags to the application layout
12:30 - Add broadcasts_refreshes to post model
12:46 - Stream updates for show view
13:29 - Streaming updates to posts as a collection
15:46 - Previewing our work and seeing morphing in action

======

💻 Read the written version:

💎 New to Ruby on Rails? Enroll in my course HELLO RAILS:

Additional Links:

P.S. This stuff takes a long time to make but I love to do it. To help me keep at it consider supporting me. If not monetarily, then subscribe to the channel or share it with someone!

[ricardomordaunt]

This is amazing..Thanks to all the creators and contributors to Ruby on Rails..

[francogaliotti]

Hey, which icon extension do you use for vs code? I really like how it looks

[alexeycherkashin]

Super cool feature. Thats a bit pity to see it relates on timestamps of a parent record when we talk about lists. Because on big projects there are usually at least a few after update callbacks. On the other hand, it should rely on something and updated at field sounds reasonable. However, I'd love to see it configurable in the future

[wpftutorial]

15:50 I really don't understand why touch: true on the relationship would cause the posts to re-render. Very confusing API. Why `turbo_stream_from @user` causes the list of @posts to re-render?

[O_Eduardo]

So, people finally found morphdom.. Nice.

[mateuszbialowas]

Why do you install tailwind after app creation instead of create app with tailwind framework?

[Pausbiru-xz]

what is yjit and how to install it's