2026/08/28 22:28

Htmx 4.0

RSS: https://news.ycombinator.com/rss

要約▶

日本語訳:

htmx 4.0.0 では、XMLHttpRequest など従来の手法をフェッチ（fetch）インタフェースなどの現代のブラウザ API に置き換えるという大きな内部変更が導入されました。この更新により、

hx:xhr:*

のような古来のイベント属性は標準化された名前（例：

htmx:before:request

）へと置き換えられ、

hx-disable

といった非推奨要素は

hx-ignore

に置換されます。移行を支援するため、テンプレートにおけるエラー（付与不足や削除された属性の使用など）をスキャンするコマンドラインツール（

$ npx htmx.org@4.0.0 upgrade-check

）がリリースされています。重要なアーキテクチャ変更として、以前の自動継承からの変更となり、子要素への適用を望む場合、親属性に対して明示的に

:inherited

サフィックスを追加する必要があります。本リリースには、「morph swaps」（

<hx-partial>

タグを通じて）、

hx-live

という名前のスクリプトリングティングソリューション、そして

hx-preload

やストリーミングサポートなどを含むいくつかの新しい拡張機能が含まれています。履歴管理については、デフォルトで localStorage が使用され不再；代わりに、ステアジングが必要なチームのために、

hx-history-cache

拡張機能を通じて sessionStorage を介したキャッシングが可能になります。移行には、バージョン 2.x がバージョン指定なしの CDN で 2027 年初頭まで引き続き利用可能である一方、バージョン 4.0.0 は特定の CDN URL（

https://unpkg.com/htmx.org@4.0.0/dist/htmx.min.js

）でアクセス可能です。アップグレードを行う企業は、非推奨要素を置換し、履歴キャッシングロジックをこれらの標準化された振る舞いと整合させる必要があります。

本文

htmx 4.0.0 リリース

htmx チームより、htmx 4.0.0 のリリースを発表します！本プロジェクトには 8 ヶ月（およびゲーム開発）を要し、その成果に満足を覚えます。

背景

htmx 4 のアイデアは、「fixi」というプロジェクトの立ち上げから生まれました。
この過程で、JavaScript の
```
fetch()
```
API や非同期プログラミングへの理解が深まりました。（htmxy は以前逆互換性の理由から
```
XMLHttpRequest
```
を使用していました）
開発のきっかけ：
- ストリーミング HTML に関するアイデアを持つ Christians 氏からご連絡をいただき、内部処理を
```
fetch()
```
  に移行することでシンプルになる可能性を感じました。
- その後、マイケルとアレックスも加わり、開発が加速しました。
開発プロセス：
- fixi と htmxy のテストスイートを移植し開始しました。
- 旧挙動を再認識しつつ、新しい実装で徐々に近似させていく方式を取りました。
- 現在、2.x と 4.x の間での挙動差異は少数です。
- Web サービスとして100 年以上健在になるように、明確な意思決定のもと差異への対応を進めています。
バージョン戦略について：
- NPM では 4.0 を最新版としてマークしておりません。これは、CDN URL でバージョン指定を含まずに依存しているユーザーを強制アップグレードさせないためです。
- 結果として、2.x が引き続き「最新版」として維持され、4.0 ラインは少なくとも 2027 年初期 まで「次期版」として残ります（※本ウェブサイトでは 4.0 を参照しています）。

メジャーな変更点

ユーザー視点から見ると htmxy 4 は htmxy 2 とほぼ同様ですが、主な変更点は以下の 3 つです：

属性の継承：もはやデフォルトで暗黙的ではなく、明示的に指定する必要があります（最大のアップグレード項目）。
htmxy イベント名：標準化・整理されました。一部の高度なユーザーはイベントの変更が必要になるかもしれません。
履歴機能：
```
localStorage
```
をデフォルトでは使用しないように変更されました（サポートトラブルの主要原因だったため）。多くのユーザーには目立った変化はありません。

※内部では

XMLHttpRequest

から

fetch()

への移行を行いましたが、利用者の大半にとっては透明です。

属性の継承

htmxy 2 では多くの属性がデフォルトで「継承」されました（親要素に設定すれば子要素にも適用）。これは CSS にインスパイアされた挙動ですが、理解しにくい側面もありました。

htmxy 4 の対応方法：

属性を継承させるには、
```
hx-attr:inherited
```
というサフィックスを明示的に指定する必要があります。
```
hx-disinherit
```
などの属性は不要になり、削除されます。

