I see a lot of confusion around Hotwire's components, so here's my attempt at a simple breakdown:
**Turbo** handles page updates without writing JavaScript:
- Turbo Drive: Makes link clicks and form submissions faster (no full page reload)
- Turbo Frames: Update specific parts of a page
- Turbo Streams: Real-time updates over WebSocket or in response to form submissions
**Stimulus** is for the JavaScript you still need to write:
- Small, focused controllers that attach behavior to HTML
- Great for things like toggles, form validation, and interactive widgets
They complement each other. Turbo reduces the JS you need, and Stimulus handles the rest.
Comments (3)
Log in to reply to this post.
This is a really clear explanation. I always struggled to articulate the difference. Saving this for the next time someone asks!
One thing I'd add: Turbo Streams over WebSockets with Solid Cable is incredibly powerful for real-time features. It's like having ActionCable but simpler.
I resisted Hotwire for a long time because I was comfortable with React. After giving it a real try, I'm never going back for Rails apps. So much less complexity.