大文件上传方案
大文件上传核心问题是网络超时和传输不稳定的问题。可以先将大文件分割为5M大小左右的小块,通过并发请求上传,避免单次请求过大,同时为了保障传输的稳定,需要引入断点续传机制,通过文件的MD5作为文件的唯一标识,上传前先拿到服务端已上传成功的文件列表,只上传缺失的部分。同时,需要在上传前校验MD5,如果已经存在了,直接秒传成功。
vite和webpack的区别
Vite 和 Webpack 最核心的区别:
- 启动和热更新速度不一样
- Webpack 是全量打包,启动时要把所有依赖打包成 bundle,项目越大越慢。
- Vite 在开发环境利用浏览器原生 ES Modules,不打包、按需编译,所以启动非常快,热更新也几乎无感。
- 底层构建工具不一样
- Webpack 自己一套完整打包流程。
- Vite 开发时不打包,生产用 Rollup 打包。
- 定位不同
- Webpack 生态成熟、配置复杂、适合大型复杂项目。
- Vite 开箱即用、配置简单、现代框架(Vue/React)首选。
Vite 快在开发体验,Webpack 强在生态和兼容性。
性能优化
- 加载上做图片懒加载、组件和路由懒加载、用 CDN 和缓存;
- 渲染上减少回流重绘,动画用 transform;
- 运行时对高频事件防抖节流,长列表用虚拟列表;
- 构建上用webpack/vite优化构建速度和体积
原型和原型链
每个函数都有prototype属性,这个prototype就是原型对象,每个对象都有__proto__属性,它指向的是创建它的构造函数的原型对象,而这个原型对象的__proto__属性指向的是它自己的原型对象,当查找对象中的某个属性或者方法时,如果查找不到就沿着__proto__向上查找,直到找到或者为null为止
vue组件通信方式
- 父子组件通信: emit vuex listeners children v-model.sync 插槽
- 隔代通信:vuex provide inject listeners
- 兄弟通信:vuex
vue3和vue2的区别
- vue2都是选项式API,vue3都是组合式API,逻辑更加聚合
- vue2只支持单根节点,vue3可以是多个根节点
- vue3的setup替代了vue2的beforeCreated和created生命周期,其余周期需要在前面加on
- vue2相比vue3引入了静态提升和patchFlag,渲染速度更快
- vue2通过defineProperty实现的, 像对象增加属性、通过下标修改数组长度都是无法监听到的,而vue3通过proxy监听整个对象,弥补了这些缺陷