コード例の比較

<div hx-confirm="Are you sure?">
    <button hx-delete="/item/1">Delete</button>
</div>

<div hx-confirm:inherited="Are you sure?">
    <button hx-delete="/item/1">Delete</button>
</div>

これを容易にするため、継承が必要な箇所を検出するコマンドラインツールを提供しています。

イベント

htmxy 2 のイベントは機能的に成長しましたが、整理不足によりどのイベントが発火しているかが把握しにくかったのが実情でした。

htmxy 4 の変更点：

すべてのイベントが
```
htmx:phase:action[:sub-action]
```
の形式に従います。

htmxy 2	htmxy 4
`htmx:beforeRequest`	`htmx:before:request`
`htmx:afterRequest`	`htmx:after:request`
`htmx:beforeSwap`	`htmx:before:swap`
`htmx:afterSwap`	`htmx:after:swap`
`htmx:configRequest`	`htmx:config:request`

その他のイベント変更

大半のエラーイベントが
```
htmx:error
```
に統合されました（HTTP エラーレスポンス時：
```
htmx:response:error
```
）。
```
htmx:xhr:*
```
イベントは削除されました（
```
fetch()
```
へ移行したため）。
```
htmx:validation:*
```
イベントは、ブラウザ固有のフォーム検証機能への譲歩として削除されました。

※詳細な一覧は「htmxy 4 の新機能」を参照してください。コマンドラインのアップグレードチェッカーは、旧イベント名（

hx-on

属性や JS コード内）をフラグ付きで報告します。

ヒストリ（履歴）機能

htmxy 2 では

localStorage

を利用してページのスナップショットを保持し、バックボタンの遷移時に復元していました。 問題点：このスナップショットにはサードパーティ製 JavaScript ライブラリによる DOM 変異が含まれることがあり、ページ復元時にロジックが適用されないトラブルが多発しました。

htmxy 4 の対応方法：

```
localStorage
```
にキャッシュしない方式に変更されました。
バックボタンの遷移時に htmxy はページを再取得し、以下のようにスワップします：
- ```
<body>
```
  タグ内にスワップするか、存在する場合
```
[hx-history-elt]
```
  の要素内へスワップ。
- これによりサードパーティ製ライブラリの動作を保ちつつ、適切なリクエストキャッシュによる高速化を実現しています。

ローカルキャッシングの代替手段

もしローカルでのキャッシングを希望される場合は、

sessionStorage

から履歴を復元する

hx-history-cache

エキステンションをご利用ください（Alpine.js などのスクリプト解決ソリューションとの統合も最適化されています）。

ニュートな機能

htmx 4 では以下に大きな期待がかかる 2 つの新機能が搭載されています：

Morph Swaps（形態置換）

htmx 本体でそのままモーフィング系 swap をサポートするようになりました。
元々は
```
idomorph
```
ライブラリ作成者のアイデアでしたが、htmx への統合が大幅に改善されシームレスに行われました。

<hx-partial>

アウトオブバンド系 swap と似ていますが、単一要素の置き換えだけでなく複雑な処理にも適しています。

<hx-partial hx-target="#messages" hx-swap="beforeend">
    <div>New message</div>
</hx-partial>
<hx-partial hx-target="#count">
    <span>5</span>
</hx-partial>

エキステンション

htmx 4 では内部処理の

fetch()

移行に伴い、エキステンションの再考が進み、多くの新機能が生まれました。

既存・主要なエキステンションの更新

```
hx-preload
```
：コンテンツを事前ロード（例：マウスオーバー時）してリクエスト速度を向上。
```
hx-download
```
：ネイティブかつ fetch ベースのファイルダウンロード。
```
hx-alpine-compat
```
：htmx と Alpine.js の間での互換性問題を解消。
```
hx-history-cache
```
：履歴を
```
sessionStorage
```
にキャッシュし、Alpine.js との互換性を確保。

ストリーミング HTML エキステンション（新規/更新）

```
hx-sse
```
：text/event-stream を経由したストリーム。
```
hx-ws
```
：WebSocket を経由したストリームおよび送信。
```
hx-multipart
```
：multipart/mixed を経由したストリーム。

フロントエンドスクリプト解像ソリューション

hx-live
：Alpine.js、jQuery、hyperscript にインスパイアされ、フロントエンドスクリプトをより楽しいものにします（DOM ベースの HATEOAS フレンドリーなリアクティビティをサポート）。
htmax.js
バンドル：htmxy と最も人気のあるエキステンションを単一ファイルにパッケージ化し、選択の手間を省けます。

