F-lightは作者のえふやん様自身が「AdSense に関しては一切配慮しておりません」と明記されています。
実際にGoogle AdSense（アドセンス）を入れてみると、読み込みが重くなって画像の表示が遅くなってしまう現象が何度か確認されました。
F-lightは素晴らしいテーマなので使いたい！ でもアドセンスも使いたい！
ということで、少しでも読み込みを軽くして表示速度を改善するようにHTMLをいじってみましょう。
本記事では、F-lightのアドセンスにより生じる表示速度の低下を改善する方法を解説します。
DNSプリフェッチを導入しよう
画像の表示が遅くなるのは、アドセンスが重いからです。
そこで、アドセンスを軽くするためにDNSプリフェッチ（Domain Name System Prefetching）を導入します。
DNSプリフェッチは、 リンク先のドメイン情報を事前に取得しておける技術です。
これにより、ユーザーがページを開く際の待ち時間が短縮されスムーズに表示されるようになります。
DNSプリフェッチはHTMLに書き加えるだけで簡単に導入できるので、やってみましょう！
DNSプリフェッチの追加方法
HTMLの編集手順
左のメインメニューから【テーマ】を選択し、カスタマイズ横の【▼】をクリックして【バックアップ】をしましょう。
それが終わったら、同じ画面の【HTMLを編集】をクリックして編集画面を開きます。
HTMLの編集画面では、Ctrlキー+FキーでSearch: という検索欄を表示させることで検索ができます。
HTMLの編集が終わったらプレビュー画面で確認して、保存をします。
DNSプリフェッチのコード
F-lightでは既にいくつかのDNSプリフェッチが入っています。
そこにアドセンスに関連する主要なドメインのDNSプリフェッチを追加していきましょう。
HTML編集画面の8行目あたりに<!-- DNS prefetch -->があります。
そこに、以下のように追加をします。
<link href='//blogger.googleusercontent.com' rel='dns-prefetch'/>
<link href='//1.bp.blogspot.com' rel='dns-prefetch'/>
<link href='//www.blogger.com' rel='dns-prefetch'/>
<link href='//cdn.jsdelivr.net' rel='dns-prefetch'/>
<link href='//pagead2.googlesyndication.com' rel='dns-prefetch'/>
<link href='//googleads.g.doubleclick.net' rel='dns-prefetch'/>
<link href='//tpc.googlesyndication.com' rel='dns-prefetch'/>
<link href='//www.gstatic.com' rel='dns-prefetch'/>
黄文字の4行が追加分になります。
これでアドセンスの読み込み開始がスムーズになり、表示速度を改善することができます。
