defer, async 스크립트 더 들여다보기
개발 지식, 트렌드, 경험 공유
defer, async 스크립트 더 들여다보기
브라우저에서 HTML parsing 하는 도중에 script(synchronous script)를 만나면 parsing을 멈추고 script 처리를 기다리게 됩니다. DOM은 초기 페이지 렌더링에 필수적인 리소스(critical resource)이므로 parsing이 완료될 때까지 페이지는 렌더링 되지 않습니다. 유저는 늦게 페이지 콘텐츠를 확인하게 되겠죠.
async, defer script를 활용하면 이 문제를 해결할 수 있다는 것을 잘 아실 겁니다. 그런데 defer script를 실행하기 위해 CSS 다운로드와 파싱을 기다리며 DOMContentLoaded 이벤트를 지연시키고 script 순서에 영향받는 것을 알고 계셨나요?
이번 포스팅에선 async, defer script에 대해 좀 더 깊이 알아보는 시간을 갖고자 합니다.
https://mechaniccoder.tistory.com/53
더 많은 콘텐츠를 보고 싶다면?
이미 회원이신가요?
2024년 3월 24일 오후 3:49
댓글 0
함께 읽은 게시물
나는 종종 생산성을 올리기 위한 각종 개발 툴은 물론, 라이브러리나 소스 코드를 구매하기도 한다.
소스 코드의 경우 실제로 써먹지 못하는 경우도 상당수 되긴 하지만, 그래도 구성이나 코드를 보면서 배우는게 있기 때문에 학습 비용이라고 생각하고 가끔 구매하는 편이다.
혹시, Cursor 나 Claude 얘기는 많이 들었는데
잘 쓰고있는건지 모르겠다,
이제는 AI 활용 방법 제대로 배워야 할것 같은데
어디서부터 어떻게 시작할지 막막하다
이런 고민을 하고 계신가요??
혹시 Claude 나 cursor 등 AI 로 개발하실 때
뭔가 AI 스러운 뻔한 디자인 때문에
