p.twitter.comを待機しています jQuery.socialbutton遅延ロード

 「p.twitter.comを待機しています」という表示が出て、ページの読み込みに非常に時間がかかってしまうことがあります。
 運営しているサイトでコレが出たのですが、明らかにTwitterボタンが原因。どうもトラッキングのためのgif読み込みで時間がかかっているようです。

Waiting for p.twitter.com | Twitter Developers
“トラッキングは”p.twitter.com/t.gif” P3Pヘッダあり。ログイン中ユーザーで無効の場合はtwttr_dnt:1を送る。有効の場合twttr_pidというidがセットされている。” – @bulkneets (mala)

 Twitterが読み込み速度を改善してくれれば一番助かるのですが、そうもいきません。
 遅延ロードさせようかとも思ったのですが、jQuery.socialbuttonというプラグインを使っていて丸投げしている上、そもそも最初に表示される画面に既にソーシャルボタンが表示されているため、あまり意味がありません。
 ちなみに、ソーシャルボタンのロード方法の工夫については、以下のページが良かったです。

Facebookやtwitterなどのソーシャルボタンを高速に読み込む方法まとめ | Cappee Design

 で、結局スクロール後にロードする方法は使えないので、非常に原始的な方法をとりました。

$(function() {
window.setTimeout(function(){
$(‘#hatena’).socialbutton(‘hatena’, {
button: ‘simple’
});
},1000);
});

 のように、setTimeoutで遅れて実行するだけです。なんの工夫もないですが、とりあえずページの表示前にソーシャルボタンのロードで固まるのは防げるでしょう。恥ずかしいです・・。

 ちなみに、スクロール後に遅延ロードする場合、jQuery.lazyloadを転用するのが非常に楽です。jQuery.lazyloadは画像の遅延読み込みのためのプラグインですが、何でも遅延ロードに使えます。

jQuery.lazyloadを使ってAutopagerを実装する – Qiita [キータ]

 ここではAutopagerに利用していますが、ほかの用途でも使えます。ここではonを使っていますが、oneにすれば一回だけ読み込む用途に利用できます。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする