ツイッターのアイコンの画像。

BLOG ブログ不具合

ブログにツイッターを埋め込むと遅くなる【簡単プラグインで解決】

2021年11月8日

この記事の信頼性について

  • 京都大学大学院を卒業後、サラリーマンを10年経験。
  • 現在個人事業主として奮闘中。
  • 研究気質があるブロガー。
  • Webマーケを勉強しブログ開始1年で年間13万PVを達成。
  • 読者に有益な情報となり、少しでも読者の日々の生活を明るくできるよう心がけて執筆します。

ブログにツイッターを埋め込むと遅くなる。

と困っていませんか。

もうすでにたくさんの記事にツイッターを埋め込まれており、今さらツイッターの埋め込みをやめることなんてできない。

そんな方に、簡単に解決する方法を解説します。

まず、あるページのツイッターを埋め込んだ際のモバイルのSightSpeed Insightのスコアを見てください。

SightSpeed Insightのスコア38。

絶望的な数値ですね。

しかし、あるプラグインを使うと、

SightSpeed Insightのスコア38。

と劇的に改善しました。

簡単に使えるプラグインをご紹介します。

目次は次の通りです。

・ブログにツイッターを埋め込むと遅くなる【解決法】

スマホ。

・ツイッターの埋め込みでスコアが悪い理由はJavascriptの使用量

ツイッターを埋め込むとなぜ遅くなるのかというと、ツイッターのスクリプト読み込みでネットワーク通信料が大きくなるからです。

下記、SightSpeed Insightの改善できる項目ですが、 「使用していないJavaScriptnoの削減」 が織り込まれていることがわかります。

URLを確認すると、Twitterの読み込みが多いことが分かります。

PageSpeed Insightの解析結果に表示される「改善できる項目」の1つである「Javascriptの削減」に、Twitterのスクリプトの読み込みが多く存在している様子。

・Twitterの読み込みの遅延にはFlying Scripts by WP SPEED Mattersがおすすめ

Flying Scripts by WP SPEED Mattersというプラグインは、指定されたJavascriptを、一定時間読み飛ばすプラグインです。

このプラグインで、ツイッターのスクリプト読み込みを遅延させてみました。

すると、下記改善できる項目から、「使用していないJavaScriptoの削減」 の項目がなくなっていることが分かります。

つまり、改善されたということです。

PageSpeed Insightの解析結果に表示される「改善できる項目」の1つである「Javascriptの削減」が改善された様子。

Twitterを埋め込む際には、下記スクリプトが入っています。

<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

このスクリプトが重いたい原因です。

・ Flying Scripts by WP SPEED Mattersの使い方

Flying Scripts by WP SPEED Mattersの使い方は簡単です。

まず、プラグインをインストールしてください。

このwidgets.jsを遅延させていきます。

Flying Scripts by WP SPEED Matters の設定画面を開きます。

Include Keywordsに、「widgets.js」を追加します。

widgets.jsは、ツイッターのJavascriptです。

このキーワードに追加されると、ユーザー操作時に読み込みされます。

また、Timeoutは「5s」ほど設定しておきます。

もし、ユーザー操作がなければ、5秒遅延してスクリプトをロードさせます。

「Save Changes」をクリックして設定を保存します。

WordPressのプラグインのFlying Scripts by WP Speed Matters Settingsの設定画面。

・まとめ

ツイッターを埋め込むと、表示速度が遅くなる場合の解決法として、 Twitterのスクリプトの表示を遅延させる方法があります。

Flying Scripts by WP SPEED Matters というプラグインを使います。

プラグインの設定画面でツイッターのスクリプトのwidgets.jsをキーワードにして、5s遅延させれば設定完了です。

私は、それで、SightSpeed Insightのスコアを、38から78に改善できました。

簡単ですので、ぜひ試してみてください。

【コラム】ブログサービスの課金を惜しまないほうがいい理由

ブログをやってて気づいたこともあります。

これまで、600記事を書いてきて、何時間使ったのだろう。

ふと思いました。

1記事2時間使ったとしても1200時間です。

時給1000円だとしても、120万円。

すごいですよね。

それもほぼただ働きの状態。

そう考えると、もっとブログに課金するべきだと考えるようになりました。

いい環境でブログを書くべきだと考えたからです。

安いレンタルサーバーを使って、無料のWordPressテーマを使ってそれで1200時間を投下する。

とっても効率悪いと思うんですよね。

ちょっと気づくの遅いですよね。

なので、サーバーもマイナーなところから、エックスサーバーに乗り換えました。

また、WordPressテーマも、無料テーマからAffingerに乗り換えました。

また、Affingerでは、有料のプラグインも使うようになりました。

これぐらいしても、まだまだ課金は少ないと思います。

もっと、いい環境でブログを書くべきだと思っています。

エックスサーバーの口コミ!使ってみた率直なレビュー

以上、参考になれば幸いです。

Blog運用術のトップ記事に戻る

作曲・文筆の趣味にもなって夢があふれる副業

副業する時間は無駄にできません。

作曲・文筆の副業を始めれば、スキルが貯まる。

スキルがたまれば、いつの間にかプロになれる。

作曲・文筆を続ければ、

  • 作曲家、編曲家、音楽プロデューサー
  • 小説家、ブロガー、コピーライター、マーケタ

にデビューしているかもしれません。

ボカロで音楽活動を始める方法

-BLOG, ブログ不具合
-, , ,