document.write()
を使用すると、ページ コンテンツの表示が数十秒遅れる可能性があり、接続速度が遅いユーザーにとっては特に問題になります。そのため、Chrome は多くの場合 document.write()
の実行をブロックします。つまり、デベロッパーがこれに依存することはできません。
document.write()
を使用すると、Chrome DevTools Console で次のメッセージが表示されます。
[Violation] Avoid using document.write().
Firefox の DevTools Console に、次のメッセージが表示されます。
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()
に対する介入の記事をご覧ください。
document.write()
の呼び出しが残っている場合、Lighthouse ではその呼び出しが報告されます。これは、呼び出しの方法に関係なくパフォーマンスに悪影響を及ぼし、より適切な代替手段があるためです。
document.write()
を避ける
コード内で document.write()
の使用をすべて削除します。サードパーティのスクリプトの挿入に使用している場合は、代わりに非同期読み込みを使用してください。
サードパーティのコードが document.write()
を使用している場合は、プロバイダに非同期読み込みをサポートするよう依頼してください。