반응형
vanilla extract
-
PandaCSS vs Tailwind CSS vs Vanilla Extract 비교 분석Tip 2025. 5. 11. 19:45
RSC(React Server Component)의 출시와 Next.js의 App Router 전환 뒤 전통적인 CSS-in-JS 방식의 한계로 더욱 각광받고 있는 Tailwind CSS, Vanilla Extract, PandaCSS를 비교해 보겠습니다.1. CSS-in-JS의 한계와 새로운 접근법의 필요성과거에는 styled-components나 Emotion과 같은 CSS-in-JS 런타임 스타일 생성 방식은 런타임에 JS로 스타일을 생성·주입하는 과정은 성능 오버헤드로 이어지고, SSR(서버사이드 렌더링) 환경에서는 추가 설정이 필요하거나 FOUC 문제가 발생하는 등의 단점이 명확했지만, 편리함이라는 장점이 너무 컸기에 폭넓게 사용되었습니다. 하지만 Next.js 13의 App Router 도입 ..