优化性能， 开启Web worker计算样式后生成样式可行吗

[panchaoco]

Is your feature request related to a problem? Please describe

因为是运行时框架，有时候大量的样式重算会阻塞浏览器渲染主线程，是否考虑引入Web worker的方案开启子线程来处理样式呢

Describe the solution you'd like

No response

Additional context

No response

[akinoccc]

我先测一下性能差异

[panchaoco]

我先测一下性能差异

好的好的，感谢大佬，有些浏览器可能没有获取CPU核数的API， 所以可能需要兼容一下哈

[panchaoco]

我先测一下性能差异

可能需要一些特定的场景，比如后端是一个socket推送的列表，数据是实时变化的，而前端还有几个按钮控制显示不同的数据，按钮聚焦要显示不同的样式，这时候可能出现按钮聚焦卡顿之类的。

[akinoccc]

测试了一下，使用web worker反而更慢了，创建worker以及worker和主线程之间传递数据的开销远远大于直接计算的开销

[akinoccc]

测试了一下，使用web worker反而更慢了，创建worker以及worker和主线程之间传递数据的开销远远大于直接计算的开销

不过不在意计算速度，只需要不阻塞主线程渲染也可以上（纯任务分流

[panchaoco]

测试了一下，使用web worker反而更慢了，创建worker以及worker和主线程之间传递数据的开销远远大于直接计算的开销

不过不在意计算速度，只需要不阻塞主线程渲染也可以上（纯任务分流

确实如此，感觉可以提供一个入口给用户选择是否开启web worker来计算样式

[akinoccc]

测试了一下，使用web worker反而更慢了，创建worker以及worker和主线程之间传递数据的开销远远大于直接计算的开销

不过不在意计算速度，只需要不阻塞主线程渲染也可以上（纯任务分流

确实如此，感觉可以提供一个入口给用户选择是否开启web worker来计算样式

嗯，我看看怎么实现

[panchaoco]

假如我有一个比较大的组件， 如果我通过props传入，改变了某一个选择器对应的dom的样式，会将整个组件的样式进行重算替换还是类似vue的diff 计算然后替换的呢

[akinoccc]

假如我有一个比较大的组件， 如果我通过props传入，改变了某一个选择器对应的dom的样式，会将整个组件的样式进行重算替换还是类似vue的diff 计算然后替换的呢

是整体重新计算了，这里用diff貌似没什么意义，因为无论如何 .classxxx { /*css style/ } 都是要整体替换的

[akinoccc]

假如我有一个比较大的组件， 如果我通过props传入，改变了某一个选择器对应的dom的样式，会将整个组件的样式进行重算替换还是类似vue的diff 计算然后替换的呢

是整体重新计算了，这里用diff貌似没什么意义，因为无论如何 .classxxx { /*css style/ } 都是要整体替换的

噢噢，diff props变化可以减少计算量，可以加一个

[akinoccc]

我待会加上样式缓存/批量更新/异步更新来优化这个问题

[akinoccc]

我待会加上样式缓存/批量更新/异步更新来优化这个问题

v1.12.0-beta.1已实现，具体文档：https://vue-styled-components.com/zh/guide/advances/performance-optimization