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()
を使用している場合は、非同期読み込みをサポートするようプロバイダに依頼してください。