document.write() 사용

document.write()를 사용하면 페이지 콘텐츠 표시가 수십 초 지연될 수 있으며, 특히 연결 속도가 느린 사용자에게는 문제가 됩니다. 따라서 Chrome은 대부분의 경우 document.write() 실행을 차단하므로 이를 사용할 수 없습니다.

document.write()를 사용하면 Chrome DevTools 콘솔에 다음 메시지가 표시됩니다.

[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() 사용을 모두 삭제합니다. 서드 파티 스크립트를 삽입하는 데 사용되는 경우 비동기 로드를 대신 사용해 보세요.

서드 파티 코드가 document.write()를 사용하는 경우 제공업체에 비동기 로드를 지원해 달라고 요청합니다.

리소스