くりゅぴ!

サーバーやWEB問題解決のメモから生活お得情報まで。未分類のものは執筆中

PageSpeed Insights で重要なこと

PageSpeed Insights
https://developers.google.com/speed/pagespeed/insights/

Googleさんがウェブサイトがどれだけのスピードが出ているか点数を出してくれるサイト。
決して表示スピードが速ければいいわけではなくて、Googleさんのルールをクリアしているかが重要。

CSSやJavascriptの読み込みタイミングや、キャッシュ設定、データ圧縮されているか、サーバーの応答速度が評価される。

PC
スマホサイトに比べサーバーの応答速度はそこまで響かない。
画像などHTMLといったソースコードを見直すことが重要

SP
主にサーバーの応答速度が大きい。
CSSや画像を読み込まないテキストサイトであろうとも、
サーバーの応答速度が遅いと点数が-50ほど落ちたりする。
キャッシュを有効にするなどして、サーバーの処理を減らすことで幾分かマシになる。
HTMLなどのソースコードを見直すより、バックグラウンドの処理を見直したほうが点数は上がりやすい
Cloudflareのキャッシュ機能を利用するとサーバーが貧弱でもいい点数が出せるのでサーバーの性能があげられない場合は試してみる価値は高い。

レンダリングブロックの部分は、
Javascriptをbody閉じタグ前に持ってくる。
CSSでpreloadを利用することによって、回避できる。
また、ページ表示する前にローディング画面を挟むことによって幾分か解消できる場合がある。
head部分にローディングの記述をしてみよう。

参考
Nginxでブラウザのキャッシュを活用する方法
PageSpeed Insightsで100点を取るためにやったこと

WEB開発

タグ:

WEB開発の最新記事

2020年7月13日
印刷時改ページをする
2020年7月10日
PHPのJsを外部ドメインより呼び出す
2020年7月10日
ブラウザにキャッシュさせない

コメントを残す

メールアドレスが公開されることはありません。