Twitter ウィジェット削除比較は PageSpeed で9点改善となりました

PageSpeed Insights の点数改善で、Twitter のウィジェットを削除した場合の点数を比較しました。

Twitter のウィジェットとは以下のようなものです。

Twitter Publish からウィジェットを作成してウェブサイトに貼り付けることができます。

しかし、Twitter ウィジェットは PageSpeed との相性がよくないです。 PageSpeed で指摘される様々なポイントが、Twitter ウィジェットとぶつかります。

PageSpeed 対策で削除

まずは試しに、Twitter ウィジェットを削除してみましょう。
どれくらいの影響があるのかその上でウィジェットの利用の参考にすると良いです。

削除前の点数

削除前はモバイル版で、80点でした。

削除後の点数

削除後はモバイル版で、89点でした。

モバイルで+9点の改善となりました。

デスクトップ版は変わらず

Twitter ウィジェットを削除してもデスクトップ版への影響はありませんでした。

ウィジェット削除で変わる PageSpeed 項目

Twitter のウィジェットを削除すると、PageSpeed で指摘される項目が減ったり変化しました。

ページの表示を遅延させる要素が減少して、表示速度が改善したということになります。

消えた項目

以下の項目は PageSpeed で表示されなくなりました。

  • 次世代フォーマットでの画像の配信
  • 第三者コードの影響を抑えてください 第三者コードによってメインスレッドが 270 ミリ秒間ブロックされました
  • メインスレッド処理の最小化 
  • 静的なアセットと効率的なキャッシュ ポリシーの配信
  • JavaScript の実行にかかる時間の低減 

5項目が削除されているので、多岐に渡り効果が出ています。

変化した項目

以下の項目は PageSpeed で変化がありました。

  • リクエスト数を少なく、転送サイズを小さく維持してください 74 件のリクエスト

リクエスト数が74から25に減少しました。

Twitter ウィジェット削除比較まとめ

今回 Twitter のウィジェットを削除してみたところ、PageSpeed のモバイルで9点の改善となりました。

また、前後比較により削除されたり変化した項目を見ると、Twitter ウィジェットのように外部通信するウィジェットが表示のパフォーマンスに大きな影響を及ぼしていることがわかります。

PageSpeed 視点では Twitter ウィジェットはネガティブに働きますが、Twitter ウィジェットの有効活用を目指しているケースもあるはずです。

ケースに合わせて Twitter ウィジェットをご利用ください。