- 博客(508)
- 收藏
- 关注
RSS订阅原创 路由（React-Router）
每访问一个页面，浏览器都会向服务器重新请求页面。URL变化了，但实际上只有一个 HTML 页面。React Router 根据 URL 显示不同组件。/login -> Login组件/user -> User组件/order -> Order组件。
2026-06-25 18:41:00
56
原创 原生DOM操作在React 中的注意事项
在 React 中，。因为 React 本身通过来管理页面，如果直接操作真实 DOM，可能会与 React 的状态管理机制产生冲突。
2026-06-24 14:11:04
184
原创 react错误边界 ErrorBoundary
（错误边界）是 React 提供的一种，用于捕获其子组件树中的 JavaScript 运行时错误，并显示降级 UI，而不是让整个应用崩溃。
2026-06-23 19:49:11
192
原创 并发模式、React18- React19新特性
用户操作↓React开始渲染↓渲染结束↓浏览器响应一旦开始渲染：不能暂停不能中断不能插队i < 100000;i++){// 大量计算页面卡顿输入框延迟按钮无响应特性React18React19并发渲染✅✅自动批处理✅✅✅✅✅✅✅✅Suspense增强✅✅✅✅useId✅✅实验性更成熟Actions❌✅❌✅❌✅❌✅use()❌✅Metadata❌✅资源预加载API❌✅。
2026-06-22 19:04:36
245
原创 react批量更新、同步/异步更新场景
0 -> 11 -> 22 -> 3最终 = 1render()render()render()render()提高性能。场景是否批量更新React事件✅生命周期函数✅setTimeout❌Promise❌❌原生事件❌场景React16/17React18/19React事件✅✅Promise❌✅setTimeout❌✅❌✅原生事件❌✅。
2026-06-19 09:00:26
186
原创 避免不必要渲染：PureComponent、memo、useMemo、useCallback
API作用适用类组件避免重复渲染ClassReact.memo函数组件避免重复渲染FunctionuseMemo缓存计算结果值缓存函数引用函数解决「组件重复渲染」useMemo解决「重复计算」解决「函数引用变化导致的重复渲染」
2026-06-14 18:56:33
195
原创 懒加载与分包：React.lazy + Suspense
Webpack/Vite 打包时会把这些页面全部打进首屏 Bundle。main.js├── Home├── User├── Report└── ...首页代码用户页代码报表页代码全部下载。缺点：首屏资源大首次加载慢FCP/LCP变差main.js按需加载哪个chunk这就是分包。
2026-06-13 17:20:30
178
原创 http1.1 vs http2区别
特性HTTP/1.0HTTP/1.1HTTP/2长连接❌✅ 默认开启✅Host头❌✅✅管道化❌✅✅(多路复用)Chunked❌✅✅Header压缩❌❌✅二进制传输❌❌✅多路复用❌❌✅。
2026-06-12 10:38:07
197
原创 React 项目常见优化方案
对于面试和实际项目来说，React 优化一般分为五大类。结合你做过性能平台、ECharts、后台管理系统的经验，下面这些是最常见且最实用的优化方案。
2026-06-09 09:53:05
261
原创 Context 如何实现 Provider 嵌套优化
在 React 中，嵌套过多会导致：组件树层级变深，可读性变差Provider 维护困难任意 Context 值变化时可能引起不必要的重新渲染。
2026-06-07 08:33:21
212
原创 react的useMemo 如何优化？
缓存重计算值复杂计算、大数组操作、大对象计算示例：阶乘、排序、过滤、聚合计算缓存引用类型避免每次渲染生成新的数组/对象，导致子组件不必要渲染常配合React.memo或分离组件如果父组件渲染频繁，且子组件依赖开销大的计算，考虑用useMemo或拆成独立组件依赖最小化确保依赖数组只放必须的值，避免频繁失效。
2026-06-05 10:20:19
206
原创 react中的Context 为什么会导致性能问题？
原因说明Consumer 全量通知Context 更新时所有 Consumer 都会重新渲染无细粒度订阅无法只监听某个字段React.memo 无效Context 更新会绕过 memovalue 对象变化新引用会触发更新单一大 Context一个字段变化影响全部组件一句话概括：Context 的性能问题不在于读取（useContext），而在于Provider 的value。
2026-06-03 10:07:04
235
原创 前端如何和蓝牙物联网进行通信和兼容性问题
前端与蓝牙物联网（Bluetooth IoT）通信，本质上是在和设备的进行数据交互。对于有 React/RN 背景的开发者来说，重点不仅是“怎么连”，更重要的是理解通信协议、数据格式和兼容性问题。
2026-06-02 09:51:49
291
原创 Mobx 核心思想、和Redux 区别
MobX：强调响应式、自动追踪依赖、简化开发，适合快速开发、状态分散、UI 组件复杂的场景。Redux：强调可预测、可追踪、严格控制状态更新，适合大型项目、状态共享广泛且复杂的场景。
2026-05-31 10:24:37
163
原创 Redux Toolkit 用法、解决原生Redux 冗余问题
是 Redux Toolkit 官方推荐的 Redux 开发方式，用来解决原生 Redux 配置复杂、模板代码过多的问题。
2026-05-29 15:22:27
248
原创 Redux 中间件作用（redux-thunk/redux-saga）
Redux 中间件（Middleware）本质上是：reducer它主要解决：异步请求日志打印权限校验接口调用延迟 dispatch副作用管理。
2026-05-28 16:59:54
379
原创 Redux 核心流程：Action、Reducer、Store、Dispatch
Redux 的核心思想是：统一状态管理 + 单向数据流。最核心的几个概念就是：Store → Action → Dispatch → Reducer → Store 更新 → 视图更新。流程图：1. Store（仓库）Store 是 整个应用状态(state)存储中心。可以理解成：里面保存所有共享状态。例如：创建 Store：常用方法：2. Action（动作）Action 描述：它只是一个普通对象。例如：或者带参数：规范：必须有：通常包含：
2026-05-27 15:58:24
237
原创 react的Context 跨层传值、优缺点、适用场景
即使Parent和Child不使用theme，也必须传。Props Drilling（属性穿透）Context 用于解决这个问题。跨组件共享数据机制主题登录权限语言配置复杂全局状态管理Zustand。
2026-05-26 15:23:33
252
原创 react的 useReducer 使用场景、替代 useState 的情况
useStateuseReducer是 React 提供的状态管理 Hook，适合处理。很多场景用useState能写，但随着状态增多、更新规则复杂，代码会变乱，这时候useReducer更适合。
2026-05-24 19:53:49
242
原创 react自定义Hook 写法、规则（只能在组件/自定义Hook内调用）
命名必须以usereturn {count,increment,decrementreturn (<></button></>点击按钮↓count变化↓组件重新渲染类似把业务逻辑抽出去。自定义Hook↓内部可以继续调用 useState/useEffect总结成一句：Hook 只能在：React 函数组件自定义 Hook（useXXX）里面调用。},[])},[])useUser()什么是自定义 Hook？把组件内可复用的状态逻辑抽离成函数，以use开头，可复用。
2026-05-23 09:13:03
500
原创 小程序游戏开发技术栈都有哪些？
小程序游戏（尤其是微信小游戏）和普通 Web 前端开发有相似点，但运行环境、渲染方式、性能优化、发布生态都不一样。你有 React/Vue 前端经验，切入会比较快。可以从「底层能力 → 开发框架 → 游戏引擎 → 服务端 → 运营生态」理解。
2026-05-22 08:03:23
439
原创 桌面端开发生态
语言桌面方案C++C#JS/TSPythonJavaRustTauri、IcedGoWails、FyneDartFlutterSwiftSwiftUIKotlinReact↓Electron↓Tauri↓Rust（进阶）很多企业内部桌面工具、性能平台客户端、监控软件都这么做。
2026-05-21 16:02:20
415
原创 node开发生态
Node.js 的生态非常大，不只是“写后端”。很多前端、构建工具、CLI、桌面应用、AI 工具都跑在 Node 生态上。我按常见方向整理。
2026-05-20 08:41:51
285
原创 前端浏览器自动化
前端浏览器自动化（Browser Automation）通常指通过代码控制浏览器执行操作，例如：打开网页、点击按钮、填写表单、登录系统、抓取数据、自动测试等。前端开发里常见用途：自动化测试（E2E 测试）自动登录、批量操作后台数据采集（爬虫）性能测试截图、生成 PDF模拟用户行为自动化部署检查。
2026-05-19 11:58:35
215
原创 大前端框架生态
把所有前端框架列出来”实际上做不到，因为框架和库数量非常多（几百个+），还在持续出现。更实用的是按等生态梳理。你做过 React/Vue 企业项目，我按“大前端全景图”整理，尽量覆盖主流生态。
2026-05-18 08:52:39
636
原创 useMemo 与 useCallback 区别、各自解决什么性能问题、依赖陷阱
这是 React 面试里非常高频的问题。你有前端经验，直接从理解会更快。
2026-05-17 14:48:27
397
原创 react的useRef 作用：获取DOM、保存可变数据、区别 createRef
useRef主要有三个用途：获取 DOM、保存可变数据、和createRef的区别。
2026-05-16 14:46:40
110
原创 react的 useState 原理、批量更新机制
0不是 1。setState 不会立刻修改 state而是：1. 先放入更新队列2. React 调度更新3. 重新渲染组件setState 本身不是异步 API而是 React 的状态更新是“调度式”的表现上像异步。
2026-05-15 09:11:59
452
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人