CSS가 하나의 파일로 번들링되는 경우, 트리 셰이킹(tree-shaking)을 적용한 후에도 @media 컨텍스트(모바일, 태블릿, 데스크톱, 다크/라이트/기타 테마 등)가 서로 다르기 때문에 여전히 사용하지 않는 CSS가 많이 포함되어 있습니다.
이것은 코어 웹 바이탈(Core Web Vitals)에 해롭습니다. @media 조건에 따라 CSS를 분리하면 성능이 크게 향상됩니다.
이 주제에 대한 추가 정보:
Discourse에 이 최적화 방안을 구현해 주실 것을 부탁드립니다. 현재 이 문제가 제가 Discourse로 전환하는 것을 막고 있습니다.
**사용하지 않는 CSS 줄이기(Reduce unused CSS)**와 렌더링 차단 리소스 제거(Eliminate render-blocking resources)(여러분의 경우 모두 CSS입니다)가 pagespeed insights에 따르면 Discourse 포럼의 1위와 2위 권장 사항임을 참고해 주시기 바랍니다.
훌륭한 작업을 해 주셔서 감사합니다!