ウェブフレームワーク

ウェブフレームワーク（WF）またはウェブアプリケーションフレームワーク（WAF）は、ウェブサービス、ウェブリソース、ウェブAPIなどのウェブアプリケーションの開発をサポートするために設計されたソフトウェアフレームワークです。ウェブフレームワークは、ワールドワイドウェブ上でウェブアプリケーションを構築および展開するための標準的な方法を提供します。ウェブフレームワークは、ウェブ開発で実行される一般的な作業に関連するオーバーヘッドを自動化することを目的としています。たとえば、多くのウェブフレームワークは、データベースアクセス、テンプレートフレームワーク、セッション管理用のライブラリを提供し、コードの再利用を促進します。[ 1 ]多くの場合、動的なウェブサイトの開発を対象としていますが、静的なウェブサイトにも適用できます。[ 2 ]

歴史

ワールド・ワイド・ウェブの設計は本質的に動的ではなかったため、初期のハイパーテキストはウェブサーバー上に公開された手作業でコーディングされたHTMLテキストファイルで構成されていました。公開されたページへの変更は、ページ作成者が行う必要がありました。1993年には、外部アプリケーションとウェブサーバーを連携させるための共通ゲートウェイ・インターフェース（CGI）標準が導入され、ユーザーの入力を反映する動的なウェブページが提供されるようになりました。[ 3 ]

しかし、CGIインターフェースのオリジナルの実装では、リクエストごとに別々のプロセスが開始されるため、サーバーの負荷に悪影響を与えることがよくありました。[ 4 ]最近の実装では、サーバーのリソースのフットプリントを削減し、全体的なパフォーマンスを向上させるために、他の技術の中でも永続的なプロセスを使用しています。

1995 年に、完全に統合されたサーバー/言語開発環境が初めて登場し、 ColdFusion、PHP、Active Server Pagesなどの新しい Web 専用言語が導入されました。

動的な Web ページを作成するための言語のほとんどには、一般的なタスクを支援するライブラリがありますが、Web アプリケーションでは、 HTML の作成など、特定のタスクに特定のライブラリが必要になることがよくあります(たとえば、Jakarta Faces )。

1990 年代後半には、 Web 開発に役立つ複数のライブラリを単一の統合ソフトウェア スタックに集めて、Web 開発者が使用できる 成熟した「フル スタック」フレームワークが登場し始めました。

フレームワークアーキテクチャの種類

ほとんどの Web フレームワークは、モデル - ビュー - コントローラ(MVC)パターンに基づいています。

モデル・ビュー・コントローラ（MVC）

多くのフレームワークはMVCアーキテクチャパターンに従い、データモデルをビジネスルール（「コントローラー」）とユーザーインターフェース（「ビュー」）に分離します。これは、コードのモジュール化、コードの再利用の促進、そして複数のインターフェースの適用を可能にするため、一般的に良いプラクティスと考えられています。Webアプリケーションでは、これにより異なるビューを提示することが可能になり、例えばモバイルブラウザとデスクトップブラウザで異なるWebページを提供したり、機械可読なWebサービスインターフェースを提供したりすることが可能になります。

プッシュベースとプルベース

ほとんどのMVCフレームワークは、プッシュベースのアーキテクチャ（「アクションベース」とも呼ばれる）を採用しています。これらのフレームワークは、必要な処理を実行するアクションを使用し、データをビュー層に「プッシュ」して結果をレンダリングします。[ 5 ] これとは別に、プルベースのアーキテクチャ（「コンポーネントベース」とも呼ばれる）があります。これらのフレームワークはビュー層から開始し、必要に応じて複数のコントローラーから結果を「プル」することができます。このアーキテクチャでは、複数のコントローラーが単一のビューに関与することができます。

3層組織

