性能优化

背景 double tap to zoom ​​历史原因​​：2007年苹果推出首款iPhone时，为解决小屏幕浏览桌面端网页的体验问题，引入了​​双击缩放​​功能。用户双击页面后，浏览器会智能放大当

查看前端性能指标 FCP: first contentful paint 第一次有内容的渲染 LCP: largest contentfull paint 页面最重要的内容已经渲染完成了 FP: fi

shouldComponentUpdate react默认: 父组件更新, 子组件就会更新 通过shouldComponentUpdate阻止一些不必要的更新 shouldComponentUpdat

合理使用 v-show 和 v-if 合理使用 computed v-for 时加 key，以及避免和 v-if 同时使用 自定义事件、DOM 事件及时销毁  beforeDistory 合理使用异步

虚拟列表 浏览器能否处理 js没问题 渲染到dom会非常卡顿 第三方lib Vue-virtual-scroll-list React-virtualiszed 自定义中间层 自定义中间层, 获取并拆

路由懒加载 路由拆分, 优先保证首页加载 适用于SPA, 不适用于MPA 什么是MPA 多页面应用 MPA 的优化侧重于​​减少重复资源加载​​（如公共库复用），而非路由级按需加载 服务端渲染SSR

webpack开发环境优化 热更新 加快打包速度 减少模块解析 什么叫做模块解析？ 模块解析包括：抽象语法树分析、依赖分析、模块语法替换 不做模块解析会怎样？ 如果某个模块不做解析，该模块经过load

路由懒加载 使用与单页面应用, 不适用于多页面应用 路由拆分, 优先保证首页加载 服务端渲染 ssr 传统的前后端分离（spa）渲染页面的过程复杂 ssr渲染页面过程简单，所以性能好 如果是纯 h5

文章来源 5.25秒变0.023秒：小程序图片优化全攻略 深入掌握 OSS：最完美的 OSS 上传方案！ - 掘金 (juejin.cn) 背景 最近在公司在写微信小程序，该小程序主要展示一些高清图片