tailwind css 코드 스플릿팅이 가능한가요?

안녕하세요 지인님! 답변을 드리자면,

TailwindCSS는 Code Splitting을 지원하지 않습니다.
1. Tailwind CSS 자체는 유틸리티 퍼스트 CSS 프레임워크로, 스타일을 직접적으로 코드 스플리팅하지 않습니다. 즉, Tailwind 자체의 유틸리티 클래스들은 JavaScript 모듈처럼 자동으로 분리되지 않습니다.
  1. 그래서 사용하지 않는다고 해도 코드 스플리팅은 되지 않습니다.
2. 사용하지 않는 css를 제거하고 싶다면, PurgeCSS를 활용하시면 됩니다
JIT모드는 저는 preview에 있어서 사용해본적은 없는데, 검색해본 결과로 답변을 드리자면
1. 사용자가 작성한 HTML에서 필요한 클래스만 즉시 생성하여 사용한다고 하니 필요한 스타일만 포함되도록 최적화하여 번들 크기를 줄일 수 있을 것 같고.
2. 프로덕션 모드에서 JIT는 사용하지 않는 CSS를 자동으로 제거하기 때문에, 페이지별로 필요한 스타일만 포함하게 될 것 같아요. 결과적으로 매우 큰 프로젝트에서도 CSS 번들 크기를 효과적으로 줄일 수 있습니다.
  1. 다만 "어느정도"에 대한 답변은 케바케일것 같아서 시도해봐야 알 것 같습니다

최적화는 프로젝트 규모가 커졌을 때 진행해야 의미가 있어서, 진행하시는 프로젝트 초반이라면 크게 신경 안쓰시는게 좋을 것 같고(한다고 해도 지금은 효과가 미비할거에요), 나중에 규모가 커진다면 한번 적용해 보시는 것이 좋을 것 같습니다

인프런 커뮤니티 질문&답변