AIO・SEO情報 /AIO・SEO情報
AIO・SEO情報

Lighthouse TreemapはSEOとAIOに効くか――公式に確認できる範囲と、自サイトでの計測

「Lighthouse Treemapは、SEOとAIOの両方に非常に有効。AIボットは軽量なサイトを迅速に読めるからだ」。こうした趣旨の説明を見かけました。Lighthouse Treemapは実在する便利なツールですが、公式に確認できるのは、表示速度を通じてSEOに間接的に関わりうるところまでです。AIOへの効果は確認できませんでした。この記事では、確認できること、できないことを分けたうえで、Treemapの使い方と注意点、そしてWatchOwlApp自身のサイトで表示速度を改善した経験を紹介します。

先に結論

  • 公式に確認できること:TreemapはページのJavaScriptバンドル(複数のコードを1つにまとめたファイル)の中身を見る可視化ツールで、それ自体はSEOやAIOのスコアではありません。公式文書 Core Web Vitalsは検索の順位づけに使われますが、完璧なスコアを追うことが最良の時間の使い方とは限らない、と公式は述べています。公式文書
  • 公式に確認できないこと:「AIボットが軽量なサイトを迅速に読める」「表示速度がAIの引用に影響する」という説明。AIボットの読み込み速度やJavaScript実行について、今回確認した公式文書に記述は見つかりませんでした。
  • 調査で見えること:一部のAIクローラーがJavaScriptを実行しない、という2024年の調査があります。ただし主なデータは特定のホスティング事業者のネットワークによるもので、現在も同じかは確認できていません。第三者調査

Lighthouse Treemapとは何か

Lighthouseは、ページの表示速度などを測るChrome由来の公開ツールです。Treemapは、2021年5月18日公開のLighthouse v7.5.0で導入された機能で、ページ上のJavaScriptバンドルを、大きさに応じた四角形の並び(ツリーマップ)で見せます。必要な条件は、ソースマップ(バンドルを元のファイルに対応づける情報)にアクセスできることです。公式文書 実行されなかったコードの割合も、Chromeのカバレッジ情報から推定して示します。ただし、集計は最初の読み込み(コールドロード)だけが対象で、ユーザーが操作した後にだけ使うコードは「未使用」と表示されます。公式文書 導入当初はNode CLIで作ったレポートからのみ開けましたが、2021年6月2日公開のv8.0.0で、主要なLighthouseの実行環境(Chrome DevToolsやPageSpeed Insightsなど)のレポートにある「View Treemap」ボタンから開けるようになりました。公式文書

SEOには、間接的に効きうる

Googleの公式ページは、Core Web Vitals(LCP=主要な内容の表示速度、INP=操作への反応、CLS=表示のずれ)がランキングシステムで使われる、と述べています。公式文書 「良好」の目安は、LCPが2.5秒以内、INPが200ミリ秒未満、CLSが0.1未満です。公式文書 一方で同じページは、単一の「ページ体験シグナル」はなく、良い結果が上位表示を保証するものではなく、SEO目的で完璧なスコアを目指すのは最良の時間の使い方ではないかもしれない、とも述べています。また、Googleは、ページ体験が今ひとつでも、最も関連性の高い内容を表示しようとする、とも書いています。公式文書

Lighthouseの公式ドキュメントは、未使用のJavaScriptは読み込みを遅くしうる、と説明しています(描画を止めるスクリプトは、処理が終わるまで表示が進まず、そうでなくても通信の帯域を奪い合う)。公式文書 Treemapは、その「未使用のJavaScriptがどこにあるか」を探す道具です。つまり、Treemap → JavaScriptの削減 → 表示速度の改善 → Core Web Vitals → 順位づけの一要素、という間接的な経路でのみ、SEOにつながります。Treemap自体が順位要因だと述べた公式の記述は、確認できませんでした。

Treemapは、JavaScriptの削減、表示速度の改善、Core Web Vitalsを経て、順位づけの一要素として間接的にSEOにつながりえます。AIO(AIでの引用)への効果は、確認した公式文書に記述がなく、公式には確認できません。
出典:Understanding page experience in Google Search results、Understanding Core Web Vitals and Google search results(Google Search Central)、Remove unused JavaScript(Chrome for Developers)。1本の経路にまとめたのは筆者の整理です。

AIOには、公式には確認できない

