React基础

在 React 生态中，状态管理一直是开发者绕不开的话题。Redux 以其严谨的“单向数据流”闻名，虽然有一定的学习成本，但它为大型项目带来的可预测性和可调试性是无可替代的。

React Router 是 React 单页应用的核心路由库，除了基础的路由配置，日常开发中还会高频用到路由监听、编程式跳转、路由守卫等进阶功能。

单页面应用（SPA）开发中，前端路由是核心基石。它让我们可以根据 URL 的变化，在不刷新页面的情况下切换组件。

在 Vue 中，我们可以通过 <keep-alive> 轻松缓存组件实例。但在 React 中，组件卸载意味着状态和 DOM 的彻底销毁。如何在 React 中实现切换页面不丢失滚动位置。

在 React 开发中，Hooks 的出现彻底改变了逻辑复用的方式。它让我们能够将复杂的、可复用的逻辑从 UI 组件中抽离，实现真正的“关注点分离”。

在 React 18 的并发时代，Scheduler（调度器） 是实现非阻塞渲染的幕后英雄。它不只是 React 的一个模块，更是一个通用的、高性能的 JavaScript 任务调度库。

在 React 16 之前，react 的同步递归更新机制让大树渲染成了“性能黑洞”。Fiber 架构的引入，彻底改变了 React 的底层规则，将不可中断的更新进化为异步、可中断、带优先级的更新。

在 React 中，Diff 算法是实现高性能 UI 更新的功臣。它将传统树 Diff 的 O(n^3) 复杂度直接优化到了 O(n)。

在 React 开发中，我们经常会在控制台看到 Each child in a list should have a unique "key" prop 的警告。Key 到底是什么？

在现代前端开发中，直接操作 DOM 就像是“昂贵的体力活”。 React 引入了虚拟 DOM ，在 JavaScript 与浏览器之间搭建了一座“缓冲桥梁”。本文将带你拆解虚拟 DOM 的底层逻辑

在 React 中，我们常说渲染（Render），但它不仅仅是将 HTML 丢给浏览器那么简单。Render 是一个包含计算与 提交的复杂过程。

在 React 的世界里，组件的本质就是一个“函数”，它接收输入并返回 UI。而 State 和Props 则是驱动这个函数运行的两大核心数据源。理解它们的区别，是掌握 React 组件化思维的第一步

在 React 性能优化的工具箱里，useCallback 往往与 React.memo 成对出现。它的存在不是为了让函数运行得更快，而是为了保持函数引用的稳定性，从而避免下游组件不必要的重渲染

在 React 中，组件的重渲染是家常便饭。但当组件树变得庞大，或者计算逻辑变得复杂时，不必要的渲染和计算就会成为性能瓶颈。本文将带你掌握 useMemo 与 React.memo。

在函数式组件中，useEffect 是处理“副作用”的唯一窗口。无论是数据获取、订阅事件还是手动修改 DOM，都离不开它。理解它的依赖追踪机制和清除逻辑，是规避“无限渲染”黑洞的关键。

在 React 的世界里，Props 是数据传递的主旋律。然而key 和 ref并不会被包含在 props 中。如果在普通函数组件中接收 ref，只会得到undefined因此forward应运而生

在 React 的声明式编程中，我们习惯于通过“状态驱动视图”。但在某些场景下，我们需要直接操作 DOM，或者存储一些不希望触发页面重新渲染的数据。这时，useRef 就成了不可或缺的利器。

在 React 开发中，随着应用规模的扩大，Props 下移和状态逻辑复杂化是两大核心痛点。本文将详细讲解如何利用 useContext 实现跨层级通信。

在React 中，useReducer 是处理复杂状态的首选方案。但 Reducer 要求必须返回一个新的状态对象，这导致代码中充斥着大量的展开运算，通过结合 Immer，可以像修改对象一样操作状态

当你的组件状态逻辑变得复杂（例如：一个状态依赖于另一个状态，或者一个动作需要更新多个状态）时，useState 往往会显得力不从心。此时，React 提供的 useReducer 便成了最佳选择