• function 后，调用$mount的mountComponent方法，先执行beforeMount钩子函数，然后核心是实例化一个渲染Watcher，在它的回调函数（初始化的时候执行，以及组件实例中监测到数据发生变化时执行）中调用updateComponent方法（此方法调用render方法生成虚拟

• 调用render方法将render function渲染成虚拟的Node（真正的 DOM 元素是非常庞大的，因为浏览器的标准就把 DOM 设计的非常复杂。如果频繁的去做 DOM 更新，会产生一定的性能问题，而 Virtual DOM 就是用一个原生的 JavaScript 对象去描述一个 DOM 节点，所以它比创建一个 DOM 的代价要小很多，而且修改属性也很轻松，还可以做到跨平台兼容），render方法的第一个参数是createElement(或者说是h函数)，这个在官方文档也有说明。

• 生成虚拟 DOM 树后，需要将虚拟 DOM 树转化成真实的 DOM 节点，此时需要调用update方法，update方法又会调用pacth方法把虚拟 DOM 转换成真正的 DOM 节点。需要注意在图中忽略了新建真实 DOM 的情况（如果没有旧的虚拟 Node，那么可以直接通过createElm创建真实 DOM 节点），这里重点分析在已有虚拟 Node 的情况下，会通过sameVnode判断当前需要更新的 Node节点是否和旧的 Node 节点相同（例如我们设置的key属性发生了变化，那么节点显然不同），如果节点不同那么将旧节点采用新节点替换即可，如果相同且存在子节点，需要调用patchVNode方法执行 DIFF 算法更新 DOM，从而提升 DOM 操作的性能。

需要注意在初始化阶段，没有详细描述数据的响应式过程，这个在响应式流程里做说明。

• 的Proxy来优化响应式原理）。在初始化流程中的编译阶段，当render function被渲染的时候，会读取Vue实例中和视图相关的响应式数据，此时会触发getter函数进行依赖收集（将观察者Watcher对象存放到当前闭包的订阅者Dep的subs中），此时的数据劫持功能和观察者模式就实现了一个 MVVM 模式中的 Binder，之后就是正常的渲染和更新流程。

• 当数据发生变化或者视图导致的数据发生了变化时，会触发数据劫持的setter函数，setter会通知初始化依赖收集中的Dep中的和视图相应的Watcher，告知需要重新渲染视图，Wather就会再次通过update方法来更新视图。

可以发现只要视图中添加监听事件，自动变更对应的数据变化时，就可以实现数据和视图的双向绑定了。

• Vue.js 源码的入口主要做了些什么处理？

• Vue.js 中的数据劫持是怎么实现的？浏览器兼容性呢？

• Vue.js 中的依赖收集是怎么处理的？和闭包有什么关联吗？

• Vue.js 中的模板解析需要经历哪几个阶段？

• Vue.js 中的虚拟节点优势是什么？

• Vue.js 中 DIFF 算法的时间复杂度是多少？为什么？

• Vue.js 中有哪些周期函数？这些周期函数都是在什么时机执行的？

• Vue.js 对 DOM 的更新做了哪些标记优化处理？

• Vue.js 在语法层面可以做哪些优化处理？

• Vue.js 如何做单元测试？

• 了解过 Vue-Router / Vuex 的源码吗？（感知性问题，不会深入问）

• 发布 / 订阅模式和观察者模式的区别是什么？

• 手写一个发布 / 订阅模式？

• 如果熟悉 Nuxt 等可能会问 SSR 的实现原理？

• Vue 2.x 中的数据劫持能否采用发布 / 订阅模式实现？采用观察者模式带来的优势和劣势有哪些？

• Vue 的整个框架的实现原理大致可分为哪几个部分？

Vue.js 中组件之间通信有哪些方案？

• 祖先和子孙之间通信有哪些方案？

• 任意组件之间通信有哪些方案？

Vue 如何定制化脚手架？需要考虑哪些因素？

• 宏任务和微任务有什么区别？

• 哪些是宏任务哪些是微任务？

• $nextTick在几个版本迭代中都经历了什么变化？

• 打开新的浏览器窗口时会重新创建一个新的 Network 进程吗？

说说 Vue 里的数据劫持在不同版本里是如何处理的？

Vue 能做哪些性能优化？

• 减少非必要的响应式依赖

• 事件销毁（防止内存泄漏）

• 路由懒加载是如何实现的？

• Polyfill 是什么？Vue 支持哪些相关的可配置化信息？

• Vue 中可以使用 JSX 吗？（居然有人不清楚 JSX 是什么）

React 中受控组件和非受控组件的区别？

简历写着抽取公共业务组件

• 在哪些场景应该使用非受控组件？

公司的组件库搭建、设计与维护？

简历写着设计和维护公司的组件库

• 完整引入 / 按需引入

• 按需加载功能可以有哪些实现方案？

• 主要负责了哪些组件的设计？

• 主动性的业务组件封装案例？

• 看过 xxx 组件库的源码设计吗？

• 设计组件的时候会考虑对 TypeScript 进行支持吗？

• 业务组件的单元测试一般需要测试什么内容？

简历写着使用 Element UI 进行业务开发并自己设计过组件

组件库要做按需加载，觉得应该怎么做？

简历写着使用使用按需加载提升页面性能

如何自动屏蔽 Input 的自动密码填充？

设计模式中观察者模式和发布 / 订阅模式有哪些区别？

简历中写着熟悉设计模式、Redis、Vue 源码等

• 平常在哪些地方有使用到观察者或发布 / 订阅模式？

Webpack 构建速度优化有哪些方案？

项目中写着使用 Webpack 进行构建速率优化

• 排除三方库，防止二次打包

• 未优化前构建需要多少时间，优化后构建需要多少时间？

• 有没有分析是什么问题导致构建速率变慢？

说说你对 cz 生态的了解？

项目中写着使用 cz 规范 Git 提交

• Cz工具集使用介绍 - 规范Git提交说明

简单说说 Webpack 对于性能优化有哪些特性？

了解 SPA 的懒加载么？

有做过基于 Express 的应用框架技术选型么？

前后端分离的历史？分离模式带来的好处和坏处有哪些？

Node 里的事件循环机制和浏览器的事件循环机制有什么区别？

说说怎么用纯粹的 Node.js 做一个服务端框架？谈谈 Node.js 服务端 MVC 的理解？

熟悉 Node，谈谈服务端 MVC 的演变历史？

跨域的解决方案有哪些？cors 是怎么处理跨域？

如何设计突发大规模并发架构？

一般公司是怎么部署前端代码？

axios 库有什么能力？axios 库发请求的之前能做拦截么？

• axios 库发请求的之前能做拦截么？

• axios 库发请求的时候能取消请求么？

硬件层和前端是如何做通讯的？

• WebSocket 的浏览器兼容性如何处理？

谈谈你对缓存的理解，举一个和你最相关的缓存的使用案例。

服务端推送主要用到什么技术？

• 在不兼容 WebSockect 的情况下如何做降级兼容处理？

简单介绍一下 Graphql，说说为什么要在你的项目中使用 Graphql？

了解跨域么，一般什么情况下会导致跨域？

平常开发的过程中有写过单元测试或者 e2e 测试么？

自动化测试主要是做什么？

SEO 有哪些优化方案？

说说任何前端优化处理？

规范代码书写的适用范围有多大？

版权信息小工具是干什么的，能具体介绍一下么？

介绍一下 dtd 组件，组件是如何维护的，版本是怎么控制的？

在业务的开发中有没有发现什么痛点并对其进行改进？

有没有觉得交互设计不合理然后自己想出方案推动交互更改的案例？

前端广告投放如何？Chrome 如何劫持广告？

简化业务设计的复杂度案例有么？

有没有做过什么工具简化业务开发？

有没有主动 own 过业务，并高效排除业务风险的案例？

说说如何衡量提升产品的体验？

温馨提示：有些业务问题主要针对的是简历中的项目，在这里不适合展示。不过有一点需要注意，面试官可能会对业务的数据非常感兴趣，所以在业务上有比较 NB 的数据可以体现的最好可以提前准备好。业务这一块可能会考量的点：业务数据 / 业务难点 / 业务成果 / 业务贡献 / 业务主动性 / 业务 own 能力 / 技术栈选型考量 / 业务影响范围 / 业务通用性 / 业务思考 ......

什么是渐进增强和优雅降级？

简单实现一个发布订阅机制？

实现一个扑克牌式的插入排序（我们总是喜欢将某张扑克牌插入到已排序的扑克中），输入：[5,6,1,8,7,2,4,3]，输出：[1,2,3,4,5,6,7]，并提供单元测试思路（如何测试你的代码是稳定正确的）？

假设某个组织下面挂了 10 w 个节点，如何做优化处理？

用 Vue 的时候有没有遇到过难以解决的问题？

说说你业务中觉得性能优化最大的一个场景？

说说你业务中至今没有解决的问题？

说说你业务中遇到最难解决的问题？

高效的自学能力，能举个例子体现一下高效么？

除了业务上的开发，平常会有什么学习计划么？

本公众号全部原创已整理成一个专栏，请在公众号里回复「测试开发」获取！点个“在看”支持一下????

盘点近年来最好用的蓝领求职

互联网数据中心”披露出一个关于蓝领招聘网站的数据，相关的各个蓝

领招聘平台获得的各路资本青睐的报道和话题开始热闹起来，

而言，他们其实对此并不感冒，他们最关心的是在这类给他们提供就业服务的招聘平台上，

或者少花钱并且安全快速可靠地找到一份让自己满意的工作。

缭乱的各个蓝领招聘平台，对于一名

后的普通蓝领而言，到底该如何选择呢

线下笔者挑比较火的几款专门针对蓝领招聘的

处，借以中国庞大蓝领群体一双慧眼，挑到最适合自己的蓝领招聘

大谷打工网由于较早切入蓝领招聘领域，

其线下运作经验较为成熟，

平台目前明显没有在移动端发猛力的迹象。

软件设计来看，稍显繁琐

，用手机号注册以后选择工作，会有专人客户打电

话过来沟通。软件里有“保送”窗口，里面是正在招聘的大型工厂，找工作需要在这里面选

择。软件有个“八点”窗口，是一个简单的、小型的社区平台，只能问答而没有更多深层次

的交互功能。从笔者体验大谷的电脑招聘网页、手机网页和安卓

不难看出，网上平台主要还是为了给大谷网的线下引流，主要依靠客服电话解决问题。

但是求职者可以选择的企业比较

狭窄，线上体验有点不尽如人意。

我的打工网专为手机上网打工者提供招聘信息，

希望在企业与打工族之间打造一条

，近年来发展势头不错。

我的打工网目前主要覆盖区域人群在江苏苏州和上海，

模式为工厂补贴和政府支持，

同时采取跟部分工厂合作的劳务派遣模式。

界面设计简单，基本就一个功能，找工作。两个选项菜单也很直接，

一句话点评：线上体验操作简单，找工作免费，但体检和工作之前的住宿需花钱。