3層構造では、アプリケーションはクライアント、アプリケーション、データベースという3つの物理層を中心に構成されます。[ 6 ] [ 7 ] [ 8 ] [ 9 ]データベースは通常RDBMSです。アプリケーションにはビジネスロジックが含まれており、サーバー上で実行され、 HTTPを使用してクライアントと通信します。[ 10 ] Webアプリケーションにおけるクライアントは、アプリケーション層によって生成されたHTMLを実行するWebブラウザです。[ 11 ] [ 12 ]この用語をMVCと混同しないでください。MVCでは、3層アーキテクチャとは異なり、ビジネスロジックをコントローラー（「中間層」）から遠ざけることが推奨されています。[ 13 ] [ 14 ]

フレームワークアプリケーション

フレームワークは、単一のプログラミング言語に基づいてインターネットアプリケーションの構築をサポートするために構築されており、特定の言語の機能を拡張するZend FrameworkやRuby on Railsなどの汎用ツールから、コンテンツ管理システム（CMS）、一部のモバイル開発ツール、一部のポータルツールなどの特定のユーザーアプリケーションを中心に構築されたネイティブ言語でプログラム可能なパッケージまで多岐にわたります。[ 15 ]

汎用ウェブサイトフレームワーク

ウェブフレームワークは、ブラウザやプロトコル（例えばステートレスなHTTPなど）のアーキテクチャルールに従って機能する必要があります。ウェブページはサーバーから提供され、ブラウザはJavaScriptを使用して変更することができます。どちらのアプローチにも長所と短所があります。

サーバーサイドでのページ変更は通常、ページの更新を必要としますが、任意の言語を使用でき、より多くの計算能力を活用できます。クライアントサイドでの変更は、デスクトップアプリケーションのようにページを小さなチャンクで更新できますが、JavaScriptに限定され、計算能力が限られている可能性のあるユーザーのブラウザで実行されます。通常は、この2つが混在して使用されます。[ 16 ] JavaScriptを多用し、ページの一部のみを更新するアプリケーションはシングルページアプリケーションと呼ばれ、通常はクライアントサイドのJavaScriptウェブフレームワークを使用してコードを整理します。

サーバー側

クライアント側

例としては、Backbone.js、AngularJS、Angular、Ember.js、ReactJS、jQuery UI、Svelte、Vue.jsなどが挙げられます。[ 17 ]

現代のフレームワークの機能とトレードオフ

ReactやVueといったJavaScriptベースのウェブアプリケーションフレームワークは、豊富な機能を提供しますが、それに伴うトレードオフも伴います。これらのフレームワークは、ルーティング、コンポーネントベースの開発、状態管理といったネイティブウェブ技術で利用可能な機能を拡張または強化することがよくあります。Webコンポーネント、FetchやESモジュールといった最新のJavaScript API、Shadow DOMといったブラウザ機能といったネイティブウェブ標準は大きく進歩していますが、フレームワークは開発者の生産性向上、大規模アプリケーション向けの構造化パターンの提供、エッジケースの処理の簡素化、パフォーマンス最適化ツールの提供といった機能から、依然として広く利用されています。[ 18 ] [ 19 ] [ 20 ]

フレームワークは抽象化レイヤーを導入することがありますが、これはパフォーマンスのオーバーヘッド、バンドルサイズの増大、複雑さの増大につながる可能性があります。React 18やVue 3などの最新のフレームワークは、並行レンダリング、ツリーシェイキング、選択的ハイドレーションなどの機能でこれらの課題に対処しています。これらの進歩はレンダリング効率とリソース管理を向上させますが、そのメリットは特定のアプリケーションと実装のコンテキストによって異なります。SvelteやPreactなどの軽量フレームワークは、異なるアーキテクチャアプローチを採用しています。Svelteは仮想DOMを完全に排除し、コンポーネントを効率的なJavaScriptコードにコンパイルするのに対し、PreactはReactと互換性のある最小限の代替手段を提供します。フレームワークの選択は、チームの専門知識、パフォーマンス目標、開発の優先順位など、アプリケーションの要件によって異なります。[ 18 ] [ 19 ] [ 20 ]

