「メイド・イン・ヘブン」スキン適用中

Cocoon 1.4.0を公開。SEOに対応したLazy Load機能を実装。

アップデート情報
2018-11-21
この記事は約5分で読めます。

11月にPageSpeed Insightsの仕様が変更されました。

今回は、それに対応させるための実装です。

外部リソースを除外した「Cocoonテーマのみ」の計測であれば、モバイルで99点、パソコンで100点を出せるのではないかと思います。

新しいPageSpeed Insights

ただし、AdSenseやGoogle Analytics、Facebook、Twitter等のスクリプトが入った途端、点数がガタ落ちします。外部リソースは、テーマ側からは変更不可能なので、外部リソース使用による点数ダウンはどうしようもないです。

機能追加

  1. SEO対応のLazy Load機能追加
  2. 人気記事ウィジェットの除外カテゴリーリストボックスのスタイル変更
  3. User Timing API を使用してアプリをインストルメント化

SEO対応のLazy Load機能追加

新仕様のPageSpeed Insightsで「Lazy Loadを使え」と提案されるようになったので、Intersection Observer APIを使用したLazy Load機能を実装しました。

新しい設定方法はこちら。

Cocoonおすすめのサイト高速化設定
Cocoonと相性の良いページの高速化設定方法の紹介です。Cocoonデフォルト機能だけでも十分にPageSpeed Insightsで高得点が狙えます。加えて、ページキャッシュプラグインや、画像最適化プラグインを利用すれば、より良い良いパフォーマンスを目指すことも可能かと思います。
wp-cocoon.com

新たに追加したLazy Load機能は、現在β版機能となっています。なので、デフォルトは無効状態です。

今後、しばらく運用してみて問題なければ、デフォルトで有効にしたいと思います。

PageSpeed Insights関係のトピックはこちら。

Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。 1つのトピックにつき1つの質問を書き込んでください 不具合・カスタマイズ対象ページのURLを提示し高速化を無効にしてください 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります...
wp-cocoon.com

人気記事ウィジェットの除外カテゴリースタイル変更

人気記事ウィジェットの除外カテゴリー指定方法をリストボックスタイプに変更しました。

人気記事ウィジェットの除外カテゴリースタイル変更

詳細はこちら。

Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。 1つのトピックにつき1つの質問を書き込んでください 不具合・カスタマイズ対象ページのURLを提示し高速化を無効にしてください 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります...
wp-cocoon.com

User Timing API を使用

これも、PageSpeed Insights提案によるもの。

「スクリプトの実行時間を調べられないと改善出来ないから．計測出来るようにしろ」ということだったので、計測できるようにしました。

User Timing API の詳細はこちら。

パフォーマンスまわりのAPIについて - Qiita
Navigation Timing とか Resource Timing とか、パフォーマンスまわりのAPIについて自分で整理できていなかったので、これを機会にまとめてみました。 API API 内容 サポート状況 ...
qiita.com

変更

  1. ブラウザキャッシュ期間変更

以前は、画像等のブラウザキャッシュ期間は一週間にしていて問題なかったのですが、新仕様のPageSpeed Insightsでは短いと指摘されるので、更新期間を変更しました。

不具合修正

  1. robots.txtではHTML縮小化を無効化
  2. AMPページでGoogleフォト画像の不具合修正
  3. レーティングスターのPHP警告対応
  4. AMP警告「タグ「a」に属性「class」が複数含まれています。」への対応
  5. モバイルクリック時の不具合修正
  6. カラーズスキン（グリーン）のホバー色の不具合修正

報告トピックでの詳細はこちら。

Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。 1つのトピックにつき1つの質問を書き込んでください 不具合・カスタマイズ対象ページのURLを提示し高速化を無効にしてください 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります...
wp-cocoon.com
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。 1つのトピックにつき1つの質問を書き込んでください 不具合・カスタマイズ対象ページのURLを提示し高速化を無効にしてください 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります...
wp-cocoon.com
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。 1つのトピックにつき1つの質問を書き込んでください 不具合・カスタマイズ対象ページのURLを提示し高速化を無効にしてください 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります...
wp-cocoon.com
Cocoonフォーラム
書き込みの前に以下の3点をご確認ください。 1つのトピックにつき1つの質問を書き込んでください 不具合・カスタマイズ対象ページのURLを提示し高速化を無効にしてください 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります...
wp-cocoon.com

コメント

  1. 5時豊国 より:
    2018-11-22 08:20

    5時豊国です

    Ｈ３：人気記事ウィジェットの除外カテゴリースタイル変更

    人気"昨日"ウィジェットの"場外"カテゴリ指定方法・・・

    • わいひら わいひら より:
      2018-11-22 14:18

      ご報告ありがとうございます。
      これはひどい誤字^^;
      早速修正させていただきました。

タイトルとURLをコピーしました