Vue 3 响应式基于 Proxy 拦截对象的 get/set，在 get 中通过全局 activeEffect 将副作用函数收集到 WeakMap<target, Map<key, Set<effectFn>>> 依赖桶中，在 set 中取出依赖并触发更新；通过 cleanup 机制每次执行前清除旧依赖、重新收集，避免过期依赖。相比 Vue 2 的 Object.defineProperty，Proxy 能直接拦截属性增删与数组操作，支持惰性深层代理。ref 则通过 .value 的 getter/setter 将基本类型也纳入这套体系。
Skip to content 
Teacher, I'm on fire to improve!
Welcome to my blog. I'm Hoey — a programmer who codes, creates, and stays curious. Outside of work, I play PC games, watch movies, and listen to music. On this blog, I write about development topics, and occasionally share some fun stuff. Glad to have you here.
Contributions
Contributions in the past year
JulAugSepOctNovDecJanFebMarAprMayJun
Skills
Skills and tools
HTML
CSS
Sass
Less
Tailwind
JavaScript
TypeScript
Vue
Pinia
React
Zustand
React Router
Mini Program
Electron
Element Plus
Naive UI
Ant Design
Vuetify
Bootstrap
Vite
Webpack
HTML
CSS
Sass
Less
Tailwind
JavaScript
TypeScript
Vue
Pinia
React
Zustand
React Router
Mini Program
Electron
Element Plus
Naive UI
Ant Design
Vuetify
Bootstrap
Vite
Webpack
NodeJS
Express
Koa
Java
Spring
Spring AI
MySQL
Netlify
Vercel
Cloudflare
NodeJS
Express
Koa
Java
Spring
Spring AI
MySQL
Netlify
Vercel
Cloudflare
VSCode
Cursor
Trae
Claude Code
ChatGPT
DeepSeek
WebStorm
Obsidian
VuePress
Git
pnpm
VSCode
Cursor
Trae
Claude Code
ChatGPT
DeepSeek
WebStorm
Obsidian
VuePress
Git
pnpm
Posts
My latest posts
虚拟 DOM 配合 Diff 算法通过最小化真实 DOM 操作提升视图更新效率。Vue 3 在编译时借助静态提升、PatchFlags、Block Tree 和最长递增子序列等优化，大幅减少运行时无意义的节点对比，相比 Vue 2 的全量递归 Diff 性能更优。
Obsidian 是一款强大的知识管理工具，它基于本地 Markdown 文件，通过双向链接帮助构建个人知识网络。 无论你是写作、学习还是管理项目，Obsidian 都能成为你的第二大脑。本文将带你快速上手，从基础设置到同步方案，再到实用插件， 让你轻松上手 Obsidian。
JavaScript 是单线程的，这意味着它一次只能执行一个任务。为了处理异步操作，JavaScript 依赖 事件循环（Event Loop） 机制——它允许 JS 引擎在等待异步操作完成时继续执行其他任务，从而实现非阻塞的异步编程。