vue应用移动端访问缓慢问题

由于移动端的javascript处理引擎相对于pc端在处理复杂计算或大量数据时,可能会出现性能瓶颈,从而导致访问页面缓慢严重还会出现白屏情况,所以针对此问题做以下处理提升性能。

1、打包时压缩js文件

  • 安装TerserPlugin插件
bash 复制代码
npm install terser-webpack-plugin --save-dev
  • 在 Webpack 的配置文件vue.config.js中设置 optimization
bash 复制代码
module.exports = {
    mode: 'production', // 设置为生产模式
        optimization: {
            minimize: true, // 启用压缩
            minimizer: [
                new TerserPlugin({
                    terserOptions: {
                        compress: {
                            drop_console: true, // 去掉 console.log
                        },
                    },
                }),
            ],
        },
};

2、看前后区别

  • 配置前文件大小
  • 配置后文件大小

效果非常明显,访问速度也提升了

相关推荐
沉尘5887 小时前
ACE-GCM加解密微信小程序
前端
半个烧饼不加肉7 小时前
JS 底层探究-- 普通函数和构造函数
开发语言·javascript·原型模式
春风得意之时7 小时前
前端安装项目出现代理问题和ssl认证问题
前端·网络协议·ssl
问心无愧05137 小时前
ctf show web入门109
android·前端·笔记
meilindehuzi_a7 小时前
透视 V8 底部:从物理内存到函数式哲学,重新解构 JavaScript 数组
开发语言·javascript·ecmascript
粉末的沉淀7 小时前
vue:Vite项目中高效管理纯色SVG图标的方案
前端·javascript·vue.js
FlyWIHTSKY7 小时前
JavaScript 和 TypeScript 分别是什么,可以相互写吗
javascript·ubuntu·typescript
卤蛋fg67 小时前
vxe-table 列宽与行高拖拽调整:让表格布局极其灵活,拖拽功能非常强大
vue.js
YHHLAI7 小时前
JavaScript 数据结构精讲:数组底层与实战避坑
开发语言·javascript·数据结构
moMo8 小时前
Promise 的本质:不是异步处理,而是流程控制
javascript