기술없는 기술 블로그 RSS 태그 관리 글쓰기 방명록
study/server&web (1)
2021-05-25 20:28:46

HTML, CSS, JavaScript는 웹 브라우저에서 페이지를 렌더링하기 위해 필요한 세 가지 요소이다.

 

이 중에서 특별한 경우가 아니라면 눈에 보이는 디자인 요소인 HTML과 CSS파일을 빨리 불러와 페이지 로딩 속도를 높이는 것이 중요하다. 사람 눈이란게 간사해서 0.1초만 깜빡이면서 로딩이 늦어도 페이지 렉이 심하다고 생각하기 때문

 

아무튼 HTML은 위에서부터 차례대로 코드가 실행되기 때문에 <head>가 끝나야 <body>가 실행된다.

즉 header에서 대용량의 제이쿼리와 자바스크립트문이 존재한다면 해당 스크립트문의 처리가 끝나기 전까지는 화면에서는 body 부분이 실행되지 않기 때문에 백지화면만 노출된다.

 

그에 반해서 css는 화면의 디자인을 표현하는 역할을 맡고있으니 head에서 미리 불러 와야한다. css파일을 헤더에서 미리 불러오지 않으면 존재하지 않는 css파일을 참조한 화면이 흔히 말하는 엑박같이 깨진 상태를 유저가 볼 수 있기 때문이다.

로딩이 안되면 자동차가 안나오고 로딩이 덜되면 자동차가 박살난다