私は、多くの Javascript と jQuery を含むサイトで作業しています。私が知る限り、そのほとんどは、ドキュメントの準備ができた後に読み込まれます。ただし、ページが読み込まれると、約 1 秒の白い FOUC が表示されます。しかし、Javascript を完全に無効にすると、白い閃光はまったくありません。
ページが読み込まれるまで Javascript の読み込みが開始されないようにするにはどうすればよいですか? それはすでに自由に使用されています
$(document).ready(function(){ /*. . .*/});
...だから、ページの読み込みが完了してレンダリングされるまで Javascript は起動しないはずです...そうですか? しかし、どういうわけか、ページはレンダリングの前にスクリプトが終了するのを待ちます。JavaScript が完全に無効になっていても、ページはほとんど問題なく表示されるため、その必要はありません。
私が最初に試みることは、すべての外部 css ファイルがすべての javascript ファイルの前に含まれるように、スクリプトとスタイル タグの順序を変更することです。
Chrome の開発者ツールを使用して監査を行ったところ、javascript ファイルの下に含まれる 13 個のスタイルシートが見つかりました。通常、ブラウザは 2 つの同時接続しか許可しないため、html がロードされてもスタイルシートのダウンロードが他のリソースの背後でキューに入れられている場合、このフラッシュが表示されることがあります。
これは、コメントで他の多くの人々があなたが見ているものを再現するのに苦労している理由も説明します-彼らは異なる接続速度などを持っています.
$(document).ready()DOM の準備ができていることを意味しますが、ページが完全に読み込まれているとは限りません。ページが読み込まれるまで待ちたい場合は、body onload または window onload イベントを使用します。