PurgeCSS1 웹 최적화 - 불필요한 CSS 제거, PurgeCSS Reduce unused CSS 해결 개발자 도구의 Coverage(범위) 패널을 이용하여 페이지에서 사용되는 파일의 리소스에서 실제로 실행되는 코드가 얼마나 되는지 알려주며 비율을 확인할 수 있다. 자바스크립트 파일에서의 Coverage 는 if문의 조건 분기 때문일 가능성이 있으므로 어느정도 감안해야 하지만 CSS 파일에서 Coverage 는 정리해줄 필요가 있다. Coverage 항목을 누르면 위에 Source 가 뜨고, 파란 막대는 사용하는 코드이며 빨간 막대는 사용하지 않는 코드를 의미한다. Tailwind CSS 라이브러리 등의 CSS 에서 사용되지 않는 클래스인 경우 더욱 많은 불필요한 CSS가 발생한다. PurgeCSS 파일에 들어있는 모든 키워드를 추출하여 해당 키워드를 이름으로 갖는 C.. 2023. 8. 14. 이전 1 다음
