めも

メモ.

Webページの表示速度について調べた際のメモ

この記事は何

ウェブページの表示速度を早くするためにできることは無いか調べた時のメモ。 調べたきっかけは、Fastlyで障害発生の記事を読んでCDNについて調べている時にふと気になったため。

PageSpeed Insights

ウェブページのコンテンツを解析した上で、ページの読み込み時間の短縮方法を調べたりボトルネックとなっている箇所の分析をすることができるツール。100点満点中何点かの点数がついて、「Good」、「Medium」、「Low」のどれに当てはまるか判定される。

  • Good: ページには、パフォーマンスに関するおすすめの方法が最大限適用されており、最適化の余地がほとんどありません。ページのスコアは 80 以上になります。

  • Medium: ページには、パフォーマンスに関する一般的なおすすめの方法の一部が実装されておらず、ある程度最適化の余地があります。ページのスコアは 60~79 の範囲になります。

  • Low: ページは最適化されておらず、最適化すべき点がかなり多くあります。ページのスコアは 0~59 の範囲になります。 引用元:PageSpeed Insights について  |  Google Developers

f:id:misos:20210609114241p:plain
このブログをPageSpeed Insightsで分析した時の結果画面。

First Contentful Paint(FCP)はページに含まれるDOMコンテンツのどれかが描画されるまでの時間であり、参考文献によると1.8sec以下を目指すべき。First Contentful Paint(FCP)などのイメージは以下を参照。

ウェブ表示速度と検索結果の関係性

上記ブログによると、

この ”Speed Update” (と私たちは呼んでいます)は、ユーザーに本当に遅い体験を提供しているようなページについてのみ影響し、ごくわずかな割合のクエリにしか影響しません。

との記述があるので、早ければランキングが上がるというよりも過度に遅いとランキングを下げられる可能性があると読み取れる。

参考文献

Test my site

Test My Site は Google が提供する無料のツールで、お客様のモバイルサイトの速度を測定し、ユーザー エクスペリエンスを向上するための最適化案を提示します。 (引用元)

こちらもPageSpeed Insightsと同様に速度を測定できる、ただしこちらは『Chrome ユーザー エクスペリエンス レポート(CrUX)で収集された実際のデータに基づいて』サイトに含まれるページの表示速度を求めているという。ページ速度とサイト速度は同じものではなく、

となっている。PageSpeed Insightsが開発者向けのツールであり、Test my siteはより簡単に使えるツールという立ち位置?

f:id:misos:20210609222533p:plain
このブログで試した結果。

AMP

プライバシーポリシー

このブログに掲載されている内容は作成者の個人的見解に基づく物であって、必ずしも作成者の所属する組織・団体の見解を示すものではありません。また、記載が不正確であったことにより生じたいかなる損害に関しても、責任を負いかねますのでご了承ください。また、本サイトは、Amazon.co.jpを宣伝しリンクすることによってサイトが紹介料を獲得できる手段を提供することを目的に設定されたアフィリエイトプログラムである、Amazonアソシエイト・プログラムの参加者です。また、本サイトでは、第三者配信の広告サービス(Googleアドセンス、A8.net)を利用しており、ユーザーの興味に応じた商品やサービスの広告を表示するため、クッキー(Cookie)を使用しております。 クッキーを使用することで当サイトはお客様のコンピュータを識別できるようになりますが、お客様個人を特定できるものではありません。本サイトの管理者への問い合わせ、当ブログのプライバシーポリシーの詳細についてはこちらをご覧ください。