前言
大家好、我是JOJO，梦想是睡到自然醒！
由于太久没有面试过了！害怕自己跟不上时代的发展，特意找来了大佬的面试经历，也来模拟回答一下！
这里呢，也跟大家分享一下！一起学习，一起进步。答的不对的地方，希望大家能指出！谢谢大家
下面呢，就是面试题，和我的回答！
说说HTTP缓存
HTTP缓存，一般来说，当发送一个http请求时，会在请求报文和响应报文中携带一些缓存控制的信息，
比如expires,cache-control,last-modified/if-modified-since,if-none-match/etag
缓存一般分为强缓存，协商缓存俩种。
-
强缓存
- 一般在浏览器端处理
- 无论资源是否变化，在缓存到期前、都只从缓存中读取资源
-
协商缓存
- 一般由浏览器去服务端请求判断缓存是否可以使用
- 由服务端判断资源是否变化，如果没有变化，则继续使用缓存，比如：304
- 如果资源已经变化，则发送新的资源，并且带上缓存信息。last-modified，etag
Vue和React的区别
数据响应式机制不同：
- react 通过setState函数，来触发数据变化，
- vue 通过Proxy来实现数据响应式
组件通信不同：
- react 一般基于props,回调函数，context api 实现组件通信
- vue 基于props，emit,provide/inject
渲染方式不同:
- react 基于jsx来渲染试图
- vue 基于html模板
其他的欢迎大家补充。
Vue3 和React Hook有什么区别
Vue3 中和React Hook相似的地方在于Composition Api.
俩者的理想差不多，都是为了低侵入式的复用逻辑，灵活的控制组件逻辑。摆脱了烦人的this指向问题。
当然了、也是有着很大的区别。
-
vue3
- Composition Api 还是在完整的组件声明周期中使用：如：setup生命周期内使用
- 自由的使用Composition Api
-
React Hook
- 函数组件使用，组件没有生命周期，通过hooks来实现组件的状态保存问题
- hook有着严格的限制，比如：无法在循环，判断中使用，只能在函数顶层使用
HTTP2的新特性？HTTP2快在哪里？哪个阶段快了？
特性：
- 二进制帧流
- 多路复用
- header压缩
Last-Modified和ETag是怎么配合使用的？
- Last-Modified 标记此文件在服务期端最后被修改的时间
- ETag 数据验证签名，类似于文件的hash值
这个俩个一般一起配合使用、更加合理正确。有的时候虽然文件被修改了、但是内容可能不变！比如：前一分钟修改了一次文件内容，后一分钟又改回去了！
Vue的响应式原理？（Vue2、Vue3）
-
Vue2
- 通过Object.defineProperty实现
- Object.defineProperty 只能监听某个对象的属性变化，所以vue中的data作为数据的父节点、不允许动态改变他
-
Vue3
- 通过proxy实现
- proxy操作的是对象，而非对象属性，所以针对array，object的变化也很容易监听到
使用微前端的场景是什么？
微前端的基本原理是什么？
大文件上传，可以做哪些优化？
大文件上传的缺点在于耗时，上传失败后需要从新上传，浪费资源。
一般呢、会做分片上传，断点续传的技术手段、来优化上传的方式
代码的规范怎么做的？
eslint
优化打包做了哪些措施？
这里说下webpack的打包优化，
分俩种场景：
-
开发环境 目标：修改代码，能立刻看到结果
- 缩小loader查找范围，include，exclude
- externals 移除一些不需要打包的的模块，直接通过浏览器引用
- dllplugin 将所有的npm包，打包一次，通过script直接引用。提升效果最明显的
- loader 配置缓存，提供二次构建的速度，比如：babel-loader cache
- 多线程打包，比如 happypack
-
生产环境 目标：降低文件体积，
- 代码压缩
- 移除source map文件
- code split
- Scope Hoisting 合并模块，
- 样式文件抽离 mini-css-extract-plugin
换肤怎么做的？国际化怎么做的？
-
换肤
- 配置多套css主题文件，直接替换
- 采用css3 全局变量
-
国际化
- 全局文本变量配置，动态加载需要的文本
- react-i18next、react-intl
技术选型的时候，会考虑哪些问题？
按优先级考虑的话，我给出以下的排序
- 业务场景匹配度
- 技术生态丰富，活跃度
- 团队匹配度
虚拟滚动的原理是什么？简单说说？
简单的来说，只显示可视范围内的数据。
监听滚动事件，根据滚动的距离动态的显示数据。
前端监控怎么做的？
如何计算首屏时间的？
首屏时间 = 首屏内容渲染结束时间点 - 开始请求的时间点
\
