react性能优化技巧

2019-10-02  本文已影响0人  考拉程序媛

1.使用纯组件
2.使用 React.memo 进行组件记忆
3.使用 shouldComponentUpdate 生命周期事件
4.懒加载组件
5.使用 React Fragments 避免额外标记

  1. 不要使用内联函数定义
    7.避免 componentWillMount() 中的异步请求
    8.在 Constructor 的早期绑定函数
    9.箭头函数与构造函数中的绑定
  2. 避免使用内联样式属性
    11优化 React 中的条件渲染
    12不要在 render 方法中导出数据
    13为组件创建错误边界
    14 组件的不可变数据结构
    15使用唯一键迭代
    16事件节流和防抖
    17使用 CDN
    18 用 CSS 动画代替 JavaScript 动画
    19在 Web 服务器上启用 gzip 压缩
    20使用 Web Workers 处理 CPU 密集任务
    21React 组件的服务端渲染
上一篇下一篇

猜你喜欢

热点阅读