logo

匠人学习平台在线直播操作指南

Java教程

最全的React性能优化知识锦集
最全的React性能优化知识锦集

最全的React性能优化知识锦集

本文分为三部分,首先介绍 React 的工作流,让读者对 React 组件更新流程有宏观的认识。然后列出笔者总结的一系列优化技巧,并为稍复杂的优化技巧准备了 CodeSandbox 源码,以便读者实操体验。最后分享笔者使用 React Profiler 的一点心得,帮助读者更快定位性能瓶颈。

React 工作流

React 是声明式 UI 库,负责将 State 转换为页面结构(虚拟 DOM 结构)后,再转换成真实 DOM 结构,交给浏览器渲染。当 State 发生改变时,React 会先进行调和(Reconciliation)阶段,调和阶段结束后立刻进入提交(Commit)阶段,提交阶段结束后,新 State 对应的页面才被展示出来。
本章目录
    logo

    Follow Us

    linkedinfacebooktwitterinstagramweiboyoutubebilibilitiktokxigua

    We Accept

    /image/layout/pay-paypal.png/image/layout/pay-visa.png/image/layout/pay-master-card.png/image/layout/pay-airwallex.png/image/layout/pay-alipay.png

    地址

    Level 10b, 144 Edward Street, Brisbane CBD(Headquarter)
    Level 2, 171 La Trobe St, Melbourne VIC 3000
    四川省成都市武侯区桂溪街道天府大道中段500号D5东方希望天祥广场B座45A13号
    Business Hub, 155 Waymouth St, Adelaide SA 5000

    Disclaimer

    footer-disclaimerfooter-disclaimer

    JR Academy acknowledges Traditional Owners of Country throughout Australia and recognises the continuing connection to lands, waters and communities. We pay our respect to Aboriginal and Torres Strait Islander cultures; and to Elders past and present. Aboriginal and Torres Strait Islander peoples should be aware that this website may contain images or names of people who have since passed away.

    匠人学院网站上的所有内容,包括课程材料、徽标和匠人学院网站上提供的信息,均受澳大利亚政府知识产权法的保护。严禁未经授权使用、销售、分发、复制或修改。违规行为可能会导致法律诉讼。通过访问我们的网站,您同意尊重我们的知识产权。 JR Academy Pty Ltd 保留所有权利,包括专利、商标和版权。任何侵权行为都将受到法律追究。查看用户协议

    © 2017-2024 JR Academy Pty Ltd. All rights reserved.

    ABN 26621887572