Googleの生成AI向けガイド(2026年7月10日更新)は、良いページ体験(待ち時間の短縮を含む)を勧めています。公式文書 また、JavaScriptを使う場合、ブロックされていなければGoogleはその内容を処理できる、と書いています。公式文書 2026年3月4日には、Googleが文書から古い記述を削除し、数年前からJavaScriptを描画していると変更履歴に記しました。公式文書 ただしこれはGoogleの話です。OpenAIとPerplexityの公式のボット文書には、読み込み速度、タイムアウト、JavaScript実行についての記述は、確認できた範囲ではありませんでした。

次は第三者のデータです。ホスティング事業者とWeb調査会社の共同調査(2024年12月17日)は、数か月の観測で、主要なAIクローラーがJavaScriptファイルを取得はするが実行はしなかった、と報告しています。一方、Googleの仕組みを使うクローラーなどは描画していました。ただし、主なデータは1つのホスティング事業者のネットワーク(と検証用の求人サイト2つ)によるもので、2024年時点のものです。第三者調査 別の事業者の2026年5月の記事は、「多くのAIボットは1〜5秒で諦める」「表示が速いページほど引用が多い」と述べていますが、どちらも出典が示されておらず、元の分析を確認できません。同じ記事自身も、Core Web VitalsはAI検索の確定的な直接要因ではない、と認めています。第三者調査

これらを合わせても、「軽量だからAIボットに読まれ、引用される」という因果は確認できません。仮にAIボットがJavaScriptを実行しないとしても、それで大事になるのは、JavaScriptの軽さよりも、重要な本文がJavaScriptなしの元のHTMLに含まれているかどうか(サーバー側で組み立てられているか)です。ただし、これは筆者の推定です。経験則・俗説 なお、Googleが自社のAI機能に向けて勧めているのは、robots.txtやCDNでクロールを許可し、読み取れる状態にしておくことです。公式文書

Treemapの使い方:見えるもの、改善のつなげ方

  • 1

    計測する:Lighthouse(Chrome DevTools、PageSpeed Insights、Node CLIなど)を実行し、レポートの「View Treemap」ボタンからTreemapを開きます。前提として、ソースマップをLighthouseが読める状態(公開するか、計測するコンピューターから読める状態)にしておきます。公式文書

  • 2

    大きな四角形を探す:面積の大きいファイルやライブラリが、転送量と処理時間の大きな部分を占めている候補です。経験則・俗説

  • 3

    未使用の割合を見る:使われていない部分が大きいものは、削る候補です。Lighthouseは、未使用が20KiBを超えるJavaScriptファイルを指摘します。公式文書 ただし前述のとおり、操作後に使うコードも未使用と表示されるため、削る前に機能への影響を確かめます。公式文書

  • 4

    同じモジュールの重複を探す:複数のバンドルに同じ大きなモジュールが入っていると、Treemapが知らせます。公式文書

  • 5

    直して、もう一度測る:1つ直すごとに測り直し、変化を確かめます。経験則・俗説

トレードオフも知っておく必要があります。WordPressのようなCMSでは、プラグインが生成するJavaScriptは、自分で書き換えにくいのが現実です。多くの場合、手段は、そのプラグインをやめる、代替を探す、特定のページだけで読み込むよう設定する、のいずれかになり、手間がかかります。経験則・俗説 また、削りすぎると、フォームや検索、計測のような必要な機能が動かなくなります。Treemapで大きく見えるものが、必要な機能の一部のこともあります。経験則・俗説 速度は、利用者の体験と引き換えにしないのが前提です。経験則・俗説

WatchOwlApp自身の経験:速度改善は、Treemapの出番ではなかった

WatchOwlApp(このサイト)のモバイル表示は、ローカルで実行したLighthouse(モバイル設定)のPerformanceスコアで、2026年9月20日の改善前が64、改善後が96〜99でした。あくまでこの環境での計測値であり、実際の利用者の体験や、検索順位、AIでの引用の変化を示すものではありません。経験則・俗説 記録上、描画までの経路(重要なリソースの読み込みの連鎖)は約2,718msから約305msに短くなりました。経験則・俗説

WatchOwlApp自身の計測(ローカル実行のLighthouse、モバイル設定、2026年9月20日)。Performanceスコアは改善前64、改善後96〜99、描画までの経路は約2,718msから約305msに短くなりました。利用者の体験や検索順位の変化を示すものではありません。
出典:WatchOwlApp自身のLighthouse計測(ローカル実行、モバイル設定、Lighthouse 13.5.0、2026年9月20日)。改善前後の数値は当時の作業記録によるものです。

