使用GZip对npm run build打包的vendor.js文件进行压缩

vue-cli项目

  1. 安装npm i compression-webpack-plugin -D

    npm i compression-webpack-plugin -D

  2. 使用:在vue.config.js文件中

    const CompressionPlugin = require('compression-webpack-plugin')
    module.exports = {
    configureWebpack: {
    plugins: [
    new CompressionPlugin({
    test: /.js|\.html|.css/,
    threshold: 10240 // 只处理比这个值大的资源。按字节计算 设置的是 10kb
    })
    ]
    }
    }

可以看到1.2M的vendors文件压缩到了295k,网页运行速度得到了提升,3

s内可以打开。

如果样式不识别,那么就不压缩css文件了。这个功能需要后端开启gzip,可以识别这类文件。

相关推荐
aini_lovee4 分钟前
C# 实现邮件发送源码(支持附件)
开发语言·javascript·c#
GISer_Jing14 分钟前
ReAct规划原理实战指南
前端·react.js·ai·aigc
SoaringHeart16 分钟前
Flutter组件封装:翻转组件 NFlipCard
前端·flutter
LlNingyu37 分钟前
文艺复兴,什么是XSS,常见形式(一)
前端·安全·web安全·xss
英俊潇洒美少年42 分钟前
js 进程与线程的讲解
javascript
dleei2 小时前
彻底淘汰老旧 SVG 插件:unplugin-icons 与 Tailwind CSS v4 自定义图标最佳实践
前端·程序员·前端框架
LlNingyu2 小时前
文艺复兴,什么是XSS,常见形式(二)
前端·安全·xss
汉堡大王95272 小时前
# AI 终于能"干活"了——Function Calling 完全指南
javascript·人工智能·机器学习
明君879972 小时前
说说我为什么放弃使用 GetX,转而使用 flutter_bloc + GetIt
前端·flutter
Jingyou2 小时前
用 Astro 搭建个人博客:从零到上线的完整实践
前端