오늘 책을 읽다가 html, css, js의 로딩과 실행을 봤는데 정말 이해가 안 되서 30분 동안 검색했는데도 이해가 안 됐어요. 이때 문득 깨닫게 되는 구절을 발견했습니다. :
HTML 페이지 로딩 및 파싱 과정
1. 사용자가 URL을 입력합니다(html 페이지라고 가정). 첫 번째 방문임) 브라우저는 서버에 요청을 보내고 서버는 html 파일을 반환합니다.
2. 브라우저가 HTML 코드 로드를 시작하고
태그에 외부 CSS 파일을 참조하는 태그가 있음을 발견합니다.3. 브라우저는 CSS 파일에 대한 요청을 다시 보내고 서버는 CSS 파일을 반환합니다.
4. 브라우저는 html의
부분의 코드를 계속 로드하고 CSS 파일을 얻었으며 페이지를 렌더링할 수 있습니다.5. 브라우저는 이미지를 참조하는 코드에서 태그를 찾아 서버에 요청을 보냅니다. 이때 브라우저는 이미지가 다운로드될 때까지 기다리지 않고 후속 코드를 계속 렌더링합니다.
6. 서버는 이미지 파일을 반환합니다. 이미지는 특정 영역을 차지하고 다음 문단의 배열에 영향을 주기 때문에 브라우저는 이 부분을 다시 렌더링해야 합니다.
7. 브라우저는 Javascript 코드 줄이 포함된