なぜhotwireを使用しますか？

レールのビューは、時々高速であり、完全に動作することができますが、いくつかの他の回は、すべての種類の問題を引き起こすことができます.たとえば、最も一般的な状況の一つは、アプリケーションが遅く見えることができる多くのパーティションをレンダリングすることです.これは特にプログラマがRailsのビューに関連したアンチパターンに注意しない場合に起こり得る.

また、JavaScriptを動的にブラウザ全体を更新することなく、コンテンツを更新するための代替として使用されている.しかし、それは多くのプログラマに愛されている解決策ではない.「なぜ私はRubyとRailsの幸福のバブルを残したいのか?」(R、subramaniamso、2021).
これが理由です
Hotwireは多くのJSコードを書く必要なしによりインタラクティブで現代の応答システムを開発するために接続を提供するJavaScriptライブラリを使用します.そして、最も重要なこと:速度や応答性のいずれかを犠牲にせずに、従来の単一のページアプリケーションに関連付けられます.

Hotwireには3つのコンポーネントがあります

Turbo:それはHotwireの中心です、そして、それはTurbolinksの新しいバージョンの種類です.また、それは速度と放送のアップデートに使用され、それは2つの要素:フレームとストリームがあります.

刺激:それは柔軟性のために使われます、そして、それはJavaScriptフレームワークに似ていますが、HTMLのために、それはHTMLを全くレンダリングすることに対処しません.また、最小限の労力で迅速な修正を提供するためにターボと完全に刺激ペア.

ストラダ:まだリリースされませんこれは、モバイルハイブリッドアプリケーションに使用されます.

また、ターボはREDISを使用してデータを格納し、アクションケーブルでWebSocketsを処理します.この機能は、コントローラーのクラスで何かを変更しなければならないことなく刺激コントローラを自動ロードするために必要です.

設定する

あなたの宝石ファイルにhotwire Rails宝石を加えてください.この宝石は、ターボと刺激のためのセットアップを含みます;また、redisが含まれます.

は、bundle installを走らせます

は、rails hotwire:installを走らせます

は、yarn installを走らせます

これらのステップは、turbolinksからapp/javascript/packs/application.jsに関連するすべてを削除します.app/views/layouts/application.html.erbで手動でdata-turbolinks-trackに関連した線をdata-turbo-trackに変更します.
ハウツーとスタイル

ターボ機能フレームを設定して起動します.これは、ビルトイン更新をページの部分に提供して、ページ全体ではありません.

ActionCableブロードキャストチャンネルの設定をモデルに追加します.

# app/models/tags.rb

class Tag < ApplicationRecord
  belongs_to :tag_type
  validates :name, presence: true, uniqueness: true

  after_create_commit { broadcast_prepend_to "tags" }
  after_update_commit { broadcast_replace_to "tags" }
  after_destroy_commit { broadcast_remove_to "tags" }
end

あなたのビューを編集し、theturbo_stream_fromを追加します.この例では"tag "のモデルで使用したのと同じ定義でなければなりません.

# app/views/tags/_tag.html.erb

<%= turbo_frame_tag dom_id(tag) do %>
 <i class="tiny material-icons">local_offer </i> #{tag.name} 
<% end %>

我々のアプリで更新したい部分をマークする当社のturbo_frameを作成します.

# app/views/tags/index.html.erb

<h5 class="center-align">Tags</h5>
<%= turbo_stream_from "tags" %>
<%= turbo_frame_tag "tags" do %>
 <%= render @tags  %>
<% end %>
<%= turbo_frame_tag "tag_form" do %>
  <%= render "form", tag: @tag   %>
<% end %>

ラッピング

クライアント側の対話のための刺激のピンチでHotwireとRailsの組み合わせは、それを開発するための強力なオプションで、スケーラブルで使いやすいWebアプリケーションの両方の開発者とユーザー.全体的に、あなたは、この優れた解決にフィットするデザインを考慮する必要があります.

See the original post on MagmaLabs Technical Blog: