Optimization

DOM 트리에 불필요한 자식 요소가 있다면 삭제인라인 스타일 사용하지 않기인라인 스타일은 리플로우를 계속 발생시켜 렌더링 완료가 늦어짐.CSS 파일로 만들면 한 번의 리플로우만 발생.HTML의 요소 삭제했을 때 사용안하게 된 CSS 코드도 같이 삭제간결한 셀렉터 사용복

나무를 흔들어서 잔가지를 털 듯 불필요한 코드를 제거하는 것인터랙션이 화려해지면서 JS 파일 크기가 많이 증가됨JS 파일이 늘어난만큼 요청 수도 늘어나 네트워크 리소스 소모가 커짐JS 파일의 실행시간도 증가되어 CPU에 영향을 줌으로 페이지 로드 시간이 늘어나 이탈률이

사이트 성능 측정 도구구글에서 개발한 오픈소스 툴성능, 접근성, SEO, PWA 등의 웹 페이지 품질 검사Chrome 개발자 도구로 사용Node CLI로 사용Chrome에서 검사할 페이지로 이동개발자 도구 열기 (mac: command+ option+ i / windo