优化开发效率、优化用户体验、优化页面性能

　　a.开发效率

　　工程化，如何优化打包效率：区分开发与生产模式，代码压缩、兼容性处理、Tree Shaking，npm包缓存（减少流水线下载依赖包的时间）

　　代码：规范代码，进行合理代码封装与抽离，减少更新维护成本。

　　b.优化用户体验

　　界面美化风格统一，用户交互优化（成功失败提醒、hover手型、骨架屏等交互效果），用户体验优化（错误捕捉ErrorBoundary与重试，避免白屏；懒加载，减少首屏加载时间；数据缓存，合适的接口数据缓存在本地存储， 减少接口调用、keep-alive；）。

　　c.优化页面性能

　　代码性能优化：

　　无意义的重复去执行代码（缓存），算法不够优秀（优化，空间换时间）。

　　react：数据变化后组件都会考虑重新执行及re-render的动作，如果数据没有发生本质上的更改，此次re-render的过程就是无意义的浪费性能，类组件可以去继承PureComponent，但是PureComponnet是浅层对比，很可能会影响到页面功能，本应该重新渲染也没有重新渲染，此时就需要用ShouldComponentUpdate来进行精准的判断是否继续执行后续动作。函数组件因为属性变化或者某些持久状态变化也会导致整个函数重新执行，此时函数内部的逻辑都需要做缓存，可以利用useMemo、useCallback、useRef之类的Hook来进行缓存，减少代码重复计算及函数或者数据的重复创建、赋值、销毁。

　　vue：计算属性只有在依赖的数据变化才会重新计算，但是如果计算过程非常复杂，可以考虑手动创建缓存来减少计算。

上一篇

说说setState