hjhfreshman的博客

MVC：Model、View、ControllerM:数据层，V：视图层，C：负责数据和视图交互的控制层他们是如何工作的？举例子：C是老板，M是一堆文件，V是展示这些文件的展台，老板( C )负责自己处理这些文件（M）如何展示到展台（V）MVVM：Model、View、ViewModel。M:数据层，V：视图层，VM：数据视图交互的工具（封装了交互的规，方法）举例子：C还是老板（不过现在角色不是很重要，只负责发布命令），M是一堆文件，V是展示这些文件的展台，老板觉得自己展示很累，就使用了一个工具

vue3 学习笔记1.reavtive是递归监听实现的，即可以通过obj.a.b直接修改对象，视图会更新，如果数据量大，性能消耗也大。2.shallowReactive和shallowRef,非递归监听，可以用triggerRef来触发ref的更新。数据量非常大的时候使用。3.ref本质是reactive({value:"值"})，所以js访问的时候要加.value,然而渲染的时候会有一个__v_isRef:true标记，所以模板会直接识别自动加。value，不需要.value...

1.Vue3.0六大亮点Performance：性能比Vue 2.x快1.2~2倍Tree shaking support：按需编译,体积比Vue2.x更小Composition API: 组合API(类似React Hooks)Better TypeScript support：更好的 Ts 支持Custom Renderer API：暴露了自定义渲染APIFragment, Teleport(Protal), Suspense：更先进的组件2.Vue3.0是如何变快的?diff算法

一、默认进行懒观察（lazy observation）　　在 2.x 版本里，不管数据多大，都会在一开始就为其创建观察者。当数据很大时，这可能会在页面载入时造成明显的性能压力。3.x 版本，只会对「被用于渲染初始可见部分的数据」创建观察者，而且 3.x 的观察者更高效。二、更精准的变更通知。　　举例来说：2.x 版本中，使用 Vue.set 来给对象新增一个属性时，这个对象的所有 watcher 都会重新运行；3.x 版本中，只有依赖那个属性的 watcher 才会重新运行。三、3.0 新加入了 Ty.

createApp在 Vue 3 中，改变全局 Vue 行为的 API 现在被移动到了由新的 createApp 方法所创建的应用实例上。vue3.0中使用createApp 来创建vue实例import { createApp } from 'vue'import App from './App.vue'const app = createApp(App);app.mount('#app');main.js 下加载router、vueximport { createApp } from