1.前端开发中，在项目中如何进行项目优化
- 在图片上面的优化
- 对于一些项目logo，小图标（图片小于8k）可以转化为
base64格式- 好处就是浏览器不用发请求了，直接可以读取
- 坏处就是如果图片太大，再转
base64就会让图片的体积增大 30% 左右
- vue中涉及到本地图片加载时
- 可以用
require的方式引入图片，当使用到它的时候才会按需加载，而不会像import引入那样在页面创建时就会加载，加快页面初次加载效率
- vue中按键修饰符的使用也会优化代码
- vue中按键修饰符只会处理当前按键的函数处理数据逻辑，避免了通过查询阿斯克码操作按键函数后操作其他函数
2.说一下computed 和 watch 的区别
- computed计算属性该属性的结果会被缓存，当
computed中的函数所依赖的属性没有发生改变的时候，那么调用当前函数的时候结果会从缓存中读取。除非依赖的响应式属性变化时才会重新计算，主要当做属性来使用computed中的函数必须用return返回最终的结果，computed更高效，优先使用，- watch属性监听是一个对象，键是需要观察的属性，值是对应回调函数，主要用来监听某些特定数据的变化，从而进行某些具体的业务逻辑操作，监听属性的变化，需要在数据变化时执行异步或开销较大的操作使用。
使用场景：
computed当一个属性受多个属性影响的时候使用，例：购物车结算功能；watch当一条数据影响多条数据的时候使用，例：搜索数据。
3.如何理解Vue中的diff算法？
在js中，渲染真是
DOM的开销是非常大的，比如我们修改了某个数据，如果直接渲染到真实DOM,会引起整个DOM树重绘和重排。那么有没有可能实现只更新我们修改的那一小块DOM二不要更新整个DOM呢?此时我们就需要先根据真实DOM生成虚拟DOM，当虚拟DOM某个节点的数据改变后会生成有一个新的VNode，然后新的VNode和旧的VNode作比较，发现有不一样的地方就直接修改在真实DOM上，然后旧的VNode的值为新的VNode；diff的过程就是调用
patch函数，比较新旧节点，一边比较一边给真实的DOM打补丁，在采用diff算法比较新旧节点的时候，比较自会在同层级进行。
4.你对虚拟DOM的理解？
虚拟DOM本质上是JavaScript对象，是对真实DOM的抽象表现。状态变更时，记录新树和旧树的差异，最后把差异更新到真正的dom中render函数
- 根据
tagName生成父标签，读取props，设置属性，如果有content，设置innerHtml或innerText；- 如果存在子元素，遍历子元素递归调用render方法，将生成的子元素依次添加到父元素中，并返回根目录；
5.nextTick实现原理
nextTick是vue提供的一个全局API，是下次DOM更新循环结束之后执行延时回调，在修改之后使用$nextTick,则可以再回调中获取更新后的DOMvue在更新DOM时是异步执行。只要侦听到数据变化，vue将开启1个队列，并缓存在同一事件循环中发送的所有数据变更。如果同一个
watcher被多次触发，只会推入到队列中1次。这种在缓冲时去除重复数据对于避免不必要的计算和DOM操作非常重要的。nextTick方法会在队列中加入一个回调函数，确保该函数在前面的DOM操作完成后才调用
6.第一次加载页面会触发哪几个钩子函数？
当页面第一次页面加载时会触发 beforeCreate, created, beforeMount, mounted* 这几个钩子函数
7.一个页面从输入URL到页面加载完成，这个过程都发生了什么？
- 浏览器去查找域名对应的IP地址
- 浏览器向web服务器发送一个http请求
- 服务器301重定向
- 浏览器跟踪重定向地址，请求另一个带www的网址
- 服务器处理请求
- 服务器返回一个http响应
- 浏览器进DOM树构建
- 浏览器发送请求获取嵌在HTML中的资源（图片，js代码，音频，视频）
- 浏览器显示页面完成
- 浏览器发送异步请求
