JavaScript記述なしでモダンUIを作成できる「htmx」、最新版「htmx 2.0」で何が変わったか：HTMLからモダンブラウザの機能に直接アクセス

JavaScriptコードを記述せずに、HTMLからモダンブラウザの機能に直接アクセスできるJavaScriptライブラリ「htmx」の最新版「htmx 2.0」が公開された。

[＠IT]

　htmxチームは2024年6月17日（米国時間）、JavaScriptライブラリ「htmx」の最新版となる「htmx 2.0」を公開した。htmxは、JavaScriptコードを記述せずに、HTMLからモダンブラウザの機能に直接アクセスできるライブラリだ。

　htmxはHTML内の属性を通じて、Ajax、CSS トランジション、WebSocket、Server Sent Events（SSE：サーバ送信イベント）へのアクセスを直接提供する。開発者がハイパーテキストのシンプルさとパワーを生かして、モダンなユーザーインタフェース（UI）を構築できるようにすることを目的としている。

　htmxはサイズが小さく、依存関係がなく、拡張可能だ。htmx 1.xは「Internet Explorer（IE）11」と互換性があり、フロントエンドJavaScriptライブラリである「React」の3割強程度のサイズだった。

　公式ドキュメントによると、htmxは、ハイパーテキストとしてのHTMLの核となるアイデアを拡張し、一般化することで、HTMLで以下のような処理を可能にする。

• アンカーやフォームだけでなく、どんな要素でもHTTPリクエストを発行できる
• クリックやフォーム送信だけでなく、どんなイベントでもリクエストをトリガーできる
• GETやPOSTだけでなく、どのようなHTTPメソッドも使用できる
• ウィンドウ全体だけでなく、あらゆる要素をリクエストによる更新の対象にできる

　「htmxを使用している場合、サーバ側では通常、JSONではなくHTMLで応答する。このため、『ハイパーテキストを通じてアプリケーションの状態をコントロールする』という本来のWebプログラミングモデルを堅持できる」と、htmxチームは説明している。

htmx 2.0の主な変更点

　 htmx 2.0での主な変更点は以下の通り。

• 全ての拡張機能がコアリポジトリから独自のリポジトリとWebサイトに移動した。これらは全て個別にバージョン管理されるようになった。ほとんどの1.x拡張モジュールは2.xで動作するが、SSE拡張モジュールはアップグレードする必要がある
• 「hx-sse」および「hx-ws」属性が削除され、非推奨となった
• HTTP DELETEリクエストのペイロードに、フォームエンコードされたbodyではなく、パラメーターが使われるようになった
• 3つの主要なJavaScriptモジュールタイプ（ESM、UMD、AMD）について、/distでモジュールタイプ固有のファイルが提供されるようになった
• 「hx-on」属性とその特殊な構文が削除され、より扱いやすい「hx-on:」構文が導入された
• 内部APIメソッド「selectAndSwap()」が、パブリックな（はるかに優れた）「swap()」メソッドに置き換えられた
• Web Componentのサポートが大幅に改善された
• Webサイトがダークモードをサポートした

　なお、htmx 2.0はIEをサポートしていないが、IEサポートを必要とするユーザーを想定し、htmxチームは当面、htmx 1.xのサポートを継続する。

　またNPMでは、2025年1月1日まで、htmx 1.xが最新としてマークされ、htmx 2.0はその翌日から最新としてマークされる。htmxのバージョンを管理していないCDN URLを使用しているユーザーを強制的にアップグレードさせてしまうことを避けるためだ。