跳到正文
gihyo.jp·· 42 分鐘前AI 評分56

X 從零重建網頁應用程式基礎架構,整合三套伺服器以加快低速網絡載入

X、Webアプリ基盤をゼロから再構築 ―3つのサーバーを統合し低速回線での表示を大幅にスピードアップ

AI 導讀

X 工程團隊把原有三套 Web 伺服器整合至單一 Web 應用程式基礎架構,以改善低速網絡下的載入速度。在模擬低速網絡的登入狀態比較測試中,個人檔案顯示首篇貼文的時間由 23.9 秒縮短至 2.7 秒。新架構按一般用戶、搜尋爬蟲及連結預覽機械人採用不同渲染流程;未登入用戶頁面和爬蟲流量已完成遷移,已登入用戶頁面正按國家逐步推出。

正文

Xのエンジニアリングチームは2026年11月4日、約10年間運用されてきた3種類のWebサーバーを統合し、新しい単一のWebアプリケーション基盤をゼロから構築したことを発表した。この再構築により、Xの低速回線での読み込み時間が大幅に改善され、低速回線を再現したログイン済み状態の比較テストでは、プロフィール表示(最初の投稿が表示されるまで)が23.9秒から2.7秒に短縮されたという。

The web rewrite is working. On a slow connection, the old X web took more than 22 seconds to show the first post on a profile. The new X web does it in 2.7 seconds. Here's how we did it, and how we're rolling it out one country at a time. https://t.co/LBUqTnINTa

— Yagiz Nizipli (@yagiznizipli) November 4, 2026

新しいWebアプリは5人のエンジニアがAIコーディングエージェントと協力し、6ヵ月足らずで最初のバージョンが構築された。その後、ログインユーザー用ページの移行につれてチームは拡大し、9月末以降、20人以上がこのアプリの開発に携わっている。

なぜ再構築したのか

これまでXではアクセス元や目的に応じて以下の3つの異なるサーバーが稼働していた。

rweb
一般ユーザー向けのSPA(Single Page Application)サーバーで、Reactを使うクライアントアプリとHTMLのアプリケーションシェルを返すNode.jsサーバーで構成されている。ブラウザ側で大量のJavaScriptとAPIリクエストを実行するアーキテクチャとなっており、低速回線では画面表示まで長い待機時間が発生していた。
rweb SSR
検索クローラー向けSSR(Server-side rendering)を担当するサーバー。
Jetfuel SSR
検索エンジン向けの公開ページ(トピック、イベント、Spaces等)用のSSRサーバー。

このため、1つの修正を行うために3つのサーバーそれぞれを修正する必要があり、メンテナンスコストが増大している点や、未ログインの一般ユーザーには重いJSの処理が必要な一方、クローラーにはレンダリングされたHTMLが高速に送られるという状況、そして技術スタックの老朽化のため、パフォーマンス改善などの改修が進まないという問題があった。

新アーキテクチャの特徴

これらの問題を解決するため、1つのサーバーで上記の3種類の対象に最適な形で配信できることを目的に、サーバーが再構築された。新アーキテクチャはNext.js等のフルスタックフレームワークに依存せず、Fastify上にReact 19相当のStreaming SSR+Suspenseのパイプラインを構築し、ターゲットに応じて配信パイプラインを分岐させて対応している。

一般ユーザーのアクセスにはサーバーがシェルを準備できたらすぐに返答し、ストリーミングHTMLとして届いたパーツから順次描画、GraphQLレスポンスをHTMLに埋め込み、ブラウザ側のRelayストアで再利用することで高速化を図る。また検索クローラーにはすべてのSuspense境界が解決するまで待機して1枚の完全なHTMLを一括返却。ハイドレーション用JSやルーターステートを完全除外し、Googlebotの上限(2MB)未満に抑えた完全バッファリングHTMLを返す。そしてリンクプレビュー用ボットからのリクエストには本文(body)のレンダリングやタイムライン取得クエリを完全にスキップしたメタデータ専用HTMLを最小のフットプリントで返している。

またUIには、Base UIとTailwind CSSを基盤とする新しいコンポーネントライブラリ「XDS」を採用。ボタンやメニュー、ダイアログなど40以上のコンポーネントが提供される。

新しいサーバーは既存のrweb等を稼働・更新し続けながらの段階的移行を行っている。未ログインユーザー向けページとクローラー向けトラフィックは移行が終わっており、ログイン済みユーザー向けのページについては、社内テストを経て国ごとに段階的にロールアウトを行っている。

來源:gihyo.jp · gihyo.jp