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

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

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

相关推荐
心中有国也有家7 小时前
AtomGit Flutter 鸿蒙客户端:零外部资源的应用打包策略
android·javascript·flutter·华为·harmonyos
恋猫de小郭7 小时前
Fluter 共享内存多线程正在落地,IsolateGroupBound 来了
android·前端·flutter
十铭忘7 小时前
Vue3实现Pixso中的钢笔工具3——梳理函数调用
前端·vue.js
逝水无殇7 小时前
HTML 元素详解
开发语言·前端·html
糖墨夕7 小时前
AI Agent技术栈选择:Vue3 + NestJS + TypeScript 为什么是绝佳组合
前端·nestjs
Java面试题总结8 小时前
区间树:反向映射的前置数据结构
java·前端·数据结构
KaMeidebaby8 小时前
卡梅德生物技术快报|兔单克隆抗体:噬菌体 Fab 免疫文库搭建实操:兔单克隆抗体重组构建完整参数
前端·网络·数据库·人工智能·算法
胡萝卜术16 小时前
从API调用到手写LRU:力扣146「LRU缓存」的哈希表+双向链表终极进化之路
前端·javascript·面试
科技道人16 小时前
记录 默认置灰/禁用 app ‘Search Engine Selector‘ 的disable按钮
开发语言·前端·javascript
天疆说16 小时前
Zotero Connector 在 Edge 里找不到桌面 Zotero(Linux / Zotero 9.0.6 / Edge 150)
linux·前端·edge