ウェブフレームワークの新しいカテゴリには、enhance.dev、Astro、Fresh などがあり、ネイティブウェブ標準を活用しながら、抽象化と開発ツールを最小限に抑えています。[ 21 ] [ 22 ] [ 23 ]これらのソリューションは、プログレッシブエンハンスメント、サーバーサイドレンダリング、パフォーマンスの最適化を重視しています。 Astro は、インタラクティブな部分のみをハイドレーションしながら、デフォルトで静的 HTML をレンダリングします。 Fresh は、実行時のオーバーヘッドをゼロにしながら、サーバーサイドレンダリングに重点を置いています。 Enhance.dev は、ウェブコンポーネントを使用して、プログレッシブエンハンスメントパターンを優先しています。 これらのツールは、ロジックをビルド時またはサーバー側で実行するように移行することで、クライアント側 JavaScript への依存を減らしますが、インタラクティブ性に必要な場合は JavaScript を使用します。 このアプローチにより、パフォーマンスが重視され、コンテンツ重視のアプリケーションに特に適しています。[ 18 ] [ 19 ] [ 20 ]

特徴

フレームワークは通常、プログラムの制御フローを設定し、フレームワークのユーザーが様々なイベントを公開することでそのフローに「フック」できるようにします。[ 24 ]この「制御の反転」設計パターンは、フレームワークを定義する原則と考えられており、チーム全員が同じようにカスタマイズできる共通のフローを強制することでコードにメリットをもたらします。[ 24 ]例えば、RubyのSinatra（Express.jsのインスピレーションとなった）などの人気のある「マイクロフレームワーク」では、HTTPリクエストの前後に「ミドルウェア」フックが可能です。これらのミドルウェア関数は任意のものでよく、ユーザーはログ記録、認証、セッション管理、リダイレクトを定義できます。[ 25 ]

Webテンプレートシステム

キャッシング

ウェブキャッシュとは、帯域幅の使用量、サーバーの負荷、そして体感的な「遅延」を軽減するためにウェブドキュメントをキャッシュすることです。ウェブキャッシュは、通過するドキュメントのコピーを保存します。その後のリクエストは、特定の条件が満たされた場合、キャッシュから処理されます。一部のアプリケーションフレームワークは、ドキュメントをキャッシュし、データベースアクセスやテンプレートの解釈といったページ準備の様々な段階をバイパスするメカニズムを提供しています。

安全

一部のウェブフレームワークには、認証および認可フレームワークが付属しており、ウェブサーバーがアプリケーションのユーザーを識別し、定義された基準に基づいて機能へのアクセスを制限できます。Drupalは、ページへのロールベースのアクセスを提供し、ユーザーを作成してロールを割り当てるためのウェブベースのインターフェースを提供する一例です。

データベースアクセス、マッピング、構成

多くのウェブフレームワークは、データベースバックエンドへの統一されたAPIを作成し、ウェブアプリケーションがコードを変更することなく様々なデータベースを利用できるようにすることで、プログラマーが高レベルの概念を扱うことを可能にします。さらに、一部のオブジェクト指向フレームワークには、オブジェクトをタプルにマッピングするオブジェクトリレーショナルマッピングを提供するマッピングツールが含まれています。[ 26 ]

一部のフレームワークは、イントロスペクションやよく知られた規約に従うことで、Webアプリケーションの設定を最小限に抑えます。例えば、多くのJavaフレームワークは永続化レイヤーとしてHibernateを使用しており、必要な情報を永続化できるデータベーススキーマを実行時に生成できます。これにより、アプリケーション設計者はデータベーススキーマを明示的に定義することなく、ビジネスオブジェクトを設計できます。Ruby on Railsなどのフレームワークは、逆の動作、つまりデータベーススキーマに基づいて実行時にモデルオブジェクトのプロパティを定義することもできます。[ 26 ]

ウェブフレームワークが提供するその他の機能としては、トランザクションサポート[ 27 ]やデータベース移行ツール[ 26 ]などがあります。

URLマッピング

