1. Turbo: Turbo is the heart of Hotwire, handling page loads, real-time updates, and lazy-loading content.
2. Stimulus: A minimalistic JavaScript framework that enhances your HTML by adding behaviour and interactivity.
3. Strada: A less prominent part of Hotwire (still evolving), which aims to bridge the gap between web apps and native mobile apps.

• Increased bundle sizes and slower load times.
• Complicated client-side logic and debugging challenges.
• Complex state management across the server and client.

• Faster performance: HTML is sent over the wire instead of JSON, eliminating the need to manipulate the DOM manually via JavaScript.
• Simplified codebase: You don’t need to create and maintain complex front-end JavaScript code or deal with complicated state synchronization between client and server.
• Improved developer experience: By reducing the need for additional tools and frameworks, Hotwire simplifies the development process and enhances Rails’ core strengths: simplicity, convention, and productivity.

• Turbo Drive: Automatically intercepts link clicks and form submissions, sending requests asynchronously without needing to write custom JavaScript. The server responds with HTML, which Turbo updates in the browser seamlessly.
  
  
• Turbo Frames: Allows you to divide a page into small, self-contained sections (frames) that can be updated independently from the rest of the page. This enables partial page updates without requiring full reloads.
  
  
• Turbo Streams: This is where real-time functionality shines. Turbo Streams allow you to push server-side updates to the client over WebSockets, updating HTML without page reloads or AJAX calls. Perfect for real-time features like notifications, chats, or collaborative editing.
  
  
• Turbo Native: For those building mobile apps, Turbo Native integrates your web application with native mobile functionality by bridging web views to the native app shell.
  
  

app/models/comment.rb
class Comment < ApplicationRecord
  after_create_commit { broadcast_append_to "comments" }
end

erbCopy code<!-- app/views/comments/index.html.erb -->
<%= turbo_stream_from "comments" %>

<div id="comments">
  <%= render @comments %>
</div>

javascriptCopy code// app/javascript/controllers/form_controller.js
import { Controller } from "stimulus"

export default class extends Controller {
  static targets = ["name"]

  validate() {
    if (this.nameTarget.value === "") {
      this.nameTarget.classList.add("error")
    } else {
      this.nameTarget.classList.remove("error")
    }
  }
}

erbCopy code<!-- app/views/users/_form.html.erb -->
<div data-controller="form">
  <input type="text" data-form-target="name" onkeyup="this.validate()">
</div>

• No JavaScript fatigue: Many developers find the JavaScript ecosystem overwhelming due to its fast pace and constant need to learn new tools and frameworks. Hotwire eliminates the need to keep up with complex JavaScript libraries, allowing developers to focus on server-side logic and HTML.
• Better performance: By leveraging HTML updates instead of JSON responses that require client-side processing, Hotwire offers faster initial page loads and fewer round trips to the server.
• Fewer dependencies: Rails developers don’t need to add additional tooling like Webpack or Babel. With Hotwire, everything is handled within the Rails ecosystem, reducing external dependencies.

• Real-time chat or messaging systems: Turbo Streams can handle real-time updates for chat applications or customer support systems.
• Collaborative document editing: Using Turbo Frames and Streams, you can build collaborative tools where multiple users can edit documents simultaneously.
• Live notifications: Keep users informed with real-time notifications without building a full JavaScript frontend.