「アシックス」トップページの表示速度ボトルネック研究
head内Akamai関連インラインスクリプトのレンダリングブロック、不要なフォントpreloadによる帯域消費、Google Fonts（日本語Webフォント Noto Sans JP）の読み込みなどのボトルネックが観測され、これらを解消するシミュレーションではLighthouseスコアが78から最大100まで変化する結果が得られました。Core Web Vitalsの大きな改善が期待できます。
アシックス公式オンラインストア
詳細レポート 
ボトルネック一覧 
差分リポジトリ この研究は自主的に実施したものであり、サイト関係者からの依頼によるものではありません。掲載の取り下げを希望される場合はお問い合わせください。
アシックスはランニングシューズやスポーツウェアを中心としたスポーツ用品メーカーで、公式オンラインストアではシューズ・ウェア・アクセサリーなどを販売しています。React SPAで構築されたトップページについて、モバイル環境での表示速度上のボトルネックを研究するため、解消シミュレーションを実施しました。
Core Web Vitalsにつながる指標の改善ポテンシャル
観測されたボトルネックを仮に解消した場合、Lighthouse スコアは以下のような変化を示しました。
| 観測時点 | 全ボトルネック解消シミュレーション後 |
|---|---|
 |  |
| 指標 | 観測時点 | 解消シミュレーション後 | 変化量 |
|---|---|---|---|
総合スコア | 78 | 100 | +22 |
LCP | 5.2秒 | 1.2秒 | -4.0秒 |
FCP | 1.6秒 | 0.9秒 | -0.7秒 |
SI | 2.7秒 | 1.7秒 | -1.0秒 |
TBT | 154ms | 53ms | -101ms |
CLS | 0.000 | 0.000 | 変化なし |
総合スコア が78から100へと22ポイント変化するというシミュレーション結果が得られました。特に LCP（Largest Contentful Paint = ページの主要コンテンツが表示されるまでの時間）が5.2秒から1.2秒へと大幅に短縮されており、表示速度に強く影響するボトルネックが複数存在していたことが読み取れます。
読み込みプロセスの変化を動画で体験
本サイトでは、解消シミュレーション後に若干早く表示されるようになった様子が見て取れます。
なお、本ページはページ後半のコンテンツがJavaScriptによる遅延読み込みで制御されているようで、観測時点・解消シミュレーション後ともにページ後半の表示が動画上ではうまくレンダリングされていません。ご了承ください。
サードパーティータグの影響
本研究ではまず、サードパーティータグを段階的に除去することで、タグ全体が表示速度に与えている影響を観測しました。あわせて、タグ由来のノイズを取り除くことで、サイト自体のボトルネックを観察しやすくする狙いもあります。タグを完全に除去することは現実的ではありませんが、最適化によってどこまでの改善ポテンシャルがあるかを把握する材料としてご覧ください。
本セクションは「サードパーティータグがページスピードに影響を与えている」という現実を数値で示すとともに、それらを最適化することでどれだけのスピード改善ポテンシャルがあるかを示唆するものです。
オリジナルページの全233リソースのうち、サイト固有のリソースは88件（約4割）、サードパーティタグ由来のリソースは145件（約6割）を占めていました。ページスピードのボトルネックを正確に把握するには、まずこの6割のタグを取り除いてサイト固有のパフォーマンスを分離する必要があります。
アシックス公式オンラインストアで確認されたサードパーティータグは次のとおりです。
HTMLから直接読み込まれているタグ
| タグ名 | 種別 |
|---|---|
Tealium iQ | タグマネージャー |
BlueConic | CDP（カスタマーデータプラットフォーム） |
Akamai mPulse | 性能監視（RUM） |
Akamai Bot Manager | ボット対策 |
Tealium iQ 経由で読み込まれるタグ
| タグ名 | 種別 |
|---|---|
Criteo | リターゲティング広告 |
DynamicYield | パーソナライゼーション |
CrazyEgg | ヒートマップ |
TikTok Pixel | 広告計測 |
Twitter/X Ads | 広告計測 |
Yahoo広告 | 広告計測 |
Bing Ads | 広告計測 |
LINE Tag | 広告計測 |
CreativeClick | 広告計測 |
| RTB/SSP Cookie同期（18ドメイン） | 広告入札 |
合計で52ドメインにまたがる145件のサードパーティーリソースが読み込まれていました。段階的に除去した際の指標変化は次のとおりです。
| 除去段階 | 総合スコア | LCP | 変化量（スコア） |
|---|---|---|---|
| 観測時点（タグあり） | 78 | 5.2秒 | - |
TikTok Pixel + Twitter/X Ads + Yahoo広告 除去 | 78 | 5.3秒 | 0 |
Criteo + RTB/SSP + DynamicYield + CrazyEgg + Bing + LINE + mPulse + CreativeClick 除去 | 91 | 3.2秒 | +13 |
Tealium iQ + BlueConic 除去 | 98 | 1.9秒 | +7 |
サードパーティータグを全て除去した状態では、総合スコア は78から98へ変化し、LCP は5.2秒から1.9秒まで短縮される結果が得られました。転送サイズも6.89MBから4.82MBへ約2.07MB（30%）削減されています。これはあくまで上限値であり、実際にはこの一部しか実現できないとしても、サードパーティータグの最適化には無視できない改善ポテンシャルがあることが読み取れます。
以降のセクションでは、この状態を起点としてサイト固有のボトルネックを観察していきます。
サイト固有のボトルネック
サードパーティータグの影響を切り離した状態を起点として、サイト固有のボトルネックを調査しました。本研究では全12件のボトルネック仮説を検証しました。その中から、特に影響の大きかった3件を紹介します。
ボトルネック1: head内Akamai関連インラインスクリプトのレンダリングブロック
観察された状況
<head> 内にAkamai mPulse（性能監視）およびBot Manager（ボット対策）関連のインラインスクリプト3つと外部スクリプト1つが配置されていました。<head> 内の <script> タグはHTMLパーサーをブロックし、スクリプトの実行が完了するまでレンダリングが開始されません。これがページの初期描画を遅延させる要因として観測されました。
解消シミュレーションの方法
これらのスクリプトを </body> 直前に移動し、HTMLパースとレンダリングが先行して進む状態を作りました。
シミュレーション結果
| 指標 | 解消前 | 解消後 | 変化量 |
|---|---|---|---|
LCP | 2.1秒 | 1.8秒 | -0.3秒 |
TBT | 128ms | 39ms | -89ms |
総合スコア | 97 | 99 | +2 |
LCP が0.3秒短縮されるとともに、TBT（Total Blocking Time = メインスレッドがブロックされる合計時間）が128msから39msへと大きく変化しました。<head> 内のインラインスクリプトがレンダリングの開始を遅らせ、同時にメインスレッドを長時間占有していたことが、このシミュレーション結果から読み取れます。
ボトルネック2: 不要なフォントpreloadによる帯域消費
観察された状況
<link rel="preload"> によって、初期表示に使用されないフォント3つ（HiraginoW6、HiraginoW8、ASICSSportstyle_W_Rg）が高優先度でダウンロードされている状態が観測されました。preload はブラウザに対して「このリソースを最優先でダウンロードせよ」と指示する仕組みであり、初期表示に不要なリソースに付与すると、本当に必要なリソース（CSSやLCP画像など）とネットワーク帯域を奪い合う原因になります。
解消シミュレーションの方法
初期表示に不要な3つのフォントの <link rel="preload"> を削除し、preload対象を6件から3件に半減させました。
シミュレーション結果
| 指標 | 解消前 | 解消後 | 変化量 |
|---|---|---|---|
LCP | 1.5秒 | 1.3秒 | -0.2秒 |
FCP | 1.3秒 | 1.1秒 | -0.2秒 |
LCP と FCP がそれぞれ0.2秒短縮される結果が得られました。不要なリソースへの preload 指定がネットワーク帯域を圧迫し、初期表示に必要なリソースのダウンロードを遅らせていたことが、この結果から読み取れます。
ボトルネック3: Google Fonts（日本語Webフォント Noto Sans JP）の読み込み
観察された状況
サイトでは Google Fonts から日本語Webフォント Noto Sans JP（3ウェイト: 400/700/800）が読み込まれており、CSS 1件とwoff2フォントファイル20件、合計21リソースが fonts.googleapis.com および fonts.gstatic.com からダウンロードされていました。日本語Webフォントは文字数の多さからデータ量が非常に大きく、英語フォントとは桁違いのリソースサイズになります。
解消シミュレーションの方法
Google Fontsの読み込みを全て削除し、CSS の font-family 指定をシステムフォントにフォールバックさせました。このシミュレーションはサイトの見た目（フォントの表示）が変わることを前提として行いました。
シミュレーション結果
| 指標 | 解消前 | 解消後 | 変化量 |
|---|---|---|---|
FCP | 1.3秒 | 0.9秒 | -0.4秒 |
LCP | 1.6秒 | 1.2秒 | -0.4秒 |
FCP（First Contentful Paint = 最初のコンテンツが表示されるまでの時間）が0.4秒、LCP も0.4秒短縮される結果が得られました。転送サイズも440KB削減されています。日本語Webフォントの読み込みが FCP と LCP の両方に対して無視できない影響を与えていたことが、この数値から読み取れます。Webフォントをサイトで使いたいデザイン上の意図は理解できますが、日本語フォントの場合は文字数の多さから生じるリソースサイズが指標に対して明確に表れるという事実がここに観測されました。
まとめ
アシックス公式オンラインストアのトップページの表示速度を観測したところ、総合スコア 78、LCP 5.2秒という値が計測されました。本研究では、この計測値の背後にあるボトルネックを切り分けて観測するため、順に解消シミュレーションを実施しました。
観測されたボトルネックとその影響は次のように整理できます。
- サードパーティータグの集合体（52ドメイン・145リソース）: 除去によって
総合スコアが +20、LCPが3.3秒短縮。特にCriteo+ RTB/SSP +DynamicYield等の一括除去で +13ポイントの影響が観測されました。 - head内Akamai関連インラインスクリプト: body末尾への移動で
TBTが89ms短縮、LCPが0.3秒短縮。 - 不要なフォントpreload: 削除によって
LCPとFCPがそれぞれ0.2秒短縮。 - 日本語Webフォント（Google Fonts Noto Sans JP）: 読み込み停止で
FCPが0.4秒、LCPが0.4秒短縮。
全ボトルネックの解消シミュレーションを重ねた結果、総合スコア は78から100へ、LCP は5.2秒から1.2秒へと変化しました。観測された各要素がそれぞれ独立して指標に与えていた影響の大きさが、この一連のシミュレーションによって確認できた形です。
アシックス公式オンラインストア
この研究は自主的に実施したものであり、サイト関係者からの依頼によるものではありません。掲載の取り下げを希望される場合はお問い合わせください。
