SPAの代替手段
カーソン・グロス最近、トム・マックライトは、シングルページアプリケーションとその不満に関するいくつかの投稿を書いています。
ウェブ開発における新たな標準は、サーバーサイドレンダリングによるReactシングルページアプリケーションの構築となっています。このアーキテクチャの2つの主要な要素は、次のようになります。
- メインUIは、ReactなどのJavaScriptを使用して構築および更新されます。
- バックエンドは、アプリケーションがリクエストを送信するAPIです。
この考え方は、インターネット全体に広まりました。いくつかの主要な人気ウェブサイトから始まり、マーケティングサイトやブログのような分野にも広がっています。
これらの2つの記事で、トムはReact/SPA至上主義に伴う問題を説明しています。1文でまとめると、SPAフレームワークは複雑になりがちで、その複雑さに見合うだけのメリットが多くの場合得られないということです。
#代替手段
トムは2番目の記事でSPAアプローチのいくつかの代替案を概説しており、htmxにも言及していることを嬉しく思います。しかし、彼はhtmx（StimulusやAlpine.jsも同様）を「プログレッシブエンハンスメント」ライブラリとして分類しています。これは良い説明ですが、少なくともhtmxの場合、このスタイルのライブラリを説明するのにより良い用語があると思います。それは *HTML中心* （あるいは、 *ハイパーテキスト中心* ）です。
#HTML中心開発
HTML中心開発では、HTMLは後付けではなく、アプリケーション開発の主要な媒体として受け入れられます。これは、クライアント側のモデルとそれを操作するJavaScriptが中心となる多くのSPAフレームワークとは対照的です。
HTML中心開発は、ロイ・フィールディングの博士論文で概説されている、ウェブアーキテクチャの元のモデルに基づいています。特に、HTMLをハイパーテキストとして受け入れることで、RESTとHATEOASのメリットを得ることができ、それらのトピックの専門家になる必要はありません。
（思い出してください、ロイはウェブアーキテクチャを *説明* していたため、元のウェブは、参加者の特別な努力なしに、大部分がREST準拠していました）
HTML中心開発を選択することで、多くのメリットが得られます。
- よりシンプルなフロントエンドにより、複雑さの予算を、アプリケーションを他と差別化するバックエンド機能に節約できます。
- 「フロントエンドがJavaScriptで書かれているため」バックエンドでJavaScriptを採用するという圧力に直面しません。これにより、特定のアプリケーションに最適なバックエンドフレームワークを使用できます。
- よりシンプルなフロントエンドにより、「フルスタック」開発者は、アプリケーションのフロントエンドからバックエンドまでの最適化をより簡単に管理および最適化できるため、システムチューニングが大幅に向上します。
- ウェブアプリケーションにはいずれにせよHTMLが含まれるため、そのユーティリティを最大化することで、既存コンポーネントのパワーを高めることができ、エンドユーザーとアプリケーションコードの間に別の複雑なレイヤーを追加する必要がありません。
- ウェブのステートレスネットワークモデルは、非常に堅牢で開発しやすいことが証明されています。HTMLベースのアプリケーションを構築するための多くの成熟した、実績のあるテクノロジーとテクニック（例：キャッシング）が存在します。
#HTML：欠点
HTML中心モデルのこれらのメリットをすべて考慮すると、なぜ多くのWeb開発者によって放棄され（そしてしばしば嘲笑されている）のか疑問に思うかもしれません。高いレベルでは、答えは次のとおりです。
HTML中心アプリケーションは、JavaScriptベースのアプリケーションと比較して、従来、限られた量のインタラクティビティしか提供していませんでした。.
これは、HTMLが限られたハイパーテキストであるためです。特に
<a>と<form>のみがHTTPリクエストを行うことができます。clickとsubmitイベントのみがそれらをトリガーできます。- GETとPOSTHTTPメソッドのみが広く利用可能です。
- リクエストは画面全体を置き換える必要があり、使い勝手が悪く、時には不快なユーザーエクスペリエンスにつながります。
もちろん、これらの制約はハイパーテキストの概念に固有のものではなく、htmxの目標は、それらをすべて削除することです。
これらの制約を取り除き、HTMLを完全に機能的で高性能なハイパーテキストとして完成させることで、HTML中心アプリケーションは多くのアプリケーションドメインでSPAと競合できるようになり、同時に上記で述べた技術的および複雑さのメリットも得ることができます。
#技術的な勇気を持つこと
トムは最初の記事を次のように締めくくっています。
もし皆が間違っていたら？私たちは以前にも間違っていました。
ウェブ開発は何度も行き止まりに陥ってきました。GWT、Java Server Faces、Angular 1、FlatUIなどです。
これらのテクノロジーのハイプサイクルのピーク時には、主流に逆らうのは困難でした。技術の世界では特に困難であり、技術的に遅れをとることは、私たちの自尊心だけでなく、雇用にも脅威となります。
「Reactを使ってもクビになる人はいない」
は今日の
「IBMを買ってもクビになる人はいない」
です。Reactなどが今日の多くの（あるいはほとんどの）ウェブアプリケーションに適していないと感じたとしても、私たちはその現実を受け入れなければなりません。
しかし、SPAアプローチの見直しが始まっています。少し技術的な勇気と、大勢に逆らう意思があれば、アプリケーションをはるかにシンプルにすることができ、アプリケーションがどのように機能するのかではなく、アプリケーションが何をするのかに開発の努力を集中させることができます。