フレームワークのURLマッピングまたはルーティング機能は、フレームワークがURLを解釈するためのメカニズムです。DrupalやDjangoなどのフレームワークでは、正規表現を用いて提供されたURLを事前に定義されたパターンと照合しますが、他のフレームワークでは、書き換え技術を用いて提供されたURLを基盤となるエンジンが認識できるURLに変換します。また、Zopeで使用されているグラフトラバーサルという技術では、URLはオブジェクトグラフ（モデルとビュー）をトラバースするステップに分解されます。

パターンマッチングやリライトを用いてリクエストのルーティングと処理を行うURLマッピングシステムにより、より短く「フレンドリーなURL」を使用できるようになります。これにより、サイトのシンプルさが向上し、検索エンジンによるインデックス作成の精度が向上します。例えば、「/page.cgi?cat=science&topic=physics」で終わるURLを「/page/science/physics」に変更できます。これにより、ユーザーにとってURLの記憶、読み取り、書き込みが容易になり、検索エンジンにはサイトの構造レイアウトに関するより適切な情報が提供されます。グラフトラバーサルアプローチもまた、フレンドリーなURLの作成につながる傾向があります。「/page/science」のような短いURLは、単に「/page/science/physics」への長いトラバーサルを短縮したものであるため、デフォルトで存在する傾向があります。

アヤックス

Ajax （ Asynchronous JavaScript and XML ）は、ウェブアプリケーションを作成するためのウェブ開発技術です。Ajaxの目的は、サーバーと少量のデータを裏で交換することでウェブページの応答性を高め、ユーザーが変更を要求するたびにウェブページ全体を再読み込みする必要がないようにすることです。これにより、ウェブページのインタラクティブ性、速度、保守性、そしてユーザビリティが向上します。[ 28 ]

JavaScriptにおけるAjaxプログラミングの複雑さから、 Ajaxサポートに特化したAjaxフレームワークが数多く存在します。中には、より大規模なフレームワークの一部として組み込まれているものもあります。例えば、jQuery JavaScriptライブラリはRuby on Railsに含まれています。

「 Web 2.0」リッチウェブアプリケーション開発への関心が高まるにつれ、AjaxやJavaScriptで直接プログラミングすることの複雑さが明らかになったため、コンパイラ技術が登場し、開発者はJava、Python、Rubyなどの高水準言語でコーディングできるようになりました。こうしたコンパイラの最初のものはMorfikで、その後Google Web Toolkitが続き、その後しばらくしてPyjsとRubyJSという形でPythonとRubyへの移植版が登場しました。これらのコンパイラと関連するウィジェットセットライブラリにより、リッチメディアAjaxアプリケーションの開発は、デスクトップアプリケーションの開発にかなり近いものになっています。

ウェブサービス

一部のフレームワークは、Webサービスの作成と提供のためのツールを提供しています。これらのユーティリティは、Webアプリケーションの他の部分と同様のツールを提供する場合があります。[ 29 ]

ウェブリソース

新しいWeb 2.0 RESTfulフレームワークの多くは、リソース記述フレームワーク(RDF)の概念に基づいて、一種のセマンティック Webオントロジーでリソースのコレクションを構築するためのリソース指向アーキテクチャ(ROA) インフラストラクチャを提供しています。

参照

