Javascriptライブラリをイメージとしてダウンロードしていますか？

Question

私はいくつかのページが新しいImage.src = '';によってページにJavaScriptファイルを読み込むのを見ました。

<script type="text/javascript"> 
     new Image().src = "XXXX\/js\/jquery-1.7.2.min.js"; 
    </script> 

私はこれの利点または目的を疑っていました。

Answer 1

これは、質問のコメントから推測されるように、HTTPリクエストを開始するためのすばやく簡単な方法です。

ページの上部でダウンロードを開始し、ページの下部に<script src='the-same-file.js'></script>を含めて、ブラウザキャッシュからファイルをロードできるようにすることで、わずかな利点が得られます。

このは、ダウンロードの遅延を解析タスクと並列化することができます。たとえば、bodyがまだ解析されている間に、headで開始されたダウンロードが実行される可能性があります。

src属性を使用してヘッド内のファイルを参照するだけではどうですか？

[延期またはasync]属性でもないが存在する場合、スクリプトが取り出され、ユーザエージェントが ページを解析続行する前に は、すぐに実行します。すなわち

Source (suggested reading)

、この方法は、ブラウザは、後工程におけるまでブロッキング挙動を招くことなく、ファイルをダウンロードすることを可能にすることを試みます。

しかし

• これが本当に必要であれば、私はむしろnew Image()ハックよりも、このような目的のために意図されてdefer属性を検討します。
• cache headersに応じて、この「最適化」が逆行する可能性があります。 2つのHTTPリクエストを作成したり、ファイルを2回ダウンロードすることもできます。

「野生の」

いくつかの主要なサイト（Google検索、GmailやTwitterやFacebook、ネットフリックス）の迅速な調査の結果、この技術は、JavaScriptファイルを取得するために使用され、非常に使用されていないことを示しています控えめに全体的に。

たとえば、Facebookはキャッシュ/パフォーマンスではなく、サイトが（潜在的に悪質な）フレームセットに読み込まれたときに追跡目的で使用されているようです。 Imageインスタンスを作成し、ソースを設定すると、clickjackingの試行を追跡するページへのHTTPリクエストが開始されます。

これは独立したケースです。通常の状況下ではこのスクリプトは実行されません。