Extending Our Page with Turbo Streams

Turbo Streams

Turbo Streams is the next step in using Turbo to make pages more dynamic without writing any custom JavaScript. It helps to think of this development process as a successive enhancement.

Let’s recap:

• We started with a working page that needed to be more interactive.

• We therefore added inline editing and more responsive updates to part of the page.

• Now, we’ll add the ability to update multiple parts of a page from a request.

Turbo Streams allow us to send a defined amount of HTML content to the page and have that content replace or augment existing content in multiple designated locations on the page. It’s designed for exactly our kind of situation, where we want multiple parts of the page to update from a single request. Turbo Streams is also designed to work well with WebSockets using ActionCable, which we’ll talk about later in Immediate Communication with ActionCable.

A Turbo Stream is another custom HTML tag, <turbo-stream> ...