1. NotionNext开发指引

TailwindCSS官方称一个可以让你脱离css文件，在html直接通过class修改样式的框架。 但是TailwindCSS一直受到CSS 方案备受争议。第一个问题就是这和写style css有什么区别？ 首先在我们的进行修改css样式的风法中，多多少少会用到一些4中方式 越往下走，颗粒度越来越大，约束性变高，自由性不足。而 TailwindCSS 位于第二层。 第一层的话，就很难复用了，所以 TailwindCSS 选择了第二层的原因。 在不久之前Facebook经过重构后的css体积已经重原来的413kb 压缩到74kb。 可是很多开发者，很疑惑。我的css文件下去了，但是我的html和组件的文件变得无比的大，并不知道这里的好处在哪里？ 首先第一，现在的开发模式已经是组件开发了，就算你在搞一个css来维护。其实很多的样式属性这个组件有，那个组件也存在复用。这个没有必要，这里的自己的组件样式交给组件自己维护就好了。 第二点就是想到这个疑惑的，估计是没有去了解过nginx的gzip。只是知道有这么一回事。 gzip 的核心Deflate使用的是LZ77 算法和 Huffman 编码来压缩文件，重复度越高的文件可压缩的空间就越大。 即使 HTML 因为类名过多造成体积增大，由于 class 高度相似，gzip 也将会得到一个很大的压缩比例。 这才是 TailwindCSS 想要的结果 第一次我使用 tailwind ui 框架的时候，很多情况看多以下的这种写法。 你想要多少的数值，直接写多少就好了。 还有对应响应式 对应你使用的@media，你感觉谁更加舒服呢？ 第三 就是后期维护的时候，就算有人跑路了，这么多个css，后面的人只需要去看html就能维护。这么多的css file你慢慢找吧，反正我是不想找的。 第四 Jit css编译，使用TailwindCSS在编译的过程中，比css-loader less-loader 都要快 说了这么这些好处，TailwindCSS有什么不足呢？我说说我的看法吧。 第一遇到复杂一点的css操作你不能直接使用 TailwindCSS 操作 比如以上的情况，你需要写css来操作子元素的显示，除非你无聊非要用js来写，也不是不行。 第二是增加了记忆负担，它的命名和你认知中的使用不一样，前期需要一直查阅文档，或者下载TailwindCSS的提示插件。要不你无从下手。 但是一旦你有习惯了，形成条件反射，那就是另一种情况，你会直喊香。 如果你正在做代码加速优化的话，你可以试试TailwindCSS.因为gzip后是真的小。 如果你是一个爱折腾的人，可是试试TailwindCSS。 如果你感觉你的组件已经可以完全独立使用一个css的时候，可以使用TailwindCSS来制作这个组件。后面要改代码时候，只需要去这个组件修改，并且不用担心自己的class会影响到他人的组件。