关注本站公众号,
获取永久访问授权码
获取永久访问授权码
扫码关注，回复『刷题』即可.
返 回
No.716 React实现的移动应用中，如果出现卡顿，有哪些可以考虑的优化方案（喜马拉雅）
题目描述~ 略...
寄语：问题比答案更重要
建议自己先有个思考的过程，有了自己的答案或者疑问再看解析进行对比。
目前解析在逐步添加中，也可以跳转链接查看。
「解析1」(1) 增加shouldComponentUpdate钩子对新旧props进行比较，如果值相同则阻止更新，避免不必要的渲染，或者使用PureReactComponent替代Component，其内部已经封装了shouldComponentUpdate的浅比较逻辑；
(2) 对于列表或其他结构相同的节点，为其中的每一项增加唯一key属性，以方便React的diff算法中对该节点的复用，减少节点的创建和删除操作；
(3) render函数中减少类似onClick={() => {doSomething()}}的写法，每次调用render函数时均会创建一个新的函数，即使内容没有发生任何变化，也会导致节点没必要的重渲染，建议将函数保存在组件的成员对象中，这样只会创建一次；
(4) 组件的props如果需要经过一系列运算后才能拿到最终结果，则可以考虑使用reselect库对结果进行缓存，如果props值未发生变化，则结果直接从缓存中拿，避免高昂的运算代价；
(5) webpack-bundle-analyzer分析当前页面的依赖包，是否存在不合理性，如果存在，找到优化点并进行优化。
来源 https://juejin.im/post/5db556376fb9a0207a6ddce7#heading-24
解析或答案仅供参考。
