Tailwind 通过总结一套实用css, 在html中的元素只增加类名达到了极大减少css rule的体积
module css 保持了代码隔离, 但是在复用性上的表现差, 导致代码不停增长.
这个解决方案依然有几个问题
- 样式的生效顺序是取决于规则表的顺序, 最后一个添加的规则表将覆盖之前的规则表
也就是 需要保证原子 css 的使用中, 相同类型的规则保证只使用一次.
- 学习成本 需要记住相关规则名
- 无用代码规则的加入使得初始体积增大
如果能将两者结合, 创造出实用性的 css in js, 就能保证类名顺序决定样式, 且保持代码体积小. styled system
事实上为什么 css rule 的体积不停增加, 设计图的多样性导致样式多样. 在这个方案上是将 css rule 的体积减少, 但html的体积进行了增加.