document.write() の使用
ページ コンテンツの表示を数十秒遅らせることができる
接続速度が遅いユーザーにとっては特に問題となります。
そのため、Chrome では多くの場合 document.write() の実行がブロックされるため、この方法は使用できません。
Chrome DevTools コンソールで document.write() を使用すると、次のメッセージが表示されます。
[Violation] Avoid using document.write().
Firefox DevTools コンソールに次のようなメッセージが表示されます。
An unbalanced tree was written using document.write() causing
data from the network to be reparsed.
Lighthouse document.write() 監査で不合格となった結果
Lighthouse フラグ
Chrome でブロックされなかった document.write() の呼び出し:
問題となる使用方法では、ユーザーの接続速度に応じて、Chrome は document.write() への呼び出しをブロックするか、コンソール警告を出します。どちらの場合も、影響を受ける呼び出しが DevTools コンソールに表示されます。Google の document.write() に対する介入をご覧ください。
の記事をご覧ください。
Lighthouse は、document.write() への残りの呼び出しを報告します。これは、どのように使用してもパフォーマンスに悪影響を及ぼし、より優れた代替手段があるためです。
document.write() を避ける
コード内の document.write() の使用をすべて削除します。使用されているかどうか
サードパーティのスクリプトを挿入する場合は、
非同期読み込み
してください。
サードパーティのコードが document.write() を使用している場合は、非同期読み込みをサポートするようプロバイダに依頼してください。