진주만두찜

https://minsu08.tistory.com/15이 블로그는 해당 글에서 이어지는 글입니다.웹 브라우저는 서버로부터 HTML을 받아 여러 단계를 거쳐 화면을 렌더링한다. (이 과정을 이해하면 웹 성능 최적화나 프레임워크의 동작 원리를 이해하는데 큰 도움이 된다.) 흐름HTML 다운로드↓DOM 생성↓CSS 다운로드↓CSSOM 생성↓Render Tree 생성↓Layout 계산↓Paint 이 과정을 Critical Rendering Path라고도 합니다.1. DOM 생성 (DOM Construction)브라우저는 서버로부터 받은 HTML 문서를 파싱(parsing) 하여 DOM Tree를 생성합니다.DOM(Document Object Model)은 HTML 문서를 트리 구조의 객체 형태로 표현한 것입니다..

하이드레이션이 뭐에요?- 어... html 파일에 js를 입히는 것입니다. 필자는 이렇게 면접 떨어지는 답변으로 밖에 설명하지 못해서 이번에는 확실히 알고 가자해서 이 글을 작성하게 되었다. 사실 하이드레이션에 대해 알기 보다 이 개념을 알기 전에 반드시 꼭 알아야 하는 개념들에 대해 알아보기 위한 글이다. hydration을 이해하기 전, 준비운동하이드레이션을 이해하기 전에 먼저 알아야 하는 것은 웹페이지가 화면에 어떻게 그려지는 것인가 이다. React, Next.js에서 말하는 하이드레이션은 갑자기 튀어나온 개념이 아니라, 정적인 html에 자바스크립트가 붙어서 상호작용 가능한 화면이 되는 과정이기 때문에 그 전 단계 개념들을 먼저 잡아두면 훨씬 이해하기 좋을 것이다. 차례HTML, CSS, Jav..