データURIで画像の読み込みを遅らせるには？

Question

データURIを使用して1ページを読み込み、scriptをHTMLの最後に付けます。画像srcの通常のURLを使用するのとは異なり、データはHTMLページのHTTPリクエストに直接ロードされます。

このように、この方法で読み込まれた数百の画像データがあるので、scriptはページの最後にロードされます。

imateの読み込みに先立って、または非同期のどちらかでスクリプトを読み込みたいのですが、画像の読み込みを遅らせる方法はありますかdata？

<div> 
    <img src="data:image/png; base64, .........." alt=""> 
    <img src="data:image/png; base64, .........." alt=""> 
    <img src="data:image/png; base64, .........." alt=""> 
</div> 
<script type="text/javascript" src="my-script.js"></script> 

Answer 1

この回答はかなり簡単です。イメージがページの読み込みと同期して読み込まれないようにするには、インラインイメージデータURIを使用しないでください。あなたはあなたのWebページをコード化した動作を得ています。

リモートイメージURL（非データURI）は非同期で読み込まれ、読み込み中にスクリプトを実行できます。

または、あなたのページの大きな文字列配列にすべてのデータURIを入れてから、別のJavaScriptを実行した後にjavascriptを使ってデータURIからイメージオブジェクトを構築することができます。