【Luxeritas】PagespeedInsightsで「第三者コード～」低評価が出た件、自動広告が原因だった
久しぶりにPagespeedInsightsでサイトを計測していたら、WordPressでLuxeritasテーマ使ってるサイトで40点台のスコアと気になる低評価が。
余計なことしなければ90点は楽勝なLuxeritasでこれは驚きの数値です。
本サイトJill Tone BlogもLuxeritasなんですけど、いろいろ余計なことしてもPagespeedInsightsで94点。問題のサイトの方があまり手を入れてないのになぜだろう。
と、問題のサイトでPagespeedInsightsのご指摘で目新しいところを探してみて、ヤバそうなのを見つけました。
大きくスコアを下げた原因は自動広告と第三者コード
私のサイコパス、こんなに濁ってる……！
結論からいえば、Googleアドセンスの自動広告コードが原因でした。それでPagespeedInsights計測スコアがレッドゾーンに突入。
本ページJill Tone Blogは自動広告コードを入れてなかったので無事で、問題のサイトは手をかけるのが面倒で自動広告入れておしまいにしてたんです。
一見してヤバそうなの見つけた。
第三者コードの影響を抑えてください第三者コードによってメインスレッドが 2,090 ミリ秒間ブロックされました
第三者コードによって、読み込み速度が著しく低下する可能性があります。重複する第三者プロバイダの数を制限したうえで、ページのメインの部分を読み込み終えた後に第三者コードを読み込んでみてください。
2,090ミリ秒ってもう2秒って書いた方が早いレベル。
で、問題の第三者コードのうち2,086 msとほぼすべてGoogle/Doubleclick Adsが原因。
Google/Doubleclick Adsって要はGoogleアドセンスです。コイツが私の色相を曇らせていた……！
確かにセキュリティ性はクリティカルだし、今回のように読み込みに時間食ってるならなおさら。自社のサービスであるGoogleアドセンス用のコードでも例外なく噛みつくって一貫した姿勢はさすが。
対処方法：自動広告コードは消し、自動広告は別方法で
44点から98点、驚くほどクリアな色相。
対処方法は簡単で、Googleアドセンスの自動広告タグを消し、自動広告自体は別の方法で入れること。
それで解決するかはテーマにもよりますが、Luxeritasに限ればこれでPagespeedInsightsで突っ込まれる「 第三者コードによって～ 」を解消可能です。
自動広告タグは通常、下記コードのどちらかを<head>～</head>間に入れます。
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-xxxxxxxxxxxxxxxx",
enable_page_level_ads: true
});
</script><script data-ad-client="ca-pub-xxxxxxxxxxxxxxxx" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>LuxeritasならWordPress管理画面にある子テーマの編集 → Headタグに書き込むのが通常。
どこに入れているにしても上記どちらかのタグが原因で「 第三者コード～ 」と出ているので、記述を消せばとりあえずPagespeedInsightsのスコアは改善します。
自動広告は通常の広告をウィジェットに入れて実装
あとは自動広告ではなく通常のアドセンス広告を入れればオッケー。
いまのGoogleアドセンスは通常の広告コードをどこかしらに入れるだけで自動広告も挿入してくれます。
なのでパンがなければお菓子でいいじゃない的な発言じゃないですよ。こらそこのフランス人、広場にギロチンを組み立てるのはやめなさい。オランジーナ飲んで落ち着けって。な？
Luxeritasはかなり実用的なテーマで、特に広告の位置として鉄板の最初のh2の上と記事下は完備済み。PCはダブルレクタングルとして2つ表示させ、スマホでは1つに絞ってくれる定番な表示も簡単にできちゃいます。
自動広告にまかせっきりでも多分記事上と記事下は出てくれるとは思いますが、手動で入れた方が確実。
しかもLuxeritasに限っていえばウィジェットに広告タグ仕込んでもPagespeedInsightsで低評価を受けることもありません。Googleさんの覚えもよくなってめでたしめでたし。
preconnectでも解決は可能だけど
ちなみに、自動広告のタグを消すのではなく、上記二種類の自動広告タグのうち新しい方の1行タグを使うだけでも90点まで改善しました。
さらに1行タグの読み込みにpreconnectをかけたところ、PagespeedInsightsからの「 第三者コード～ 」の突っ込みが消えて91点に。スコアでだけでいえば1点違いで誤差の範囲程度ですけど、PagespeedInsightsの警告表示が消えるだけでなんだか安心はできる。
ただ、外部からjsを読み込んでいることには変わりがないためか自動広告タグを排除したときほどのスコアは出ず。具体的にいえば下記の通り。
- 1行自動広告タグ：90点
- 1行自動広告タグ＆preconnect：91点
- 通常広告仕込み＆自動広告タグなし：98点
やはりLuxeritasでは自動広告タグは削り、ウィジェットに仕込んでアドセンス側の設定で自動広告が出るようにした方がいいかと。
（通常の広告でも自動広告表示がデフォルトのようなので、アドセンス側で拒否設定しない限り勝手に出るはず）
この方法がきくのはLuxeritasのみかも
ちなみに、この方法でPagespeedInsightsの「 第三者コード～ 」警告からGoogle/Doubleclick Adsを消せるのはLuxeritasだけの可能性が大。
LuxeritasではGoogleアドセンス広告専用のウィジェットが用意されており、読み込みで遅延が出ないようよろしく処理をしてくれているのでしょう。さすがLuxeritas。作者のるなさんには頭が上がりません。
別のWordPressテーマ、例えばLION MEDIAでは自動広告タグは入れず普通のアドセンス広告を入れるだけでもGoogle/Doubleclick Adsが原因の「 第三者コード～ 」警告が出ています。LION MEDIAではLuxeritasでは効いたpreconnectも効かず。
まとめ：LuxeritasがPagespeedInsightsで「 第三者コード～ 」と低評価を受けた場合の対処方法
- PagespeedInsightsで「 第三者コード～ 」と低評価が出る。
- WordPressテーマLuxeritasに限っていえば、自動広告タグを消して通常の広告タグを入れれば解消される。
- いまのGoogleアドセンスは通常広告でも自動広告も出せるので無事解決。
繰り返しになりますが、いまは通常の広告を置くだけで自動広告が表示されるようにできますし、確実に表示したい場所に入れて置けるメリットもあります。
Luxeritasテーマなら普通にウィジェット上に広告をおいて自動広告を表示させた方がいいでしょう。
しかし、asyncが入ってるから一応非同期にはなってるはずですが、それでもダメって結構シビアですね。PagespeedInsights、年々厳しくなっていってる。