React在构建高性能前端应用时有哪些最佳实践？

本文共计3436个文字，预计阅读时间需要14分钟。

目录+正文+断点调试+搜索定位+Chrome Devtools+调试+sourcemap+npm+下载react包+插件注释+调试React+初始源码+关联react源码项目+总结+正文+什么是？+调试React+源码+优点和不足之分？+别着急

目录

• 正文
• 断点调试
• 搜索定位
• Chrome Devtools 调试
• sourcemap
• npm 下载react包
• 插件注释
• 调试 React 最初源码
• 关联 react 源码项目
• 总结

正文

什么？调试 React 源码还有优雅和不优雅之分？

别着急，我们先来听个故事：

东东是一名前端工程师，主要用 React 技术栈，用了多年之后想深入一下，所以最近开始看 React 源码。

断点调试

他把 react 和 react-dom 包下载了下来，在项目里引入，开发服务跑起来后，打开 Chrome Devtools 打断点调试。

这样调试了一段时间之后，他有了一些困惑：

这样调试是可以的，但是总感觉和源码有段距离，因为调试的是 react-dom.development.js

搜索定位

而源码里这些逻辑是分散在不同的包里的，所以就算搞懂了逻辑，也不知道这些逻辑在哪些包里，只能靠搜索来定位。