web-dev-qa-db-ja.com

YouTubeがプレーヤーJSの複数のインスタンスをロードするのを妨げるのを防ぎますか？

私が取り組んでいる多くのWordPressサイトで、複数のYouTubeビデオが埋め込まれていると、プレーヤーJSの複数のインスタンスが呼び出されることに気付きました。

これは1メガバイトのデータなので、JSのインスタンスを1つだけロードする方法があるかどうかを判断しようとしています。私は2番目（またはそれ以上）のインスタンスは冗長であると思いました。

2つの埋め込みビデオがあるWPページの場合、これは2回読み込まれます。

https://s.ytimg.com/yts/jsbin/player-en_US-vfle0WwUC/base.js (1.0MiB)

私はこれに関する情報を見つけることができませんでした、これは私がこれが多くの人々が解決したいであろう問題であると思ったので少し驚きです。

助言がありますか？

javascriptoptimizationyoutube
2
omega33

理論的には、youtubeの埋め込みはiframeとして行われ、iframeは同じウィンドウに表示される仮想の追加の 独立 / Webページなので、あるiframeの内容が他のiframeに影響を与えることはありません。

実際には、そのようなJSはブラウザにキャッシュされます。最初のものはロードされるかもしれませんが、（グーグルの誰かが大きな失敗をしていない限り）２番目のものはブラウザのキャッシュから "提供"されます。

直接質問に答えるには - それを避けるためにwordpress側でできることはあまりありません、そしてたぶん行うべきことは何もありません。

3
Mark Kaplun

Google I/O 2011：YouTubeのiframeプレーヤー：埋め込みの未来 は過去の未来についてすべて教えてくれます。あなたは YouTube Developer セクションでiFrameに代わるものを見つけることができるかもしれませんが、私は彼らがiframeを選んだ理由について最初にそのビデオを見たいと思います。

ほとんどの場合、JSファイルのような静的なアセットはブラウザによってキャッシュされます。将来のリクエストは、新しいコピーを取得するのではなく、ブラウザのキャッシュから取得するという意味です。ファイルのヘッダーには、アイテムをキャッシュできる期間を決定するTTL（Time to Live）という名前のものがあります。一部のリソースは0に設定されています。その場合、次の要求はキャッシュから引き出されません。しかし、私の狙いは、GoogleがTTLをかなり合理的なものに設定することです。

単一のスクリプトだけを入れてiframeを入れないようにすることができる代替方法を見つける場合は、YouTubeのデフォルトの埋め込みを上書きすることを検討してください。スクリプトを追加するために最初に埋め込みを作成したときに注意してください。その後、ビデオマークアップだけを表示します。

add_filter('embed_oembed_html', 'override_youtube_embed_oembed_html', 99, 4);

function override_youtube_embed_oembed_html($html, $url, $attr, $post_id) {

    static $count = 0;

    $pos = strrpos($url, "youtube.com");
    if ($pos === false) {
        return $html;
    }

    $message = '';
    if( ! $count ) {
        $message = 'First bit of embed magic! ';
    }

    $count ++;
    return $message . "Your Magic Here! How many magics so far? " . $count;
}
1
jgraup