单页面首屏优化，打包后大小减少64M，加载速度快了13.6秒 1. 静态文件缓存(js,css等)，图片和SVG进行压缩或者替换。 2. 删掉无用路由、引用的库（实际未使用），然后启用树摇 3. ..

性能分析一直是前端er们津津乐道的话题；而俗话说得好：工欲善其事，必先利其器； 说到前端性能，就少不了性能分析的利器 —— Performance 😎；我想各位前端小伙伴，在使用 Chrome 浏览器

最近发现项目首次加载特别慢，原来是打包出来的文件太大的原因。 项目技术栈：vue3 + vite + ts + ant design vue 既然这样，那就开始打包优化吧。打包分析，结果如下： 第一步

在当前SPA(单页)应用流行的大背景下，由于单页应用的特殊性(只有一个index.html页面)，浏览器对index.html缓存会导致前端版本部署更新，用户无法及时得到更新通知，功能无法实时生效。

背景简介 我们日常开发中，经常会遇到点击一个按钮或者进行搜索时，请求接口的需求。 如果我们不做优化，连续点击按钮或者进行搜索，接口会重复请求。 那么，我们该如何规避这种问题呢？ 如何避免接口重复请求

发布以后，线上报错了，咋办？有没有很恐慌？ 每次上线都战战兢兢得生怕出错，又得搞到凌晨一两点，烦死了？这是不是你的现状？作为一名资深程序员，我深知大家得不容易，所以今天奉上一本解决现场问题得法宝。具体

项目技术栈：vue3 + ant design vue + ts + vite 版本号如何加？我的做法是在打包的时候，用当前打包时间作为版本的唯一标识。 首先封装一个vite的plugin，功能是在打

使用nodejs脚本生成版本信息json文件 + 监听页面显示和隐藏会触发的visibilitychange（页面显示和隐藏）事件（可以随意使用各种监听方式） 实现原理： 1、使用nodejs编写脚本

前端性能优化前可以先做性能报告，这样可以指定更有效的优化计划。多做性能报告可以培养性能数据的嗅觉，做下一次优化会更有把握。