document.write() を使用

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() の呼び出し:

document.write の使用状況を示す Lighthouse 監査

問題となる使用方法では、ユーザーの接続速度に応じて、Chrome は document.write() への呼び出しをブロックするか、コンソール警告を出します。どちらの場合も、影響を受ける呼び出しが DevTools コンソールに表示されます。Google の document.write() に対する介入をご覧ください。 の記事をご覧ください。

Lighthouse は、document.write() への残りの呼び出しを報告します。これは、どのように使用してもパフォーマンスに悪影響を及ぼし、より優れた代替手段があるためです。

document.write() を避ける

コード内の document.write() の使用をすべて削除します。使用されているかどうか サードパーティのスクリプトを挿入する場合は、 非同期読み込み してください。

サードパーティのコードが document.write() を使用している場合は、非同期読み込みをサポートするようプロバイダに依頼してください。

リソース