
지도 api를 사용하면 뜨는 경고창입니다.
검색해보니 네이버, 카카오 등 여러 지도 api에서 발생하는 문제인데요.
document.write로 스크립트를 생성하는 것을 자제하라는 경고 문구입니다.
document.write는 페이지가 순차적으로 렌더링 되다가 이 로직을 만나면 블락이 되고, 이 스크립트를 모두 완료하기 전까지는 페이지 로딩과 파싱이 정지되기 때문입니다.
따라서 2G 같은 느린 네트워크 환경에서 document.write를 이용하면 페이지가 멈춘 것처럼 보일 수 있습니다.
첫번째로 든 생각은, 저는 무거운 스크립트를 많이 넣지 않았기 때문에 느린 네트워크더라도 지도의 로딩에 문제가 되지 않을 거라고 생각했습니다.
두번째로, 느린 네트워크에 대한 고려를 하지 않았다는 것을 깨달았습니다.
slow 3g 으로 스로틀링을 걸어 테스트한 결과, 느리지만 지도가 정상적으로 생성되었습니다.
그래도 slow 3g보다 더 느린 환경도 얼마든지 있을 수 있다는 생각을 하게 되었습니다.
slow 3g 테스트지만 흰 배경을 한참이나 보고 있자니 깨달음을 얻게 되었는데요.

페이지가 멈춘 것처럼 보이는 것을 방지하기 위해, 지도에 로딩 스피너를 띄워 사용자 경험을 개선해보려고 합니다.