性能优化-传输性能🚂 gzip 压缩

gzip 是一种压缩文件的算法

BS 结构中的压缩传输

1. 优点：传输效率可能得到大幅提升

2. 缺点：服务器的压缩需要时间，客户端的解压需要时间

使用 webpack 进行预压缩

使用 compression-webpack-plugin 插件对打包结果进行预压缩，可以移除服务器的压缩时间

const { CleanWebpackPlugin } = require("clean-webpack-plugin");
const CmpressionWebpackPlugin = require("compression-webpack-plugin");

module.exports = {
  mode: "production",
  optimization: {
    splitChunks: {
      chunks: "all"
    }
  },
  plugins: [
    new CleanWebpackPlugin(),
    new CmpressionWebpackPlugin({
      test: /\.js/,
      minRatio: 0.5
    })
  ]
};

打赏作者

您的打赏是我前进的动力

微信

支付宝

vue3🛫 案例：todolist

上一篇

性能优化🚀 项目代码规范化

下一篇

评论

中午好👏🏻，我是 ✍🏻   疯狂 codding 中...

粽子

这有关于产品、设计、开发的问题和看法，还有技术文档和你分享。

相信你可以在这里找到对你有用的知识和教程

了解更多

目录

1. 1. BS 结构中的压缩传输
2. 2. 使用 webpack 进行预压缩