公開日: 2026 年 6 月 24 日
Nuvemshop（スペイン語圏の中南米では Tiendanube として知られています）は、この地域を代表する e コマース プラットフォームで、18 万を超えるオンライン ショップを運営しています。販売者は複数のテーマと動的コンテンツの配置を通じてストアフロントをカスタマイズするため、この多様性全体でページの読み込みを高速化するには、独自の技術的な課題があります。
- Largest Contentful Paint（LCP）の健全性が 1 年間で 57%から 96% に 68% 向上しました。これは、実際のユーザー向けにビューポートの上部にコンテンツをレンダリングする方法が大きく変化したことを反映しています。
- Core Web Vitalsの合格率が 48% から 72%に上昇しました。つまり、現在では 4 店舗中 3 店舗近くが Google のパフォーマンス基準値を満たしています。
- ショッピング エンゲージメントが測定可能な形で改善: 2025 年 1 月と 2026 年 1 月に有効だったブラジルの店舗の同じコホートを分析した結果、Google オーガニック検索からのモバイル ユーザーは次のようになりました。
- コンバージョン率（セッションから有料注文）が 8.9% 増加
- カート エンゲージメント率（セッションからカートへの追加）が 8.4% 増加
- モバイルで最も大きな改善が見られました。これは、LCP の改善が最も大きかった場所と一致しています。
これらの結果は、Google が委託した Deloitte の調査（37 のブランドの 3,000 万件を超えるセッション）と一致しています。この調査では、読み込み速度が 0.1 秒速くなると、小売業のコンバージョン率が 8.4% 増加することがわかりました。これにより、Google の投資の方向性が正しいことが確認されました。
課題: 動的な e コマース レイアウトでの LCP の検出
2025 年初頭の時点で、Core Web Vitals のしきい値を満たしていたストアは 48% にすぎず、LCP スコアが良好だったストアは 57% でした。当初の仮説は、画像の重みまたはサーバーのレイテンシでした。YouTube の判断が誤っていたことが判明いたしました。
何千ものストアで PageSpeed Insights の分析を行った結果、このプラットフォームでは、販売者がホームページのセクション（カルーセル、バナー、商品グリッド、カスタム モジュールなど）を任意の順序で動的に配置できることがわかりました。
この柔軟性により、予期しない問題が発生しました。適切な要素が LCP として常に識別されるとは限りませんでした。ストアフロントの 85% を占めるカルーセルがあるストアでは、ページがさまざまな画面やデバイスでレンダリングされる方法によっては、ビューポートの下部にあるバナーが最初のカルーセル画像ではなく LCP としてマークされることがありました。つまり、最適化の取り組みが意図した効果を発揮していなかったのです。実際には LCP 要素ではない要素を最適化していたのです。
一般的な SaaS プラットフォームとは異なり、ホームページを修正するだけでは済みませんでした。既存のストアを壊したり、創造の自由を制限したりすることなく、考えられるすべてのテーマ構成、セクションの配置、販売者のカスタマイズに対応できるソリューションが必要でした。
ダイナミック レイアウトが LCP 要素の選択に与える影響
PageSpeed Insights の分析と実際のユーザーのモニタリングを通じて、カルーセルとバナーの CSS トランジションは、要素がブラウザの LCP 検出アルゴリズムに認識されると遅延することがわかりました。ユーザーはカルーセルが最初に読み込まれたと認識していても、ブラウザは 2 番目のセクションのバナーを LCP 要素としてマークすることがありました。これは、その要素の可視性がトランジション効果によって遅延しなかったためです。
根本原因は次の 3 つです。
- 要素が可視と見なされると CSS トランジションが遅延し、LCP 検出が誤ったフレームにプッシュされていました。
- ビューポートの上部にある、すぐに読み込む必要のある画像に遅延読み込みが適用されていました。
- 優先度シグナルが欠落していると、最も重要な画像が最初に読み込まれませんでした。
また、LCP の測定値の大部分がホームページだけでなくカテゴリページや商品ページから取得されていることもわかりました。つまり、修正はトラフィックの多いすべてのページタイプに一貫して適用する必要があるということです。
実装: 3 つの根本原因を大規模に修正する
原因が特定されたため、修正は簡単でした。これらの原則は、すべてのコアテーマとページタイプに一貫して適用しましたが、新しい問題の発生を避けるために、それぞれを慎重にスコープ設定する必要がありました。
- 最初の位置のセクションの CSS トランジションを削除しました。ページで最初に表示されるセクションがすぐにレンダリングされるようになり、ブラウザが人工的な遅延なしで LCP 候補として検出できるようになりました。
ビューポートの上部にある画像から遅延読み込みを削除しました。最初のセクションの画像については、リソース読み込みの遅延をなくすために、条件付きで
loading="lazy"を削除します。このスコープは、最初の位置のセクションの最初の画像のみに限定しました。<!-- Before --> <img src="slide-1.webp" loading="lazy" alt="Featured product"> <!-- After --> <img src="slide-1.webp" alt="Featured product">明示的な優先度シグナルを追加しました。
fetchpriority="high"を追加することで、ブラウザのプリロード スキャナに LCP 画像が最優先のリソースであることを伝え、レイアウトとレンダリングが完了する前に、より早く検出してダウンロードできるようにします。優先度シグナルが適用されるのは、要素が実際に LCP 候補になりうる位置にある場合に限られるように、検証ロジックを追加しました。fetchpriority="high"を多くの画像に追加すると、すべてが高優先度になり、何も優先されなくなるため、逆効果になります。<!-- Before --> <img src="slide-1.webp" alt="Featured product"> <!-- After --> <img src="slide-1.webp" fetchpriority="high" alt="Featured product">エッジ キャッシュによるレイテンシの短縮。キャッシュ保存は読み込み時間の短縮に効果的ですが、e コマースでは、古い価格と在庫データを配信すると、顧客の信頼と収益に直接的な影響を及ぼすというリスクがあります。Google は、パフォーマンス データとビジネス指標をモニタリングしながら、慎重にこの問題に取り組みました。キャッシュ ヒット率を最大化しつつ、販売者や購入者のエクスペリエンスを損なう可能性のあるコンテンツをキャッシュに保存しないようにしました。
影響と結果: LCP が 57% から 96% に改善
| 指標（2025 年 1 月～ 2026 年 1 月） | 相対的な改善率 |
|---|---|
| LCP（良好） | +68%（57 ～ 96%） |
| Core Web Vitals（合格率） | +50%（48% ～ 72%） |
| コンバージョン率（セッションから有料注文） - モバイル Google オーガニック | +8.9% |
| カート エンゲージメント（セッションからカート） - モバイル Google オーガニック | +8.4% |
これらの改善により、Nuvemshop と Tiendanube はブラジル、アルゼンチン、メキシコでパフォーマンス ランキング 1 位の e コマース プラットフォームとなりました。
主なポイントと事後分析の考察
Nuvemshop の高度にカスタマイズ可能なアーキテクチャでは、標準の最適化プレイブックに頼ることはできませんでした。実際の問題は、画像の重みやサーバーのレイテンシではなく、CSS トランジション、優先度シグナルの欠落、ビューポートの上部にある画像に適用された遅延読み込みが原因で、ブラウザが予期しない要素を LCP として選択していたことでした。
根本原因がわかったため、修正は簡単でした。ファーストポジションのセクションからトランジションを削除し、ビューポートの上部にある画像から遅延読み込みを削除し、明示的な優先度シグナルを追加しました。この変更は、すべてのコアテーマ、ページタイプ、プラットフォーム上の 18 万を超えるストアに一貫して適用されました。
その結果は明らかです。LCP の合格率は 57% から 96% に上昇し、Core Web Vitals の合格率は 48% から 72% に上昇しました。また、販売者様は、モバイルでのコンバージョン率が 8.9% 増加し、カート エンゲージメントが 8.4% 増加するという、目に見える成果を実感しています。高速なストアフロントは単なる技術的な成果ではなく、マーチャントの成功に直接つながります。