网易有道React性能优化3大技巧

网易有道React性能优化3大技巧

课程简介

随着业务场景的复杂化,性能优化就变得格外重要,这一讲,我们从 React 源码入手,以有道精品课大前端的具体业务为例,运用 3 大优化技巧对系统进行“外科手术式”的优化,同时深入刨析 React Profiler,利用这款性能优化利器,帮我们定位性能瓶颈。

课程目录

React 的工作流

如何减少计算的量
优化 Render 过程
批量更新,减少 Render 次数

精细化渲染阶段
按优先级更新,及时响应用户
发布者订阅者跳过中间组件 Render 过程
useMemo 返回虚拟 DOM 可跳过该组件 Render 过程

精确判断更新的“时机”和“范围”
debounce、throttle 优化频繁触发的回调
懒加载与懒渲染
虚拟列表
避免在 didMount、didUpdate 中更新组件 State

React Profiler 使用心得
Profiler 只记录了 Render 过程耗时
开启“记录组件更新原因”
定位产生本次 Render 过程原因

课程核心

网易有道React性能优化3大技巧

讲师简介

安增平,网易有道资深前端开发工程师

深度学习与数据挖掘硕士,网易有道精品课 B 端前端负责人,专注于用户增长侧前端领域,擅长企业级前端架构与性能提升,知乎专栏作者(安大虎),“中台架构之家”微信公众号作者。

(0)
上一篇 2021年9月14日 下午2:02
下一篇 2021年9月14日 下午2:12

相关推荐

发表回复

登录后才能评论