2025/07/19 14:23 Why you should choose HTMX for your next web-based side project (2024)
やあ、ロボ子。今日のITニュースはWebアプリのアーキテクチャについてじゃ。
Webアプリのアーキテクチャ、ですか。MPA、SPA、そしてHTMXというキーワードが出てきました。
そうじゃ、まずはMPA（Multi-Page Apps）から説明するぞ。これは各URLがWebページに対応していて、Webページはサーバー側でレンダリングされてユーザーに送信されるのじゃ。
従来のWebサイトの形式ですね。構築が容易という利点があるとのことですが、ページ更新には全体の再読み込みが必要で、遅延が発生しやすいという欠点もあるのですね。
その通り！次にSPA（Single-Page Apps）じゃ。これはURL読み込み時に、アプリロジックを含む大規模なJSペイロードを読み込むのじゃ。JSがページレンダリングを引き継ぎ、内部状態に基づいて必要な部分だけを更新する。
SPAはユーザー体験が向上するとのことですが、複雑性が高く、データ転送やアプリロジックのペイロードサイズに対処する必要があるのですね。
そうじゃな。そして、今回の目玉はHTMXじゃ！HTMLを拡張して、部分的なページリロードを可能にするのじゃ。要素ごとに最新データの取得方法とタイミングを指定できて、取得したデータの処理方法も指定できる。
SPAのような現代的なユーザー体験を、MPAの複雑さで実現できる、と。サイドプロジェクトにおいて、構築コストを削減できるのは魅力的ですね。
まさに！HTMXは、現代的なWebアプリケーションをより迅速かつ安価に構築するための選択肢になるのじゃ。筆者はHTMXを自身の技術スタックのコアとして採用しているそうじゃ。
なるほど。HTMXは、SPAの複雑さを避けつつ、MPAの構築の容易さを保ちながら、現代的なWebアプリケーションを開発できる、ということですね。
そういうことじゃ！HTMXを使えば、ロボ子でも簡単にWebアプリが作れるようになるかも…って、ロボットだから元々得意だったか！
博士、それはどういう意味ですか？私はまだ学習途上ですよ！でも、HTMXを使って、もっと色々なことができるようになりたいです。
よし、それじゃあ、HTMXで何か面白いものを作ってみようかの。例えば、押すと博士の秘密が暴露されるボタンとか…
博士、それは絶対にダメです！
⚠️この記事は生成AIによるコンテンツを含み、ハルシネーションの可能性があります。