マイクロフロントエンドについて
マイクロフロントエンドはフロントエンドのアーキテクチャパターンであり、チームが大規模かつ複雑なフロントエンドアプリケーションを構築および保守するための支援を目的としています。これはマイクロサービスアーキテクチャの考え方を借り、フロントエンドアリケーションをより小さな独立した部分に分割し、各部分を異なるチームが開発、テスト、デプロイできるようにします。
従来のモノリシックなフロントエンド・アプリケーションは拡張を続けると、保守や拡張が困難になる可能性があります。 マイクロフロントエンドの目標は、アプリケーションをより小さく管理しやすいモジュールに分解し、開発チームがこれらのモジュールを独立して開発・デプロイできるようにすることで、チームの効率とアプリケーションの保守性を向上させることです。
ofa.jsは、マイクロフロントエンドの機能を持って生まれたフレームワークで、他のフレームワークとの違いは、ofa.jsで開発されたコンポーネント、ページ、およびアプリケーションは事前にコンパイルする必要がありません。React、Vue、Angularなどの一部のフレームワーク比較して、これらのフレームワークはNode.js環境でのビルドが必要であり、クライアント側で実行するためのコードを生成する必要があります。しかし、ofa.jsの開発コードは静的サーバーに直接配置することができ、追加のビルド手順なしでリアルタイムに表示、使用、実行することができます。
ofa.jsはマイクロ・フロントエンドに準拠しています:
独立デプロイ: 各コンポーネントやページは個別に開発、テスト、デプロイすることができるため、チームは新機能のリリースや問題の解決を迅速に行うことができます。
統合: ofa.jsで開発されたアプリケーションは、さまざまなモジュールを組み合わることができます。これはアプリ、ページ、コンポーネントなどを使用して組み合わせることができます。
独立チーム: 各フロントエンドモジュール(コンポーネント/ページ/アプリ)は独立したチームによって開発およびメンテナンスされることができます。これにより、自律性とイノベーションの促進が図られます。
共有リソース: ofa.jsプロジェクトでは、スタイル、コンポーネント、ページなどの共有リソースが存在する場合があります。これにより、一貫性と効率が確保されます。
オンデマンドロード: ofa.jsアプリケーションは、必要に応じてモジュールをロードすることができるため、アプリケーションのパフォーマンスとロード速度が向上します。
ofa.jsは、VueやReactのようなフレームワークで開発されたコンポーネントを直接使用することはできませんが、ofa.jsに基づいて開発されたコンポーネントは、VueやReactで使用することができ、異なる技術スタックの開発者により高い柔軟性とスケーラビリティを提供します。
VueでWebコンポーネントを使う
Reactでウェブ・コンポーネントを使う: