造轮子:有钱有资源,业务定制,技术KPI(提升开发业务效率/业务定制).
考察重点,而不是细节。 2/8原则。
和使用相关联的原理,例如vdom/模板渲染(更好工作产出)
热门技术深度? 整体流程全面(!!!)
一: 组件化
二:响应式
三: vdom diff (热门技术) v-for中为什么要用key?
四:模板编译
五:渲染过程(流程全面度) 描述组件渲染和更新的过程?
六: 前端路由
一:组件化基础()
传统的组件是静态渲染,更新要依赖操作DOM (jquery)
数据驱动视图(MVVM,setState)【不动dom 只改数据 不要操作dom】
怎么理解MVVM
View(视图)
Vue (vue model层)通过这一层 m的数据变化能够执行到V的渲染 V层的点击阿 等等也能执行到M层 【此层是个连接层】
Model(组件里面data)
二: Vue的响应式
组件中data数据变化 立刻出发视图更新
实现数据驱动视图的第一步
核心API Object.defineProperty
V3.0用Proxy避免缺点(兼容性问题 无法polyfill 不兼容IE11 浏览器)
缺点:1.深度监听需要递归到底 计算量大
2.新增和删除 监听不到(Vue.set Vue.delete 2.0中有用)
3.无法原生监听数组 需要特殊处理(对原型中做修改)
三: vdom diff
vdom是实现vue react 基石
diff算法是vdom中核心
DOM操作耗时耗费性能
vue与react数据驱动视图 如何有效控制DOM操作 ?【框架原因】
vdom原理:把DOM更新计算更多转移到js计算 因为V8速度快
用js模拟dom结构(没有严格的要求),计算最小的变更,操作dom
xml的结构 用json的结构表示
怎么用: snabbdom库
3.0 与react 的实现都不同 但是基本理念是一样的。
虚拟dom要素: 1.标签 或者选择器 (tag/ sel)
2.属性 (属性或者样式或者事件)(data props)
3.子元素 children
1. h函数如何生成vnode 结构
2.patch的初次渲染以及更新 销毁
3.vDom的数据结构
虚拟vdom使用:用js模拟dom结构
新旧vdom的对比 得出最小更新范围 最后更新dom(控制)
数据驱动视图模式下 有效控制dom操作 性能得到保证