Turbo Streams: optimistic UI for likes with disable-on-submit

A small UX win: disable the like button immediately and re-enable on failure. Turbo gives you events; Stimulus coordinates button state and the server still returns the canonical count.

Turbo Drive lifecycle: attach global error handler

You’ll eventually hit non-200 responses or network flakiness. Hook Turbo events to log failures (and optionally show a toast). This is a pragmatic production addition that helps debugging without adding heavy tooling.

Turbo Frames: infinite scroll with lazy-loading frame

Infinite scroll can be done with plain HTML + Turbo Frames. Render a “next page” frame with loading: :lazy so Turbo fetches it when it enters the viewport. No JS required, and it degrades gracefully.

Turbo Streams + authorization: signed per-user stream name

Never subscribe clients to guessable user-specific streams. Use signed_stream_name so a user can only subscribe to their own broadcasts. This is essential when streaming private notifications.

Turbo Streams: custom action for flash messages

Flash updates are common enough to deserve a first-class stream action. Defining a custom turbo-stream action keeps views tidy: instead of repeating turbo_stream.update, you can write <turbo-stream action="flash">.

Stimulus: autofocus the first invalid field after Turbo update

Turbo stream re-renders can drop focus, which is rough for accessibility. Use turbo:render to focus the first invalid field inside a specific container. This feels “native” and reduces user friction.

Stimulus: nested fields add/remove without re-rendering

For nested forms, Stimulus can manage the DOM while Rails handles the final params. Use a hidden template + a unique timestamp key. This keeps the server-rendered form simple and avoids JS frameworks.

Stimulus: copy-to-clipboard with fallback + selection

Copy buttons are deceptively tricky across browsers. This Stimulus controller uses the Clipboard API when available, falls back to execCommand, and provides a hook for “Copied!” UI.

Stimulus: debounced search that plays nicely with Turbo

Client-side debounce is best done in Stimulus (not in view helpers). This controller submits the nearest form after a short pause, while letting Turbo handle the navigation and frame replacement.

Turbo Drive: disable caching on volatile admin pages

Turbo Drive caches pages aggressively, which is usually great. For volatile admin dashboards (counts, queues, toggles) you often want no-cache to avoid confusing “stale UI” bugs. turbo_cache_control makes the intent explicit.

Turbo Frames modal: load, submit, then close via stream

A modal is just a frame boundary. Load the modal content into a dedicated frame, then on submit broadcast/stream a close action plus a list update. You get “SPA modal UX” without a frontend router.

Turbo Stream form errors: replace only the form frame

Hotwire forms feel “native” when invalid submissions keep you in context. Replace just the form frame with errors and keep the rest of the page intact. Return 422 so clients and caches behave correctly.