アップグレード

完全なアップグレードガイドは「htmxy 4 の新機能」を参照してください。

アップグレードチェッカー（コマンドラインツール）

アップグレードを手助けするためのコマンドラインツールを提供しています。

$ npx htmx.org@4.0.0 upgrade-check -- ./templates

対応ファイル拡張子：
```
.html
```
,
```
.php
```
,
```
.js
```
,
```
.ts
```
,
```
.jinja
```
,
```
.jinja2
```
,
```
.j2
```
,
```
.erb
```
,
```
.hbs
```
- 追加の場合：
```
--ext
```
  を使用（例：
```
--ext .vue --ext .svelte
```
  ）
出力の例：

Scanning 1 file(s)...
Found 8 issue(s) in 1 of 1 file(s).

templates/index.html:1: [inheritance] hx-headers needs :inherited suffix (descendant on line 3 has hx-delete) (this looks like a CSRF token; without :inherited the header does not reach child elements and the server rejects the request)
templates/index.html:2: [inheritance] hx-target needs :inherited suffix (descendant on line 3 has hx-delete)
templates/index.html:2: [inheritance] hx-confirm needs :inherited suffix (descendant on line 3 has hx-delete)
templates/index.html:3: [renamed-attr] hx-disable -> rename to hx-ignore (hx-disable now means 'disable during request')
templates/index.html:4: [removed-attr] hx-vars is removed -> use hx-vals with js: prefix
templates/index.html:4: [removed-attr] hx-prompt is removed -> load the hx-prompt extension to keep the same syntax
templates/index.html:9: [old-event] old event name "htmx:afterRequest" -> "htmx:after:request"
templates/index.html:9: [old-api] htmx.addClass() is removed -> use element.classList.add()

インストール

htmx 4.0 は、バージョン管理可能なパッケージマネージャー（例：npm）経由、または CDN リンクによりインストール可能です。

<script src="https://unpkg.com/htmx.org@4.0.0/dist/htmx.min.js"></script>

あるいはダウンロードすることもできます。

LLMs

大規模言語モデル（LLM）向けに、以下のスキルファイルを提供しています：

```
htmx-guidance
```
：htmx 4 で開発するためのコアな htmxy スキル。
```
htmx-debugging
```
：開発中の htmxy 問題の診断。
```
htmx-extension-authoring
```
：htmx 4 エキステンションの作成とデバッグ。
```
htmx-upgrade-from-htmx2
```
：htmx 2.x から 4.x へのコードベース移行。

結論

htmx 4 を楽しんでいただけることを願っています。htmx 2 は引き続き長期間サポートされる予定ですので、アップグレードにプレッシャーを感じることなくご検討ください。

ご尽力いただいた皆様へ（感謝）

Michael West：驚異的なチームメイトであり、直感的で創造的な開発者。
Christian Tanul：htmx 4 のアイデアを提案し、ストリーミングおよびライブ系エキステンションをリード。
Alex Petros：シップ（リリース）を安定した軌道に保ってくれた。
Stephen Mitchell：ゲームの天才的な頭脳。
Stu Kennedy：WebSockets エキスペート。
André Ahlert Jr.：IDE とエディタサポートを提供。
Dien Hoa Truong：早期の htmxy 4 でテスト走行を行い、多くのバグ修正を支援。

アップグレードミュージック

htmx のアップデートにはアップグレードミュージクが不可欠！

同じ日のほかのニュース

一覧に戻る →

2026/08/29 0:17

GUI は完全にキーボードで操作可能であるべきです

## 日本語訳：本文は、グラフィカルユーザーインターフェース（GUI）においてソフトウェア開発者が端末ベースの設計に回帰するのではなく、すべての機能がショートカットキーでアクセス可能な直感的かつ完全なキーボード駆動型の体験を最優先すべきであると主張しています。重要な点は、優れたユーザーエクスペリエンスはマウスなしで全てのアクションを行えるようにすることで実現されることであることです。この視点は、高度なキーボード制御がコマンドラインツールのみに属するという一般的な誤解に挑戦しています；その代わりに、著者の新しいアプリ「Klisi」などの現代の GUI は、すべての機能に対して包括的なアクセシビリティを成功裏に実証しています。GNOME ヒューマンインターフェースガイドラインのような業界標準は、アプリケーションがポインティングデバイスとキーボードの両方でシームレスに動作することを明確に要求しています。したがって、完全なキーボードナビゲーションの構築は技術的な課題としてではなく、すべてのユーザーの効率を大幅に向上させることを意図した設計上の選択として捉えるべきです。キーボードサポートをオプションの追加機能ではなくコア要件として扱うことで、企業は全体的な製品品質を向上させ、直感的で迅速なインタラクションを求める外部入力デバイスに依存しないユーザーをよりよくサービスできます。

