ReactJS 中什么是更快的原始 CSS 或内联样式？

【问题标题】：What is faster, raw CSS or inline styles in ReactJS?ReactJS 中什么是更快的原始 CSS 或内联样式？
【发布时间】：2015-02-22 04:06:34
【问题描述】：

如果您将所有 CSS 都设为内联样式，ReactJS 虚拟 DOM 是否会使您的应用程序更快？ VS 使用原始 .css 文件？

http://facebook.github.io/react/tips/inline-styles.html

另见 ReactJS 关于 JavaScript 中 CSS 的演示： https://speakerdeck.com/vjeux/react-css-in-js

【问题讨论】：

可能相关（也很有趣）stackoverflow.com/questions/8284365/…
发现了这个有趣的 jsperf 东西 jsperf.com/js-inline-css-vs-stylesheet-one-at-a-time/2 结果表明样式表比内联更快

标签： javascript css reactjs

【解决方案1】：

浏览器多年来一直在努力使他们的 CSS 样式表解析 + 渲染引擎快速且内存高效。内联样式并没有完全相同的处理方式。然而，好的一面是，如果您正在创建正常大小的应用程序/页面，这实际上并不重要。差异是微乎其微的。内联样式弥补了 100% 的样式被实际使用的事实，其中 CSS 样式表通常是串联的，并且几乎 90% 的解析规则是不活动的（浪费）。

提示：通过避免 React 重新渲染来提高性能。这就是真正的瓶颈所在！

【讨论】：