在 Web 前端单页应用 SPA(Single Page Application)中，路由描述的是 URL 与 UI 之间的映射关系，这种映射是单向的，即 URL 变化引起 UI 更新（无需刷新页面）。 下面分别使用 hash 和 history 两种实现方式回答上面的两个核心…

之前的两篇文章，分别介绍了react-hooks如何使用，以及自定义hooks设计模式及其实战，本篇文章主要从react-hooks起源，原理，源码角度，开始剖析react-hooks运行机制和内部原理，相信这篇文章过后，对于面试的时候那些hooks问题，也就迎刃而解了。实际r…

React Diff 算法 认识 React Diff 算法 React 是 Fiber 架构的，Fiber 其实是一个链表的结构，但是由于没有设置反向指针，因此没有使用双端比对的方式去优化 Diff

传统的diff算法是使用循环递归对节点进行依次对比，复杂度为O(n^3),效率低下。 针对树结构(tree diff)：对UI层的DOM节点跨层级的操作进行忽略。（数量少） 针对组件结构(component diff)：拥有相同类的两个组件生成相似的树形结构，拥有不同类的两个组…

这是国外程序员 Robin Wieruch 带有明显个人色彩的一份总结，每年都会更新。相比于 awesome 列表，我个人更喜欢这类总结，简短、实用，更容易让人抓到重点并能立即实施

上一篇，我们介绍了fiber的基本概念，以及fiber在初始化阶段生成了fiberRoot和rootFiber 2个对象。 但，整个fiber树还没有构建，未进入reconciler阶段。 本篇，我们

作为前端来说，工作三年以上，如果你还是不会或者不了解如何手写一些最基础的框架，对于当前的形势来说是不太友好的，了解框架原理，手写框架已经成为前端开发者最基础的知识技能了，学习框架设计思维，结合业务体系

React是前端最受欢迎的框架之一，解读其源码的文章非常多，但是我想从另一个角度去解读React：从零开始实现一个React，从API层面实现React的大部分功能，在这个过程中去探索为什么有虚拟DOM、diff、为什么setState这样设计等问题。 Vue的API设计非常简…

各大社区中关于react的后台管理系统已经应有尽有，大部分都是react+antd，偶尔一次看到material-ui这个react UI组件，感觉很特别，于是尝试使用搞一个demo体验一下，经过不断细化转化到目前一个比较完整的项目，特发此文以作记录，希望可以帮助更多的开发者。…