1.输入一个URL到页面过程中发生了什么？

1.首先在浏览器中输入URL
2.查找缓存，首先先查看浏览器缓存-系统缓存-路由缓存这个顺序中查找是否有该地址，如果有则显示页面内容，没有则进行下一步
3.DNS域名解析：浏览器向DNS服务器发起请求，解析该URL种域名对应的IP地址（DNS服务器基于UDP，因此会用到UDP协议）
4.建立TCP连接：解析出IP地址后，根据IP地址和默认80端口，和服务器建立TCP连接
5.发起HTTP请求：浏览器发起读取文件的HTTP请求，该请求报文作为TCP三次握手的第三次数据发送给服务器
6.服务器响应请求并返回结果：服务器对浏览器请求做出响应，并把对应的html文件发送给浏览器
7.关闭TCP连接：通过四次挥手释放TCP连接
8.浏览器渲染：浏览器解析HTML内容并渲染出来，浏览器接收到数据包后的解析流程为

• 构建DOM树：词法分析然后解析成DOM树，由dom元素及属性节点组成，树的根是document对象
• 构建css规则树：生成css规则树
• 构建render树：浏览器将DOM和CSSOM结合，并构建出渲染树
  *布局：计算出每个节点在屏幕中的位置
• 绘制：遍历render树，并使用UI后端层绘制每个节点

2.vue生命周期

create阶段：vue实例被创建 beforeCreate：创建前，此时data和methods中的数据都还没有初始化；created：创建完毕，data中有值，未挂载
mount阶段：vue实例被挂载到真实DOM节点 beforeMount：可以发起服务器请求；mounted：此时可以操作DOM
update阶段：当vue实例里面的data数据发生变化时，触发组件的重新渲染（beforeUpdate updated）
destory阶段：vue实例被销毁 beforeDestroy：实例被销毁前 destroyed

3.vue2.0和vue3.0有什么区别

1.响应式系统的重新配置，双向数据绑定的原理不同，使用es6的ProxyAPI（代理）替换对象.define属性。使用代理优势

• 可直接监控列类型的数据变化
  *监听的对象是对象本身，不需要像Object.defineProperty那样遍历每个属性，有一定的性能提升
• 省去for循环，闭包等内容来提升效率
• 直接添加对象属性/删除
• 直接监听数组，不需要再去单独对数组做特异性操作

2.支持碎片（多个根节点）
vue2不支持碎片，而vue3支持