2023年 Webフレームワーク性能レポート

• CrUX、HTTP Archive、Core Web Vitals の3つのデータセットを活用
• Astro、Gatsby、Next.js、Nuxt、Remix、SvelteKit、そして WordPress まで比較（Web市場シェアが43%のため）
• Google CWV 評価の通過率
  • Astro 67% > SvelteKit 45% > Gatsby 39% > Remix 35% > WordPress 30% > Next.js 27% > Nuxt 20%
  • First Input Delay (FID)、Cumulative Layout Shift (CLS)、Largest Contentful Paint (LCP)、Interaction to Next Paint (INP)
• Lighthouse の性能スコア、中央値
  • Astro 65% > SvelteKit 52% > Remix 46%
• JavaScript ペイロードサイズ
  • Astro 277KB > SvelteKit 323KB > Remix 568KB

[nyang]

静的サイトを作る機会は思った以上に多く、Astroをそこまで敬遠する理由はない。
SvelteKitは簡潔な文法を持っているが、SolidStartと違ってアイランドをサポートしていないため、Astroを加えるのがよい補完策になる。
しかし、Solidの作者ライアンが言及しているように、アイランドは「いくつかある方法の一つにすぎない」。視野を広げ、それぞれの状況に合った方法を使うことが重要だ。

[serialine]

(1) かなり混在したユースケースを比較している一方で、初回ページロードを過度に重視していること。Next や Nuxt のような汎用フレームワークは、Astro のようにコンテンツ中心の「サイト」のために明示的に設計されたフレームワークと比べて、「アプリ」の構築に使われることのほうがはるかに多いです。

こうした異なるユースケースでは、ページロード時の速度とロード後のインタラクション速度に関する最適化の優先順位が大きく異なりますが、このレポートはそれらの異なるユースケースのデータを無差別に混ぜています。

Astro がコンテンツ中心サイトの構築に長けていることを示すのであれば、データはサイトとアプリをまとめて比較するのではなく、異なる fw で構築されたコンテンツ中心サイト同士だけを比較すべきです。INP (Interaction to Next Paint) への言及があるにもかかわらず、この比較には依然として根本的な欠陥があります。

(2) フレームワークの世代によるバイアス。これはレポートの末尾で触れられていましたが、もっと目立つ形で指摘されるべきだったと思います。特に最新の Nuxt 3 は Nuxt 2 と比べて大幅な性能向上を提供していますが、データセットの大半は既存の Nuxt 2 サイトで構成されている可能性が高いです。

パフォーマンスに関する一般的な Web 開発の力量は時間とともに進化するため、FW の時代性は FW 自体以上に多くのものと関係しています。Next と Nuxt は 2016 年に公開されました。当時の開発者は一般に最新のパフォーマンスのベストプラクティスをよく理解しておらず、CWV のようなガイド指標も存在していませんでした。

(3) 選択／標本バイアス。このレポートでは、データセット内の各フレームワークについて何件のサイトが収集されたのか明示されていませんが、Astro サイトの数は以前からあるフレームワークの一部にすぎないだろうと思います。

パフォーマンス志向のマーケティングを行う若いフレームワークである Astro の現在のユーザーベースは、主としてパフォーマンスに敏感なアーリーアダプターで構成されている一方、より主流のフレームワークは採用の広さゆえに、平均するとパフォーマンスへの感度がそれほど高くないユーザーベースを持つことになります。

私は、Astro は意図されたユースケースに対して高い性能を持つと思っていますが、いつものことながら、マーケティング上の動機を踏まえつつ、性能比較は割り引いて受け止めるべきです。

===
https://twitter.com/youyuxi/status/1633249827755814912

[xguru]

Astroチームが書いた記事であることを念頭に置いて読んでください ;)