10. 3rd-party 스크립트 조정
가짜 3rd-party SDK가 응답에 2초 인위 지연이 걸려 있습니다. 이 스크립트를
본문 중간에 동기(blocking) 방식으로 넣었습니다 — 아래 "본문 콘텐츠"가
2초간 늦게 나타납니다.
📍 이 측정은 당신이 지금 쓰는 브라우저에서 실행됩니다.
📍 이 측정은 당신이 지금 쓰는 브라우저에서 실행됩니다.
⬆️ 이 문단은 3rd-party 스크립트가 끝나야 렌더링됩니다 (동기 로드이므로 파싱이 멈춰 있었음).
🔧 실제 구현 코드
<div id="third-party-mount"></div>
<script src="/mock-3rd-party/sdk.js"></script>
<p>⬆️ 이 문단은 스크립트가 끝나야 렌더링됩니다</p>HTML 문서 흐름 중간에 동기 <script>가 있으면, 파서는 그 스크립트의 다운로드+실행이 끝날 때까지 뒤이어지는 HTML(여기선 <p> 문단) 파싱·렌더링을 멈춥니다. 서버가 (routes/labs/third-party-script.js에서) 2초 지연 후 응답하므로 본문도 2초 늦게 나타납니다.