- 博客(17)
- 收藏
- 关注
RSS订阅原创 useMemo + memo + useContext 性能优化实战：从无感重渲染到丝滑体验
useContext虽然让跨层级传参变得优雅，但它对性能的副作用常常被忽视：只要value的引用发生变化，所有消费它的组件都会无差别更新，哪怕这些组件并未使用发生变化的那部分值。useMemo 保持 value 稳定：避免不必要的引用变化；memo 缓存消费组件：提升组件重用率，减少重渲染；组件职责拆分：精细控制渲染粒度，配合memo更高效。当这三种策略协同配合时，能最大化发挥 React 的性能潜力，实现真正意义上的按需渲染。希望这篇文章能帮你更深入理解useContext重学 React系列。
2025-04-18 17:47:34
746
原创 Vue 人快上车！用 useContext 实现 Vuex 同款全局状态管理！
作为一个 Vue 转 React 的前端，我们早就习惯了使用 Vuex 来管理全局状态，什么 state、mutation、action 一套操作下来玩得贼熟练。但在 React 中，我们没有 Vuex 了，要怎样去进行状态管理呢？
2025-04-17 18:07:33
941
原创 Vue 人看 useMemo：别再滥用它做性能优化
对 Vue 开发者来说，初见 `useMemo` 很容易以为它就是 React 版的 `computed`，但真相可能让你大吃一惊：它**不是**响应式的魔法工具，也**不是**你随手就该加的性能“神器”。
2025-04-16 18:09:26
1025
原创 Vue 人看 React useRef：它不只是替代 ref
如果你是从 Vue 转到 React 的开发者，初见 `useRef` 可能会想：这不就是 React 版的 `ref` 吗？但真相是 —— 它能做的，比你想象得多得多。
2025-04-15 18:18:20
839
原创 Vue 人转 React 必踩的 useEffect 坑，我来填平了
如果你刚从 Vue 进入 React 世界，useEffect可能是你最容易踩坑的 Hook。它看起来像 Vue 的生命周期函数，实际却大不相同。你是不是也遇到过这些疑惑？“它到底是mounted还是updated的替代？“为什么我的副作用逻辑会无限触发？“依赖项到底该不该加？加了它就炸，不加它报错？别急，这篇文章我会从运行时机、依赖项、清除机制到常见陷阱，逐一帮你搞清楚useEffect的使用姿势。
2025-04-14 18:58:09
1177
原创 Vue 开发者看过来！一文吃透 React 的 useState
作为 Vue 转 React 的前端，我刚开始接触 `useState` 时踩了不少坑。这篇文章我会用尽量通俗的方式，帮你彻底掌握它的用法和原理！
2025-04-11 18:58:59
840
原创 #揭秘Vue3源码之computed：懒计算与缓存机制全解析
在这个瞬息万变的前端世界里，你是否曾好奇：那些高性能的交互和流畅的用户体验背后，到底隐藏着怎样的“黑科技”？本文将带你深入探秘最新的计算属性computed源码实现，从底层逻辑到实际应用案例，全面揭开技术背后的神秘面纱。无论你是初学者还是资深开发者，都将在这里发现全新的思维方式，激发你无限的创意灵感，助你在技术的道路上再创高峰！
2025-04-03 13:41:30
650
原创 Vue3源码：5个问题带你读懂watch
在Vue3的中，watch被广泛使用，无论是在表单监听、数据同步，还是监听路由变化，watch都是Vue开发中不可或缺的工具。它的作用是在每次响应式状态发生改变时触发回调函数。这篇文章将带着5个疑问带你深入理解watch源码。watchcbwatchdeep: truerefoldValuenewValuejobwatch带着上面5个问题，我们进入源码中进行调试，看看watch是如何运行的，本文参考源码版本为。
2025-03-20 16:47:26
1084
原创 5 分钟掌握 TypeScript 结构化类型系统，一次搞懂鸭子类型！
你是否遇到过这样的情况：明明传了一个「看似不对」的类型TS居然不报错？这！不！科！学！😱这不是TypeScript的 bug，而是一个精心设计的特性——结构化类型（Structural Typing），江湖人称鸭子类型这个看似「随意」的机制，其实是TypeScript灵活性的核心密码。为什么两个毫无关系的类可以互相赋值？怎么避免「长得像」的类型意外兼容？
2025-03-12 17:29:46
1080
原创 Vue3源码解析之nextTick：拯救“数据变了但 DOM 还没反应过来”的尴尬场面
我们将深入剖析 Vue3 中的一个重要工具——nextTick。你可能已经在项目中多次使用过它，但是否真正理解它的工作原理？它是如何在异步更新 DOM 的过程中发挥作用的？它是如何与 Vue3 的响应式系统配合工作的？这些问题的答案，正是我们今天要揭开的谜底。通过这篇文章，你将不仅仅了解nextTick的基础用法，更会深入理解它的工作原理、底层实现以及应用场景。
2025-03-05 14:24:53
1061
原创 Vue3源码解析之Ref、Effect
上篇文章详细讲解了响应式原理中的核心方法reactive，这篇文章我们继续讲解响应式原理中的另一个核心方法ref以及副作用函数effect，本文参考源码版本为。
2025-03-03 17:14:55
1215
原创 手摸手带你阅读Vue3源码之Reactive 下
你是否曾想过，Vue3 中的reactive究竟是如何在幕后管理数据和视图更新的？本文将带你深入挖掘 Vue3 响应式系统的精髓，从源码中解开reactive的工作原理，帮助你在实际开发中更好地运用这一强大的功能。reactive函数实际上调用了方法。负责创建一个proxy实例，并为代理对象添加getter和setter行为，这些行为是在对象中定义的。在改变属性时，会触发中的set方法当新值被设置时，set方法会触发trigger函数，进而触发依赖的更新在trigger中，从。
2025-02-27 13:55:02
1068
原创 手摸手带你阅读Vue3源码之Reactive 上
你是否曾想过，Vue3 中的reactive究竟是如何在幕后管理数据和视图更新的？本文将带你深入挖掘 Vue3 响应式系统的精髓，从源码中解开reactive的工作原理，帮助你在实际开发中更好地运用这一强大的功能。学习reactive深入理解 JavaScript 中的Proxy和Reflect，掌握它们的使用和优势。学会如何在响应式系统中追踪依赖，触发视图更新，实现发布订阅模式。了解 Vue 如何处理深度嵌套的对象，并支持浅响应和深响应模式。学到性能优化的技巧，如何高效地管理依赖和更新。
2025-02-26 18:29:15
1032
原创 不再吐槽没有抽奖记录，用 Node+Koa+MongoDB 给女朋友写个抽奖系统
我不仅解决了女朋友“没有抽奖记录”的问题，还实现了一个基于的抽奖记录管理系统。每当她抽到“奖品”时，不仅能看到幸运的记录，还能看到所有历史抽奖记录，彻底避免了“我就知道你不会给我抽到奖”的尴尬！
2025-02-24 17:11:16
640
原创 02.20 手搓js笔记
是 JavaScript 中的一个方法，用于改变函数内部。类似，区别在于参数传递方式为数组。返回一个新的函数，新的函数可以在调用时指定。的指向，并且支持链式调用。的指向，并传入参数。以下是手动实现深拷贝的代码，使用。类，支持链式调用并且遵循。以下是一个简易实现的。
2025-02-24 17:09:09
134
原创 根据Promise/A+ 规范简单实现一个Promise
/实现Promise//定义Promise状态值static PENDING = '待定';static FULFILLED = '解决';static REJECTED = '拒绝';//定义result存储传入值//定义初始化状态，初始化状态为待定//传入方法直接执行//定义成功失败方法，需注意使用箭头函数写法，this指向对象内部//状态是单向且不可逆的，所以如果判断不为待定态则return//改变状态为对应状态//接收传入值。
2025-02-24 17:08:12
452
原创 React基础学习笔记
笔者技术栈为 Vue，闲来无事，重温下胖哥的React 基础课程，记录自己学习 react 的过程，希望能帮助到和我一样的初学者，此处附上胖哥课程的链接：React16 免费视频教程（共 28 集）当前全球最火的前端框架，由 Facebook 推出并进行维护，社区强大，国内的一二线互联网公司大部分都在使用 React 进行开发，还衍生了和React VR这些比较好用的框架。//目录表 ├─ public │ favicon . ico│└─srcApp . cssApp . js。
2025-02-24 17:01:17
699
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人