React 在构建用户界面整体遵循函数式的编程理念,即固定的输入有固定的输出,尤其是在推出函数式组件之后，更加强化了组件纯函数的理念。但实际业务中编写的组件不免要产生请求数据、订阅事件、手动操作 DO

从基本使用 -> 部署 -> 框架源码分析 -> 手写框架，带你全方位刨析 single-spa 框架

在单页面应用如日中天发展的过程中，备受关注的少了前端路由。 而且还经常会被xxx面试官问到，什么是前端路由，它的原理的是什么，它是怎么实现，跳转不刷新页面的... 一大堆为什么，问你头都大，此时，我就要拿出我珍藏的图片了，各位观众，五个烟。🤣 四种路由的实现原理。 只可以在h…

前端三大框架 Angular、React、Vue ，它们的路由解决方案 angular/router、react-router、vue-router 都是基于前端路由原理进行封装实现的，因此将前端路由原理进行了解和掌握是很有必要的，因为我们再使用的过程中也难免会遇到一些坑，一旦…

setState()并不总是立即更新组件，它可能会进行批处理或者推迟更新。这使得在调用setState（）之后立即读取this.state成为一个潜在的隐患。 去源码里面看实现是比较靠谱的方式。 不管这里看不看得懂都没关系了，马上进入源码的世界。 如果不处于批量更新模式，对所有…

写一篇关于 React Fiber 的文章， 这个 Flag 立了很久，这也是今年的目标之一。 最近的在掘金的文章获得很多关注和鼓励，给了我很多动力，所以下定决心好好把它写出来。 我会以最通俗的方式将它讲透, 因此这算是一篇科普式的文章。不管你是使用React、还是Vue，这里…

本文涉及到的代码已经整理到 github 仓库中，用 cra 搭建了一个示例工程，关于性能优化的部分可以打开控制台查看重渲染的情况。 勾选、全选与反选。 根据选中项计算总价。 首先我们请求到购物车数据，这里并不是本文的重点，可以通过自定义请求 hook 实现，也可以通过普通的 …

一个场景：父组件改变自身数据，不涉及子组件数据变化，就会在父组件每次render时都渲染子组件。 先说一下shouldComponentUpdate这个生命周期函数，这个函数是通过返回true或false来控制组件是否渲染的，可以有效的避免组件的一些无意义或者重复的渲染，和避免…

本文从 mini React —— Preact 源码的角度，分析 React Hook 各个 API 的优点缺点。 从而理解为什么要用 hook，以及如何最佳使用。 ✅只在 React 函数中调用 Hook，不要在普通的 JavaScript 函数中调用 Hook。 hook…