For forms with multiple fields, I like an error summary at the top. With Turbo Streams, you can update just the summary target when validation fails. This is helpful when the form is long and the user might not see inline errors immediately. The serve

Even with model broadcasts, it’s useful to know how streams map to ActionCable channels. Turbo::StreamsChannel is essentially a channel that streams from a signed stream name. When I need custom behavior, I still follow the same scoping rules: identif

Long-running jobs are where Hotwire can feel magical: start an export, then watch progress update live. I give each job a “progress” model, render it in a turbo_frame_tag, and broadcast replacements as the job advances. The job updates percent and sta

Even in a Hotwire-first app, I keep HTML fallbacks because it makes features robust and keeps endpoints usable for bots and scripts. In controllers, I almost always include format.html alongside format.turbo_stream. For example, on create I return tur

Turbo Drive is great for internal navigation, but I disable it for external links or pages that should do a full reload (third-party auth, docs). data-turbo='false' is the simplest switch: it tells Turbo not to intercept the click, so the browser hand

When a session expires, Turbo can end up swapping a login page into a frame, which is confusing. A practical fix is to detect 401 responses on the client and trigger a full-page visit (Turbo.visit) to the login URL. This keeps the app consistent and a

Sometimes you need to attach a header to every Turbo request (like a feature-flag variant, or a client version). Turbo emits turbo:before-fetch-request, which lets you mutate the outgoing request before it is sent. I keep the handler tiny and global (

Turbo includes a progress bar at the top of the page, and it’s a surprisingly visible part of perceived quality. I like to set the color and height to match the app’s brand. This is pure CSS: target .turbo-progress-bar. You can also make it slightly t

Some UI elements should survive navigation: a music player, a search input, or a navbar with an open dropdown. Turbo’s data-turbo-permanent lets you mark a DOM node that shouldn’t be replaced during visits. I use it carefully—permanent nodes can keep

Toasts are a great fit for Turbo Streams because they’re ephemeral UI that doesn’t need a dedicated page. I keep a #toasts container in the layout and turbo_stream.append a toast partial on success events. The toast itself is just HTML with a Stimulus

Turbo gives you a handful of built-in stream actions (append, replace, remove), but sometimes you want behavior like “replace then highlight”. You can implement this as a custom action: send a turbo-stream with action='highlight' and include a templat

Turbo can preload pages on hover (or on touchstart) which makes navigation feel instantaneous. I use data-turbo-preload on links that are likely to be clicked (like list item titles). The server still controls caching and ETags, so it remains safe and