- 使用以下任一方法来评估组件级渲染性能:
- Chrome DevTools“性能”面板
- React DevTools分析器
- 适当时机覆盖shouldComponentUpdate
- 类组件使用PureComponent
- 功能部件使用React.memo
- 记忆Redux选择器(例如使用reselect)
- 虚拟化超长列表(如使用react-window)
- 如果您不是服务器端渲染,请使用 React.lazy
- 如果您是服务器端渲染,请使用类似的库拆分组件 loadable-components
- 使用服务工作者来缓存值得缓存的文件。Workbox将使您的生活更轻松。
- 如果您是服务器端渲染,请使用流而不是字符串(带有renderToNodeStream和renderToStaticNodeStream)
- 不能SSR吗?而是预渲染。像这样的图书馆react-snap可以提供帮助。
- 如果使用CSS-in-JS库,请提取关键样式。
- 确保您的应用程序可访问。考虑使用像React A11y和这样的库react-axe。
- 如果您认为用户希望通过其设备主屏幕访问您的网站,请添加一个Web应用清单。
详细使用点击标题见原文