Unocss คืออะไร
UnoCSS คือ CSS Engine คล้ายๆ TailwindCSS
ทำไมต้อง UnoCSS
ทำไมต้อง UnoCSS เมื่อเทียบกับ TailwindCSS
| Property | UnoCSS | TailwindCSS |
|---|---|---|
| Approach | CSS Engine แบบสร้างตามการใช้งาน (On-demand) | Framework สำหรับ Utility-first CSS |
| Configuration | uno.config.ts (TypeScript) | tailwind.config.js (JavaScript) |
| Engine | CSS Engine | PostCSS Framework |
| Build System | ใช้งานกับ Vite เป็นหลัก | ใช้งานได้กับระบบที่รองรับ PostCSS |
| Performance | เร็วกว่า ✅ | เร็ว |
| Customization | ยืดหยุ่นสูง ✅ | ปรับแต่งได้ |
| Presets | หลากหลาย (รวมถึงแบบ Tailwind-compatible) ✅ | มีเพียง preset เดียว |
| Bundle Size | ขนาดเล็กกว่า ✅ | ขนาดเล็ก |
| Learning Curve | ชันกว่า (มีฟีเจอร์มากกว่า) | ปานกลาง |
| Community | กำลังเติบโต | ใหญ่และมั่นคง ✅ |
| Documentation | ครอบคลุม | กว้างขวางและจัดระเบียบดี ✅ |
| IDE Support | ดี | ยอดเยี่ยม ✅ |
| Modules | ECMAScript Modules (ESM) | CommonJS (CJS) |
| Design System | ปรับแต่งได้ยืดหยุ่นมาก ✅ | ปรับแต่งได้จำกัด |
| Performance | สร้างและคัดกรองเฉพาะคลาสที่ใช้งาน ✅ | ใช้คลาสที่สร้างไว้ล่วงหน้า |