
上記のお悩みを解決します。
本記事の内容
- AFFINGER6のテーマでページスピードインサイトスコアを30アップさせた方法(モバイル60→92、パソコン100)
こんな方におすすめ
- AFFINGER6のページ読み込み速度を改善したい方
それでは、本題に入ります。
AFFINGER6の高速化3選
タブで切り替え可能
結論です。
AFFINGER6のテーマで高速化した手順は下記の3つです。
高速化3選
- グーグルアドセンス遅延読み込み
- AsyncJavaScriptの導入
- Autoptimizeの導入
ココがポイント
高速化前の携帯電話のスコアは60でした。
簡単ではありますが、私がAFFINGER6で高速化をした手順を解説します。
グーグルアドセンス遅延読み込み
グーグルアドセンスの遅延読み込みは一番効果があったと感じています。
参考にさせていただいたサイトは下記です。
やることは簡単です。
step
1グーグルアドセンスのscriptタグを削除
1 |
<script async src="#" crossorigin="name"></script> |
グーグルアドセンスコードの頭にあるscript文です。
見たらすぐに分かりました。
step
2遅延読み込みコードを追記
『AFFINGER管理→その他』にある『コードの出力』部に追記します。
追記するコードは、【爆速】アドセンス広告を遅延読み込みして表示速度を高速化する方法を参考にしてください。
AFFINGER管理 その他
グーグルアドセンスの遅延読み込みをすることで、『第三者コードの影響を抑えてください』を改善することができました。
厄介者・・・
たったこれだけでも、ページスピードインサイトのスコアはだいぶ改善されたのではないでしょうか。
関連
Autoptimizeの『サードパーティのドメインに事前接続 (上級者向け)』にURL貼り付けでも改善されるらしいのですが・・・。
私はうまくいきませんでした。
ココがポイント
グーグルアドセンス遅延読み込みで『第三者コードの影響を抑えてください』を改善!
AsyncJavaScriptの導入
AsyncJavaScriptの設定をします。
設定内容
下記の3つにチェックを入れました。
ポイント
- Enable Async JavaScript?
- Also enable Async JavaScript for logged in users?
- Also enable Async JavaScript on cart/ checkout pages?
日本語に翻訳すると下記です。
参考
- 非同期 Java スクリプトを有効にしますか?
- ログインユーザーの非同期 JavaScript も有効にしますか?
- また、カート/チェックアウトページで非同期JavaScriptを有効にしますか?
チェックを3つ付けた後に、『Apply Async』を押下して、変更を保存します。
Autoptimizeの導入
Autoptimizeの導入しました。
設定内容は下記です。
step
1JavaScriptオプションを設定
JS、CSS & HTMLタブ
下記の3つにチェックを入れます。
ポイント
- JavaScript コードの最適化
- JS ファイルを連結
- インラインのJSも連結
step
2CSSオプションを設定
下記の4つにチェックを入れます。
ポイント
- CSSコードを最適化
- CSSファイルを連結
- インラインのCSSも連結
- すべてのCSSをインライン化
step
3HTMLオプション CDNオプションはチェックなし
HTMLオプションとCDNオプションはチェックはありません。
step
4その他オプション
私は『その他オプション』はすべてにチェックを入れています。
step
5画像の遅延読み込み設定
画像タブ
画像タブ内の『画像の遅延読み込み(Lazy-load)を利用』にチェックを入れます。
EWWW Image Optimizerで遅延読み込みをしている人は、どちらか一方の遅延読み込みで良いと考えています。
まとめ
おさらいをします。
私がAFFINGER6で高速化をした方法3選
ポイント
- グーグルアドセンス遅延読み込み
- AsyncJavaScriptの導入
- Autoptimizeの導入
ココがポイント
私の場合は、上記の3つを実行することでモバイルスコア60→92へアップしました
私が運営している他のブログではSWELLを使っています。
SWELLでは、AFFINGER6で高速化のためにインストールしたプラグインは使っていません。
しかし、AFFINGER6以上の高得点を出すことに成功しました。
SWELLテーマが気になっている方は、ご覧になってください。以上です。