「マイクロフロントエンド」を読みました

DAZN の Luca Mezzalira さんが書かれたマイクロフロントエンド を読みました。簡単な書籍レビューを残しておこうかなと思います。

なぜマイクロフロントエンドを使うのか

従来のモノリスなフロントエンドから、マイクロフロントエンドに置き換えることで、どういう価値があるのでしょうか。 書籍に書いてある内容と、自身の意見を混ぜて以下に列挙します。

• 機能開発のイテレーションが短くなる
  • 1 チームに 1 サブドメインという小さなスコープのため
• チーム内の意思決定がしやすい
  • コードベースが小さいため
• リリース速度が早い
  • 各チームが独立しているため

1 チームが小さなサブドメインで独立することで、開発やコミュニケーション、リリースなどのコスト低減ができます。 これは、最終的には顧客への価値提供するサイクルを短くすることに繋がります。

マイクロフロントエンドの導入方法

書籍には、実例として既存アプリケーションをマイクロフロントエンドへマイグレーションする話があります。 マイクロフロントエンドは、その設計の性質上、基本的に(既存アプリケーションからの)マイグレーションとセットです。 そのため、マイグレーションをどのように進めるかというのは、とても重要です。

その中で、マイクロフロントエンドへの最初の一歩として、次のパターンがあります。

• 共有コンポーネントをマイクロフロントエンドとしてリリース
• 新機能をマイクロフロントエンドとしてリリース
• 既存アプリケーションの一部をマイクロフロントエンドとしてリリース

要は、段階的に導入しましょうという話です。 また、マイクロフロントエンドには、従来の SPA 開発に似ている垂直分割という方法が最初の一歩としてお勧めのようです。

• 垂直分割
  • 1 つの画面に 1 つのマイクロフロントエンド
• 水平分割
  • 1 つの画面に複数のマイクロフロンエンド

ちなみに、マイクロフロントエンドとコンポーネントは、次のように区別します。

• マイクロフロントエンド
  • サブドメインのビジネス表現
  • ロジックをカプセル化し、イベント通信
• コンポーネント
  • 再利用性の目的で使用される技術的ソリューション
  • 拡張しやすく複数のプロパティを公開

書籍にあった好きな言葉

付録にある、New Relic で働かれている Erik Grijzen さんのインタビュー記事にて、

• Q. マイクロフロントエンドを 3 語で表現すると
• A. Scaling UI Development

という回答がありました。 Scaling UI Development という言葉、めちゃくちゃ好きになりました。

マイクロフロントエンドは、フロントエンドをサブドメインで分割し、小さく独立した開発が可能となります。 大規模な 1 つのアプリケーション開発や、1 つのブランド内の様々なプロダクトを提供するアプリケーション開発に対しては、マイクロフロントエンドは効果的だと思っています。

終わりに

余談ですが、ブログを書く時間が、徐々に減っています。 1 年前とかは、1 日とか使っていたんですが、今日は 30 分とかです。 効率化できている訳じゃなく、単純に時間がなくなってきたなと思います。

-

読者になる

|

シェアする

|

ブログを応援する

この記事がよかったら、お布施という形で応援してもらえるとうれしいです。

おふせぼたん

関連する記事

タグ「フロントエンド」の記事

モジュールアップデートでやっていること

ITヲタクな AI くんにピッタリな仕事の一つは、モジュールアップデート。 特に、メジャーアップデートが超助かる。 昔だったら 数ヶ月掛かった移行も、数日たらずに対応できるようになったので、 さすが ITヲタクくん。 対応してよかったフロー

2026年07月24日

AI

フロントエンド

写経テストコードを全部消した

以下で書いた通り、プロダクトコードを写経したテストコードを削除しました。 "こぶりー" ( https://kobliy.vercel.app/ ) という個人ブログを読むアプリのコードです。 https://silverbirder.gi

2026年06月08日

AI

フロントエンド

テスト

念の為に、手動確認をしよう

最近のお悩みは、Webのソフトウェア開発におけるテストコードが爆増したことにより、 テスト成功による過度な安心感 によって手動確認するのが減っているのかもと思ったりしています。 例えば、Webのフォーム画面に小さな改修があったとして、その修

2026年06月03日

AI

フロントエンド

タグ「書籍レビュー」の記事

『だけじゃない ケイセン デザイン』を読みました。

今日は休みなので、以下の罫線についてのデザイン本を読みました。 https://www.sbcr.jp/product/4815637484/ テレビとかをみながら読んだので、少し粗めですが感想を書きます。 誰向け？ この本は、おそらくデザ

2026年07月22日

書籍レビュー

『だけじゃない ケイセン デザイン』を買いました。

以下の書籍を購入しました。 https://www.sbcr.jp/product/4815637484/ まだ読めていません。 経緯 以下の記事で書いたように、『表層UIデザインの解剖学』という書籍から UIデザインで気づく観点を養うこと

2026年07月21日

書籍レビュー

『表層UIデザインの解剖学』を読みました。

技術評論社 から出版された『表層UIデザインの解剖学』を読みました。 https://gihyo.jp/book/2026/978-4-297-15706-7 本記事では、読了した感想について記録したいと思います。 UI と物理世界 UI

2026年07月12日

書籍レビュー

← ブログ一覧へ