# Show GN: tailwindcss 보다 더 빠르고 작은 CSS 결과물

> Clean Markdown view of GeekNews topic #23217. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=23217](https://news.hada.io/topic?id=23217)
- GeekNews Markdown: [https://news.hada.io/topic/23217.md](https://news.hada.io/topic/23217.md)
- Type: show
- Author: [owjs3901](https://news.hada.io/@owjs3901)
- Published: 2025-09-22T21:16:16+09:00
- Updated: 2025-09-22T21:16:16+09:00
- Original source: [github.com/dev-five-git](https://github.com/dev-five-git/devup-ui)
- Points: 3
- Comments: 2

## Topic Body

Devup UI와 타 라이브러리를 대상으로 벤치마크를 해본 결과를 공유드립니다!  
  
Library	Version	Build Time	Build Size  
tailwindcss	4.1.13	20.22s	57,415,796 bytes  
styleX	0.15.4	38.97s	76,257,820 bytes  
vanilla-extract	1.17.4	20.09s	59,366,237 bytes  
kuma-ui	1.5.9	21.61s	67,422,085 bytes  
panda-css	1.3.1	22.01s	62,431,065 bytes  
chakra-ui	3.27.0	29.99s	210,122,493 bytes  
mui	7.3.2	22.21s	94,231,958 bytes  
devup-ui(per-file css)	1.0.18	18.23s	57,440,953 bytes  
devup-ui(single css)	1.0.18	18.35s	57,409,008 bytes  
  
모두 같은 코드(일부는 타 라이브러리에 더 유리한 코드입니다, 모든 테스트 코드가 오픈소스로 열려있습니다!)로 벤치마크가 진행되었으며 모든 상황에서 속도는 1위 tailwind와 같은 방식으로 css를 생성했을 때(single css) 기준으로 가장 작은 빌드 결과물을 보여주고 있습니다.  
  
많은 관심 부탁드립니다!

## Comments



### Comment 44317

- Author: tjddnjsjo
- Created: 2025-09-26T15:35:02+09:00
- Points: 1

프런트엔드 컨퍼런스에서 들었던 발표로는 테일윈드와 내부 동작에 대한 접근이 유사하다고 느꼈고, 작성법에 대한 차이 정도 외에는 크게 메리트를 느낄 만한 요소를 찾지 못했던 것 같습니다.  
테일윈드는 CSS Normalize를 포함하고 있을 텐데 devup-ui도 동일한 조건인지 궁금하네요.

### Comment 44418

- Author: owjs3901
- Created: 2025-09-30T14:51:07+09:00
- Points: 1
- Parent comment: 44317
- Depth: 1

@devup-ui/reset-css 를 통하여 진행할 수 있습니다.  
가장 큰 장점이라면 기존 CSS-in-JS 솔루션을 쉽게 마이그레이션할 수 있다는 것과 tailwind보다 더 가벼운 CSS 결과물 또한 CSS Treeshake 도 큰 장점일 것 같습니다.  
  
이후 tailwind와는 다르게 각 파일마다 CSS를 생성되도록 하여 chunk를 split하는 기능 또한 업데이트를 하였습니다, 더 많은 업데이트를 통하여 차별화시키겠습니다.  
  
감사합니다.