距离第一篇《React源码解析(一)》已经过去将近4个月的时间，由于是我第一次进行源码解析相关的写作，思路和文笔还不够成熟。一百多天以来，我基于读者反馈反思这几篇文章中的不足，同时也在不断学习借鉴其他优秀作者的写作方法和写作思路。最终总结出对于自己的源码写作来说，需要改进的几点…

当我们能够熟练运用React进行前端开发时，不免会对React内部机制产生浓厚的兴趣。组件是什么？是真的DOM吗？生命周期函数的执行依据又是什么呢？ 本篇，我们先来研究React组件的实现与挂载。 上述代码写完后，我们就得到了<A />这个组件，那么我们接下来先弄清楚<A />…

将 antd 组件库进行重写，使它的组件库风格符合设计要求。 我们将 antd 的 Button 封装成我们自己的 MyButton 样式风格。colors 类似于 antd 中的 type，特性有 primary、danger等颜色。下面只写colors 为 danger 的…

它与普通组件是一样的，只是对负责 shouldComponentUpdate——它对状态和 props 数据进行浅层比较。如果先前的状态和 props 数据与下一个 props 或状态相同，则组件不会重新渲染。 在对比先前的 props 和状态与下一个 props和状态时，浅层…

可以前往 https://codesandbox.io/s/react-profiler-example-o75nc?fontsize=14&hidenavigation=1&theme=dark 在线编辑效果。 Profiler 是 React 中的一个组件，由 B. Vau…

在优化方面，Webpack 能做的很多，比如压缩混淆之类。 可以看 Webpack 官网的 IgnorePlugin 介绍，他就是拿 moment 举例子的.... 说起首屏优化，不得不提的一个就是服务端优化。现在的 SPA 应用是利用 JS 脚本来渲染。在脚本执行完之前，用户…

本文将从 render 函数的角度总结 React App 的优化技巧。需要提醒的是，文中将涉及 React 16.8.2 版本的内容(也即 Hooks），因此请至少了解 useState 以保证食用效果。 正文开始。 当我们讨论 React App 的性能问题时，组件的渲染速…

我工作中的技术栈主要是 React + TypeScript，这篇文章我想总结一下如何在项目中运用 React 的一些技巧解决一些实际问题，本文中使用的代码都是简化后的，不代表生产环境。生产环境的代码肯定比文中的例子要复杂很多，但是简化后的思想应该是相通的。 那么比如在路由发生…

我工作中的技术栈主要是 React + TypeScript，这篇文章我想总结一下如何在项目中运用 React 的一些技巧去进行性能优化，或者更好的代码组织。 性能优化的重要性不用多说，谷歌发布的很多调研精确的展示了性能对于网站留存率的影响，而代码组织优化则关系到后续的维护成本…