参考文献

  1. ^複数 (wiki). 「Webアプリケーションフレームワーク」 . Docforge . 2015年7月23日時点のオリジナルよりアーカイブ。
  2. ^ 「オープンソースの静的サイトジェネレーターのトップ10 」。StaticGen 。
  3. ^ 「CGI: Common Gateway Interface」 。2009年4月9日時点のオリジナルよりアーカイブ。
  4. ^ "CGI" . www.ibm.com . 2021年5月7日閲覧。
  5. ^ Thomson, Kris (2003年10月29日). 「MVC = PullとMVC Pushの明確化」 . 2007年7月29日閲覧。
  6. ^ Microsoft. 「3層ディストリビューション」 . 2011年9月19日閲覧。
  7. ^ Oracle. 「clustering_concepts_10en」（PDF） . 2011年9月19日閲覧。
  8. ^ Robert R. Perkoski. 「Web開発入門」 . 2013年11月7日時点のオリジナルよりアーカイブ。
  9. ^ IBM. 「3層環境でのClient Access Expressの使用」. 2011年9月19日閲覧。
  10. ^ Oracle. 「3層アーキテクチャを理解する」 . 2011年9月19日閲覧。
  11. ^ Microsoft. 「実用的なアーキテクチャ：階層化」 . 2011年9月19日閲覧。
  12. ^ Arokia. 「3層Webアーキテクチャ」 . 2012年7月18日時点のオリジナルよりアーカイブ。2011年9月19日閲覧。
  13. ^ 「ASP.NET MVC コントローラーのベストプラクティス」 。 2011年10月11日時点のオリジナルよりアーカイブ。2011年9月19日閲覧。
  14. ^ Jamis Buck. 「Skinny Controller, Fat Model」 2015年5月16日時点のオリジナルよりアーカイブ。
  15. ^ 「Webフレームワーク入門」 . Wired Magazine . 2018年4月2日閲覧。
  16. ^ KLIMUSHYN, Mel (2015年4月6日). 「Webアプリケーションアーキテクチャ – クライアントサイド vs. サーバーサイド」 . Atomic Spin . 2016年3月6日閲覧。
  17. ^ 「AngularJS vs. Backbone.js vs. Ember.js」 www.airpair.com . 2023年3月26日時点のオリジナルよりアーカイブ。 2016年6月4日閲覧。
  18. ^ a b c Uzayr, Sufyan bin; Cloud, Nicholas; Ambler, Tim (2019年11月). 『JavaScript Frameworks for Modern Web Development: The Essential Frameworks, Libraries, and Tools to Learn Right Now』 Apress. ISBN 978-1484249949。
  19. ^ a b cロハス、カルロス（ 2020年11月13日）。ネイティブWebコンポーネントの構築：PolymerとVue.jsによるフロントエンド開発。Apress。ISBN 978-1484259047。
  20. ^ a b c実践JavaScriptハイパフォーマンス：Node.js、Svelte.js、WebAssemblyを使用してより高速なWebアプリを構築する。ISBN 978-1838821098。
  21. ^ 「Enhance」 . GitHub .
  22. ^ 「Astroフレームワーク」。GitHub 。
  23. ^ 「Fresh」 . GitHub .
  24. ^ a b Fowler, Martin. 「bliki: InversionOfControl」 . martinfowler.com . 2016年3月6日閲覧。
  25. ^ Xue, Qiang. 「Capital One Engineering – 成功するフレームワークを形作った哲学」 www.capitalone.io . 2016年3月13日時点のオリジナルよりアーカイブ。 2016年3月6日閲覧。
  26. ^ a b c「Active Recordの基礎」 . Ruby on Rails . 2021年3月20日閲覧。オブジェクトリレーショナルマッピング（ORM）は、アプリケーションのリッチオブジェクトをリレーショナルデータベース管理システムのテーブルに接続する技術です。…Active Recordは、アプリケーションがテーブル内に格納されたデータを読み取り、操作できるようにするメソッドを自動的に作成します。
  27. ^ 「Active Record Transactions」 . Ruby on Rails . 2021年3月20日閲覧。
  28. ^ 「Ajax webplanoでサイトを作成する」 . webplano.com . 2025年11月23日閲覧。
  29. ^ Maximilien, EM (2006). 「チュートリアル4：Web Services on Rails：RubyとRailsを用いたWebサービス開発とマッシュアップ」. 2006 IEEE International Conference on Web Services (ICWS'06) . pp. 43. doi : 10.1109/ICWS.2006.139 . ISBN 0-7695-2669-1。
「 https://en.wikipedia.org/w/index.php?title=Web_framework&oldid=1325647293」から取得