https://github.com/zhaoyiming0803/into-vue
Into Vue.js v2.5.18
https://github.com/zhaoyiming0803/into-vue
javascript vuejs2
Last synced: over 1 year ago
JSON representation
Into Vue.js v2.5.18
- Host: GitHub
- URL: https://github.com/zhaoyiming0803/into-vue
- Owner: zhaoyiming0803
- License: mit
- Created: 2018-11-18T08:05:12.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2023-11-21T11:44:05.000Z (over 2 years ago)
- Last Synced: 2025-03-18T12:03:38.078Z (over 1 year ago)
- Topics: javascript, vuejs2
- Language: JavaScript
- Homepage:
- Size: 3.38 MB
- Stars: 29
- Watchers: 2
- Forks: 7
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
### 前言
最近几个月一直在研究 Vue 源码，踩了很多坑，特别是刚开始，不清楚 Vue 源码整体构成，好几次被某一个 function 的逻辑带进去出不来，好在后期找到了方法，现在将这几个月的研究心得记录下来，一方面当作自己的笔记，梳理思路，也方便后期回顾，另一方面，将笔记开源到 github，希望对 Vue 源码同样感兴趣的童鞋有帮助。
### 学习目标
- 了解 Vue 内部的实现机制，提高开发效率
- 学习 Vue 源码优秀的代码技巧
### 笔记涵盖
- 了解 Vue 源码目录设计
- 找到 Vue 构造函数的源头文件
- 从 new Vue 开始，学习各种 mixin 方法
- Vue 的 options 选项合并，其中包括各种 normolize 及不同选项的不同合并策略，最终生成\$options
- Vue 实例化过程中，一系列的 init 方法及生命周期的执行
- 响应式数据原理，搞清楚 依赖 、观察者 、 订阅 、 发布 之间的关系与执行顺序
- vnode 生成的整个 render 过程，包括组件 vnode 和普通 vnode
- 将 vnode 渲染到页面的 patch 过程
## 横向对比 [React](https://github.com/zhaoyiming0803/into-react18)
- 理解不同框架背后思想
- 思考如何写出易维护、高性能的组件
- 避免踩坑
- 学习优秀的代码技巧
### 目录
├── docs // 笔记文档
├── examples // 笔记中用到的实例代码
├── vue-code // vue源码核心部分
### 对 Vue 响应式原理的模拟
https://github.com/zhaoyiming0803/test-code/blob/master/test64.js
### debug snabbdom
https://github.com/zhaoyiming0803/test-code/tree/master/test131-snabbdom
### 说明
- 笔记持续更新中，如果对您有帮助，您可以点右上角 "Star" 或 "Watch" 支持一下，不要 Fork， 谢谢！ ^\_^
- 或者您可以 "follow" 一下，我会不断开源更多的有趣的项目
- 如有问题请直接在 Issues 中提，或者您发现问题并有非常好的解决方案，欢迎 PR 👍
### 个人微信&QQ：1047832475
