2026年8月28日、軽量JavaScriptライブラリ「htmx」のメジャーバージョン「htmx 4.0.0」が正式リリースされました。fetch()への全面移行や属性継承の明示化に加え、Claude CodeやGitHub Copilotなど生成AIコーディングエージェント向けの「Agent Skill」が同梱された点が注目されています。本記事では公式リリースノートをもとに、主要な変更点とAI時代の開発現場への影響を整理します。
8ヶ月越しの大型アップデートが公開
軽量JavaScriptライブラリ「htmx」の開発チームは、2026年8月28日、メジャーバージョンとなる「htmx 4.0.0」を正式リリースしました。作者のCarson Gross氏が2025年11月のエッセイ「The fetch()ening」で予告してから約8ヶ月、開発チームは公開の四番目のブランチでの試作を経て、ついに正式版の公開にこぎ着けた形です。htmxはHTML属性だけでAjax通信や画面の部分更新を実現できる点が支持され、GitHub上のスター数は約4万8000、npmの週間ダウンロード数は15万を超える主要フロントエンドツールに成長しています。
htmxの作者Carson Gross氏のAIエージェント論については、当サイトの「htmx作者Carson Gross氏に学ぶ『AIエージェントとの正しい距離感』」でも紹介しましたが、今回の4.0では、その「引き算の哲学」がライブラリの実装そのものに反映されただけでなく、AIコーディングエージェントへの対応も大きく強化されました。
htmx 4.0における3つの大きな変更点
開発チームによれば、ユーザー視点で見るとhtmx 4は2系とほぼ同じ挙動を維持しつつ、内部では3つの大きな変更が加えられています。
通信基盤をXMLHttpRequestからfetch()へ全面刷新
htmxは1.0の時代からInternet Explorer対応の都合でXMLHttpRequestを通信基盤として使い続けてきましたが、4.0ではこれをfetch() APIへ全面的に置き換えました。この変更自体はほとんどのユーザーにとって透過的ですが、非同期処理の記述がシンプルになったことで、後述するストリーミング対応やイベント順序の安定化など、周辺機能の実装が大幅に簡素化されたとされています。
属性の継承が「明示指定」に変更
属性の継承がこれまでの暗黙的な挙動から:inherited修飾子による明示指定に変わる点は、開発チーム自身が「最大のアップグレード項目」と位置付ける変更です。htmx 2までは、親要素にhx-confirmのような属性を置くと子要素にも自動的に継承されていましたが、4.0ではhx-confirm:inherited="Are you sure?"のように明示的に指定しない限り継承されません。CSSに着想を得た暗黙の継承は柔軟な反面わかりにくいという課題があり、Gross氏自身「htmx 1.0・2.0における最大のミスだった」と振り返っています。この変更に対応するため、コマンドラインの移行チェックツール(npx htmx.org@4.0.0 upgrade-check)が同時に提供されており、既存テンプレートをスキャンして継承漏れや廃止された属性を検出できます。
履歴機能がlocalStorage依存から脱却
ブラウザの戻る操作に対応する履歴機能についても変更が入りました。htmx 2ではページのスナップショットをlocalStorageにキャッシュする方式でしたが、サードパーティ製JavaScriptによるDOM変更と競合し、多くのサポート問い合わせの原因になっていました。4.0では戻る操作のたびにサーバーへ再度リクエストを送ってページを再構築する方式に変更され、キャッシュを使いたい場合は新設のhx-history-cache拡張機能をオプトインで利用する形になりました。
新機能:モーフィングスワップと<hx-partial>
変更点だけでなく、4.0では新機能も追加されています。
idiomorphを標準搭載したモーフィングスワップ
Gross氏が考案したDOM差分更新アルゴリズム「idiomorph」が、開発者Michael West氏の改良を経てコア機能として標準搭載されました。要素の入れ替えではなく差分だけを更新する「モーフィングスワップ」が、追加のライブラリなしで利用できるようになります。
<hx-partial>タグでOOBスワップを整理
従来の「アウトオブバンド(OOB)スワップ」は、単純なID一致による置き換えと、より複雑な部分更新という2つの用途を1つの構文で無理に賄っていました。4.0で新設された<hx-partial>タグは、hx-targetやhx-swapといった標準のhtmx属性をそのまま使いながら複雑な部分更新を記述できる新しい仕組みで、複数のメッセージや通知件数を同時に更新するようなUIパターンの実装がシンプルになります。
ストリーミングHTML対応がコア機能へ
fetch()移行によって得られた副次的なメリットが、ストリーミング応答への対応強化です。fetch()のReadable Streamsを活用することで、レスポンスを少しずつDOMへ反映する「ストリーミングHTML」がコア機能として整理されました。あわせて、Server-Sent Eventsをカバーするhx-sse、WebSocketをカバーするhx-ws、multipart/mixedをカバーするhx-multipartという3つの拡張機能も刷新されています。生成AIのチャットUIのように、サーバー側からトークン単位で応答を返しながら画面を逐次更新するようなアプリケーションとの親和性が高い変更といえます。
AIコーディングエージェント対応が大幅強化
今回のリリースで開発現場にとって見逃せないのが、AIコーディングエージェントへの対応が明確に打ち出された点です。
npmパッケージに同梱された4つのAgent Skill
htmx 4のnpmパッケージには、dist/skills/ディレクトリに4つのAgent Skillが同梱されています。内訳は、htmx4のマークアップ・属性・イベント・スワップ戦略の書き方を扱うhtmx-guidance、リクエストが発火しない・スワップが期待通りに動かないといった問題を診断するhtmx-debugging、拡張機能の作成とデバッグを扱うhtmx-extension-authoring、htmx 2系から4系への移行を支援するhtmx-upgrade-from-htmx2の4種類です。いずれもプレーンなMarkdownファイルとして提供されており、Claude CodeやGitHub Copilotなど、Agent Skillやカスタム指示の仕組みを持つコーディングエージェントのスキルディレクトリにそのままコピーして使えるほか、プロンプトに直接貼り付けて使うこともできます。当サイトでも以前Claude CodeのAgent Skillsの仕組みを紹介しています。
アップグレードチェックCLIツールでコード移行を自動診断
先述のupgrade-checkコマンドは、AIエージェントによる自動移行とも相性の良いツールです。実行するとテンプレートファイルをスキャンし、「継承指定が必要な箇所」「名称変更された属性」「廃止された属性とその代替方法」「旧イベント名の使用箇所」などを一覧で出力します。この出力結果をそのままコーディングエージェントに読み込ませれば、修正すべき箇所を人間が一つずつ探す手間を減らせます。実際、リリースノートに掲載されているサンプル出力では、CSRFトークンを運ぶhx-headers属性に継承指定が漏れているケースまで具体的に指摘されており、単なる構文チェックにとどまらない実用性がうかがえます。
実装フローへの影響
hx-on属性の記法統一や、htmx:<phase>:<system>[:<sub-action>]という新しいイベント命名規則への統一も、AIエージェントがコードを生成・修正する際の一貫性を高める方向の変更です。属性継承が明示化されたことも、意図しない副作用が減るという意味で、AIが生成したコードをレビューする人間側の負担軽減につながると考えられます。Gross氏がエッセイで繰り返し述べてきた「AIが生成したコードを理解可能な状態に保つ」という考え方が、ライブラリの設計そのものに落とし込まれた形といえるでしょう。
移行時の注意点とアップグレードパス
注意したいのは、htmx 4.0が直ちに標準版として扱われるわけではない点です。開発チームは、CDN経由でバージョン指定なしにhtmxを読み込んでいる既存ユーザーへの影響を避けるため、npmのlatestタグは当面2系に据え置き、4系はnextタグで公開する方針を明言しています。4系がlatestになるのは2027年初頭以降が見込まれており、2系についても「無期限にサポートを継続する」としています。htmx 2.0系は今後も無期限にサポートされ、4.0への移行を急ぐ必要はないというのが公式の立場であり、既存プロダクトを抱える開発チームは、慌てて移行するのではなく、新規プロジェクトや余裕のあるタイミングで段階的に検証していくのが現実的な進め方といえます。
まとめ:AI時代に手堅く「引き算」したアップデート
htmx 4.0は、派手な新機能を前面に押し出すというよりも、通信基盤の刷新と属性継承・履歴機能まわりの「わかりにくさ」の解消に主眼を置いた、地に足のついたアップデートです。同時に、Agent SkillやCLIによる自動診断ツールを同梱するという判断は、AIコーディングエージェントが日常的な開発フローに組み込まれつつある2026年後半の開発現場を強く意識したものといえます。フロントエンドにhtmxを採用している、あるいは採用を検討しているチームにとっては、まずは公式ドキュメントの移行ガイドとAgent Skillに目を通し、自社の開発エージェントにどう組み込めるかを検討してみる価値があるアップデートだといえるでしょう。
