# Defer
🗣 면접 대비 | 브라우저 렌더링(feat. 말하면서 배워요)
면접 스터디에서 준비하는 내용으로 질문과 대답 위주의 글입니다. 또한 내용에 오류나 오타가 있을 시 댓글로 알려주시면 감사하겠습니다.
[Javascript] script async 와 defer의 차이점
모던 웹브라우저에서 돌아가는 스크립트들은 대부분 HTML보다 ‘무겁다’. 용량이 커서 다운로드받는 데 오랜 시간이 걸리고 처리하는 것 역시 마찬가지이다.사용자가 HTML파일을 다운로드 받았을 때 브라우저는 HTML을 한줄씩 읽으며 CSS와 병합하여 DOM 요소로 변환한
[JS기초] html에서 Script 위치는 어디가 좋을까?
html 파일을 불러오다가 중간에 script를 받아오고 실행한 후 다시 남은 html부분을 다운받음JS 다운로드가 덜 되면 html 파일도 다 로딩이 되지 않기 때문에 좋지 않음(사이트가 뜨다 만 너낌)html을 다 다운받고 나서 JS를 받아오고 실행함장점JS를 다
드림코딩 - script async와 defer의 차이점
console API는 웹 API 중 하나, 언어에 포함된 것이 아님API는 브라우저가 이해할 수 있는 함수브라우저가 코드를 한 줄,한 줄 분석한다(parsing HTML) → 분석 결과를 CSS와 결합해서 DOM 요소로 변환 한 줄,한 줄 parsing하다가 <
Error Handling
에러 처리는 프로그래밍에서 빼놓을 수 없다. 에러 관리를 제대로 해두어야 추후 디버깅에 있어 이득을 볼 수 있다. 미래의 나를 위한 투자?의 개념이다. 에러를 관리하는 것도 중요하지만 에러를 내는 방법, 에러를 감지하여 처리하는 방법을 아는 것 역시 중요하다. 오늘은
[JS]Building a Slider Component, Lifecycle DOM events, defer and async
slider Component 흔한 로직1\. 슬라이드들을 평행한 위치로 옮겨 놓는다. index와 transform를 이용하라!2\. 왼쪽, 오른쪽 버튼을 클릭하면 그에 맞게 슬라이드 옮기는 구조. (transform)3\. 현재 슬라이드를 정하기 위해 글로벌변수로
[JS] async attribute, defer attribute
브라우저는 동기적으로 실행되기 때문에 위에서 아래 방향으로 순차적으로 파싱하고 실행된다. 따라서 파일 크기가 큰 javascript 파일이 body 태그 상위에 위치한다면 DOM 생성이 지연될 수 있다.javascript 파일을 다운로드 받고 실행되기까지 script
[JS] 브라우저의 렌더링 과정
Replow, Repaint, async, defer, CSSOM, DOM과 같은 브라우저의 렌더링 과정에 대해 다룬다.
[etc] 자바스크립트 로드 방식
HTML이 파싱되는 도중 자바스크립트를 다운/실행하게 되는데 그때 잠깐 HTML 파싱을 멈추고 자바스크립트 실행이 끝나면 다시 HTML 파싱을 시작한다. 속도도 아주 느릴 뿐더러 스크립트의 위치에 따라서 의존성 오류가 나기 십상이다. HTML이 파싱되는 도중 자바스크립
.png)
JavaScript를 HTML에 링크할 때 효율적인 방법
HTML에서 자바스크립트를 포함할 때 어떻게 포함하는 것이 더 효율적일까요? 1. head 안에 그냥 script를 포함시키기 HTML을 쭉 파싱하다가 script 태그가 보이면 HTML을 파싱하는것을 잠시 멈춤 필요한 JS 파일을 서버에서 다운받아 실행한 다음에
[javascript] async와 defer의 차이점
이 경우에는 html이 파싱하다가 script를 만났을 때 자바스크립트 파일을 서버에서 다운로드하게 된다.자바스크립트 파일이 클 경우에 사용자가 웹 사이트를 보는데 많은 시간이 소요되는 단점 발생이 경우에는 html 파싱이 끝난 후 자바스크립트 파일을 서버에서 다운로드
[JS] 콘솔에 출력, script async와 defer 차이
Console API는 Web API중 하나로 브라우저가 제공하는 함수들이다. (js가 제공하는 것 아님)HTML parsing이 시작되는 동시에 fetching js도 시작. HTML parsing이 끝난 후 js를 실행시킨다.여러 js를 받을 경우에도 parsing
자바스크립트 셀프 QnA(2): 브라우저 렌더링
NodeJS의 등장으로 자바스크립트는 웹 브라우저를 벗어나 서버 사이드 애플리케이션 개발에서도 사용할 수 있는 범용 개발언어가 되었다. 그러나 여전히 자바스크립트가 가장 많이 사용되는 분야는 웹 브라우저 환경에서 동작하는 웹페이지/애플리케이션의 클라이언트 사이드! 이때