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、看前后区别

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

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

相关推荐
এ慕ོ冬℘゜6 小时前
如何在 HTML 中嵌入音频和视频?
前端·html·音视频
2501_9445215913 小时前
Ramda 跨端三方库仓颉适配全流程
开发语言·javascript·flutter·php
Ken_111514 小时前
小体积附件下载正常,大附件下载异常
javascript
变与不变80615 小时前
jQuery怎么使用
前端·javascript
神膘护体小月半15 小时前
flex 布局的 order 属性
前端·css
paopaokaka_luck15 小时前
流浪动物救助与收养系统(DeepSeek AI对话、 ECharts多维分析、救助流程衔接、领养与回访衔接、 捐赠确认与公示、志愿者协作)
java·前端·javascript·人工智能·mysql·echarts·推荐算法
仰望.15 小时前
vue 表格组件 vxe-table 树表格懒加载支持拖拽排序的详细用法
前端·javascript·vue.js·vxe-table
前端 贾公子15 小时前
vite-plugin-uni-manifest 升级指南
前端
小码哥_常15 小时前
iPhone 用户传了张 HEIC,我的前端崩了
前端
小码哥_常16 小时前
你发的原图可能暴露你家地址——聊聊图片 EXIF 隐私
前端