原因は、JavaScriptではありませんでした。次の3つです。経験則・俗説

  • Google Fontsの外部CSSを読み込んでいた(外部への通信が描画を待たせていた)。経験則・俗説
  • CSSを圧縮していなかった。経験則・俗説
  • キャッシュの設定が無く、毎回すべてを取り直していた。経験則・俗説

対策は、フォントの自前配信(ラテン文字のみに絞って)、CSSのインライン化、サーバー側の圧縮(gzip)と30日のキャッシュ設定でした。経験則・俗説 改善後、同日に測り直したところ(Lighthouse 13.5.0、モバイル設定)、トップページのPerformanceは99、LCPは1.8秒、TBTは50ms、CLSは0でした。転送量は約104KiBで、そのうちスクリプトは1ファイル・約1.7KiBです。経験則・俗説 つまりこのサイトでは、Treemapで見るべきJavaScriptバンドルがほとんど無く、効いたのは、外部CSS・圧縮・キャッシュというJavaScript以外の見直しでした。Treemapは、JavaScriptが多いサイトで力を発揮する道具で、すべてのサイトの最初の一手ではない、というのがこの経験からの実感です。経験則・俗説

まとめ

Lighthouse Treemapは、JavaScriptの重さの原因を探すには役立つ可視化ツールです。SEOには、表示速度を通じて間接的に関わりえますが、公式は完璧なスコアの追求を勧めていません。AIOへの効果は、公式にも調査にも、確認できる形では示されていません。まずは、自分のサイトで何が遅いのかを測ってから、道具を選ぶのが順序です。経験則・俗説 WatchOwlAppの診断結果には、PageSpeed Insightsで取得した表示速度の指標(LCP・CLS・TBT)が指摘として表示されます(総合スコアには含めません)。Treemapのような、JavaScriptの内訳は出しません。

出典

取得日・最終確認日:2026年10月7日。上記のGoogle・OpenAI・Perplexity・GitHub・Chrome for Developers・調査記事は、原文(HTML本文または公式APIの返答)を直接取得し、記事の主張に当たる箇所を原文の文で照合しました。Lighthouseの最新版はv13.5.0(2026年9月18日公開)で、未使用のJavaScriptを指摘する基準(20KiB)は、この版のソースコードでも同じでした。

根拠ラベルの見方: 公式文書Google・Microsoftなどの公式ドキュメント 公式発言公式チャンネル・ブログでの担当者の発言 第三者調査民間の調査・データ(相関と因果は別) 経験則・俗説公式には確認できない、実務上の目安

この記事の更新履歴

最終確認日:(公式情報と照らして内容を確認した日)

  • 以前冒頭で紹介した説明を、特定の出どころがあるかのように書いていた

    現在出どころを特定できなかったため「こうした趣旨の説明」に改めた

  • 以前公式に記述が見つからなかったことを書いた文にも、根拠の印を付けていた

    現在印を外した(公式の文書と照らし合わせて記述がなかったことは、印を付けずに書く)

  • 以前タイトルは「Lighthouse Treemapは、SEOとAIOに効くのか?」だった

    現在自サイトでの計測も扱うことが分かるタイトルに改め、改善前後の数値の図と、Treemapが効きうる経路の図を加えた。あわせて、内容・数値・出典は変えずに、結論を先に書く・一文を短くするなど表現を見直した

  • 以前TreemapはNode CLIで作ったレポートから開く、と手順を案内していた

    現在2021年6月2日のLighthouse v8.0.0以降、主要なLighthouseの実行環境のレポートから開けることを公式リリースノートで確認し、手順を更新した

    出典

  • 以前Googleの「JavaScript SEOの基礎」に、JavaScriptとアクセシビリティ(利用しやすさ)に関する節があった

    現在古い情報として節が削除された。理由は、Googleは数年前からJavaScriptを描画しており、JavaScriptで内容を読み込むこと自体は「Googleにとって難しくする」ものではないため、と変更履歴に記されている

    出典

  • 以前Lighthouseのレポートには、JavaScriptバンドルを一覧できるTreemapは無かった

    現在Lighthouse v7.5.0でTreemapが導入された(導入時は、Node CLIで作ったレポートからのみ。ソースマップが必要)

    出典

AIO Core Web Vitals Lighthouse SEO 表示速度

関連記事