2026/08/29 0:58

今は、バグという噂だけで exploits を見つけるのに十分なものです。

## 日本語訳: 人工知能エージェントは、現在、人間チームが修正できる速度よりもはるかに速く脆弱性を発見し悪用するため、ソフトウェアセキュリティに対して即座の脅威を呈しています。この拡大するギャップにより、自動化された攻撃は、通常のパッチが公開される数日前、あるいは場合によっては数時間前に発生することがあり、セキュリティ環境そのものが根本的に変化しました。重要な例として、DeepSeek V4 Pro は OCaml 言語の cohttp ライブラリにおけるクリティカルなパス正規化エラーを特定しましたが、Claude Fable などの伝統的な AI モデルは、オープンソースのメンテナンを除外するセーフティフィルターによってこれらの問題を検出できないことがあります。一方、高度なシステムはこうした保護策を完全に回避します。脆弱性の発見からパッチが公開されるまでの間に、エージェント型 AI システムが新たなエクスプロイトを見つけ出すのに十分であるという噂が存在するだけでも、実稼働中の Web サーバーの脆弱性を特定してから 1 分以内にエクスプロイトを作成・テストした事例などがあり、その他には marimo の CVE-2026-39987 が 9 時間以内、Langflow の CVE-2026-33017 が 20 時間以内に悪用された例もあります。その結果、脆弱性の発見から悪用されるまでの平均期間は、近年の歴史において約 63 日であったものが、2026 年にはわずか 7 日にまで崩壊しました（一部のケースでは開示に対して相対的にマイナスの値となっています）。このレポートは Jane Street を経由した Slack で非公開で届けられ、Claude Fable 由来であり、Glasswing セキュリティブロックを有さないためパス正規化に関する関連問題を特定したのは DeepSeek V4 Pro でした。Project Glasswing は西側モデルのセキュリティガードにより通常のオープンソースメンテナンを除外するものの、15 ヵ国にわたる 150 の組織に拡大しています。「Bugonomics」とは、防御側の修復処理能力が LLM で生成されたエクスプロイトに後れを取るというボトルネックを指し、GitHub のプライベートフォークでは CI 統合が制限されマージは単一の PR に限定されるため、複雑なクロスリポジトリの修正には不向きです。この「antibotty」脅威の現実に耐えるために、業界は標準的な防御を超えて進まなければなりません。将来のセキュリティは、Linux カーネルのような継続的なリリース、プロトコルレベルの仮想パッチング、AI 駆動の攻撃生成の絶え間ないスピードに匹敵できる新たな防御ネットワークによるものとなるでしょう。迅速に適応できない場合、防御側は重要なインフラを保護するには単に遅すぎることになります。cohttp の修正には Sapphire Livingstone、Michael Dales、Török Edwin、Patrick Ferris、Hannes Mehnert、Thomas Gazagnaire によって行われたチームワークが関わっています。

2026/08/28 21:58

米国がA/I クレジットに対する制裁を科す

## Japanese Translation: 2001 年に、技術とデジタル権利に関心を持つ自律的反資本主義活動家によって設立された Autistici/Inventati（A/I）ネットワークは、安全で自由な通信を支援するために、無料のデジタル自己防衛ツールを提供しています。商業プラットフォームが利用者のデータを商品化することに対して異議を唱え、A/I は完全にお金のかからないボランティアチームと任意の寄付によって運営されており、サービスの提供に対する報いはありません。そのモデルは厳密に非商業的であり、A/I のマニフェストに同意し、厳格なプライバシーポリシーを尊重する個人やグループのみを対象としています。すべてのサービスリクエストは、これらの原則との整合性を確認するために対話的に手作業で処理されます；マニフェストとプライバシーポリシーを閲覧せずに送信されたリクエストは拒否されます。処理中は、すべての入信リクエストが匿名化され、直ちに破棄されるため、ユーザーデータが請求者の制御から逸脱したり、商業市場に流入したりすることがありません。