TomasPustelnik译者
弯月责编
欧阳姝黎出品
CSDN（ID：CSDNnews）
以下为译文：
CSS-in-JS技术在前端工具中占有重要的一席之地，而且这种趋势在近期内还将持续。尤其是在React世界中。根据年CSS的使用状况调查，在参与调查的人中，只有4.3%没有听说过StyledComponents（一个占主导地位的CSS-in-JS库），超过40%的人都使用过该库。
很长一段时间以来，我一直想深入比较一下CSS-in-JS库（比如比较StyledComponents与一个很好的CSS库）的性能。可是很遗憾，我未能在实际的项目中进行比较，毕竟这不是一个简单的测试场景。于是，我决定自己动手。我将一个真实的应用从StyledComponents迁移到了Linaria（它会在构建时提取CSS）。在用户机器上不需要运行时生成样式。
在开始比较之前，首先声明一下，我并不讨厌CSS-in-JS。我承认CSS-in-JS的开发者体验很棒，而且继承自React的组合模型也很棒。它可以为开发人员提供一些不错的优势。但是，我想从用户的角度来看，这个伟大的开发者体验的代价是什么？
如果你十分关心网站的加载性能，则请不要使用运行时CSS-in-JS。JS代码越少，网站的加载速度就越快。我们对此无能为力。如果你想看一看具体的数字，则请继续阅读。
测试内容以及方法我测试的应用是一个非常标准的React应用。使用CreateReactApp项目引导，使用了Redux，而样式也采用了Styled