gzip引入后node_modules中.cache compression-webpack-plugin占用内存过多

1.Gzip

Gzip(GNU zip)是一种常见的文件压缩格式和压缩算法,通常用于在 Web 服务器上对静态资源文件进行压缩,以减小文件大小并加快文件传输速度。在前端开发中,经常会使用 Gzip 压缩来优化网站的性能。

Gzip 压缩通过移除文件中的重复数据和不必要的信息来减小文件大小,从而减少网络传输时间。当浏览器请求支持 Gzip 压缩的资源时,服务器会将这些资源进行压缩,并在响应中添加相应的头部信息表明该资源已经被压缩。浏览器在接收到响应后会解压缩这些资源,并正常加载页面。

在前端开发中,常见的静态资源如 JavaScript、CSS 和字体文件都可以通过 Gzip 压缩来减小文件大小。大多数现代的 Web 服务器都支持 Gzip 压缩,并提供了相应的配置选项来启用该功能。

如果你想在自己的项目中使用 Gzip 压缩,你需要确保你的 Web 服务器已经配置了 Gzip 压缩,并且你的静态资源文件类型被包括在了压缩范围内。一般来说,在使用类似于 Nginx 或 Apache 的 Web 服务器时,你可以通过配置文件来启用 Gzip 压缩。

总之,Gzip 压缩是一种常见且有效的前端性能优化手段,可以显著减小静态资源文件的大小,提高网页加载速度。

2.compression-webpack-plugin

用于在构建过程中对静态资源文件进行压缩的 Webpack 插件。它可以帮助你在构建过程中生成经过压缩的静态资源文件,比如 JavaScript 和 CSS 文件,以减小文件大小并提高加载速度。

该插件基于 Node.js 中的 zlib 模块,可以使用多种压缩算法(如 Gzip、Brotli 等)对文件进行压缩。通过使用 compression-webpack-plugin,你可以轻松地在 Webpack 构建过程中自动地对输出的静态资源文件进行压缩处理。

const CompressionPlugin = require('compression-webpack-plugin');module.exports = {// ...其他配置plugins: [new CompressionPlugin({algorithm: 'gzip',test: /\.(js|css)$/,threshold: 10240,minRatio: 0.8})]
};

引入了 compression-webpack-plugin,并将其作为一个插件添加到了 Webpack 的配置中。在插件的参数中,我们指定了要使用的压缩算法为 Gzip(也可以是其他算法),并且指定了要压缩的文件类型、阈值等参数。

并且此插件默认开启cache缓存。每一次running的时候cache缓存会对应增加,一个月差不多100g

3.问题解决

 3.1暂时解决

        ·直接删除对应的缓存

3.2vue.config中设置 

插件默认开启cache缓存,设置.cache:false

vueConfig.configureWebpack.plugins.push(new CompressionWebpackPlugin({// 开发模式的时候不开启,生产模式的时候开启。此插件默认开启cache缓存cache: false,filename: '[path].gz[query]',algorithm: 'gzip',test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),threshold: 10240, // 只有大小大于该值的资源会被处理 10240minRatio: 0.8, // 只有压缩率小于这个值的资源才会被处理deleteOriginalAssets: false // 删除原文件}))module.exports = vueConfig

根据需要进行.cache的配置,可以将其配置成环境变量,不同环境下进行判断是否缓存。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/229212.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

QT的信号与槽

QT的信号与槽 文章目录 QT的信号与槽前言一、QT 打印"hello QT"的dome二、信号和槽机制?二、信号与槽的用法1、QT5的方式1. 无参的信号与槽的dome2.带参的信号与槽dome 2、QT4的方式3、C11的语法 Lambda表达式1、函数对象参数2、操作符重载函数参数3、可修…

【数据结构】图论与并查集

一、并查集 1.原理 简单的讲并查集,就是查询两个个元素,是否在一个集合当中,这里的集合用树的形式进行表示。并查集的本质就是森林, 即多棵树。 我们再来简单的举个例子: 假设此时的你是大一新生,刚进入大学,肯定是…

机器学习基本概念及模型简单代码(自用)

监督学习 监督学习是机器学习的一种方法,其中我们教导模型如何做出预测或决策,通过使用包含输入和对应输出的已标注数据集进行训练。这种方法的关键特点是利用这些标注数据**(即带有正确答案的数据)**来指导模型的学习过程。 一言…

JavaScript(简写js)常用事件举例演示

目录 1.窗口事件onblur :失去焦点onfocus:获得焦点onload:窗口加载事件onresize:窗口大小缩放事件 二、表单事件oninput :当文本框内容改变时 ,立即将改变内容 输出在控制台onchange: 内容改变事件onclick:鼠标单击时触发此事件 三…

VUE——IDEA 启动前端工程VS文件启动前端工程

IDEA 启动前端 目录 前言一、打开控制台二、输入npm install三、依赖下载完之后,输入npm run dev,运行前端项目1、IDEA启动前端工程2、文件目录启动前端工程 四、点击http://localhost:8080后续敬请期待 前言 启动已有的vue前端项目 一、打开控制台 选…

网络安全-真实ip获取伪造与隐藏挖掘

目录 真实ip获取应用层网络层网络连接TOAproxy protocol ip伪造应用层网络层TOA攻击proxy protocol 隐藏代理 挖掘代理多地ping历史DNS解析记录国外主机解析域名网站RSS订阅网络空间搜索引擎 总结参考 本篇文章学习一下如何服务如何获取真实ip,隐藏自己的ip&#xf…

docker 部署教学版本

文章目录 一、docker使用场景及常用命令1)docker使用场景2)rocky8(centos8)安装 docker3)docker 常用命令补充常用命令 二、 单独部署每个镜像,部署spring 应用镜像推荐(2023-12-18)1、 安装使用 mysql1.1 …

elasticsearch系列五:集群的备份与恢复

概述 前几篇咱们讲了es的语法、存储的优化、常规运维等等,今天咱们看下如何备份数据和恢复数据。 在传统的关系型数据库中我们有多种备份方式,常见有热备、冷备、全量定时增量备份、通过开发程序备份等等,其实在es中是一样的。 官方建议采用s…

中间件系列 - Redis入门到实战(高级篇-多级缓存)

前言 学习视频: 黑马程序员Redis入门到实战教程,深度透析redis底层原理redis分布式锁企业解决方案黑马点评实战项目 中间件系列 - Redis入门到实战 本内容仅用于个人学习笔记,如有侵扰,联系删除 学习目标 JVM进程缓存Lua语法入…

微软发布安卓版Copilot,可免费使用GPT-4、DALL-E 3

12月27日,微软的Copilot助手,可在谷歌应用商店下载。目前,只有安卓版,ios还无法使用。 Copilot是一款类ChatGPT助手支持中文,可生成文本/代码/图片、分析图片、总结内容等,二者的功能几乎没太大差别。 值…

超详细的企业单位B级数据机房设计方案

一、项目概述 本项目旨在为企业单位构建一个符合B级标准的数据机房,以满足企业信息化建设的需要。项目包括机房基础设施、配电系统、空调系统、消防系统、监控系统、照明系统、网络设备等方面的设计和施工,以确保机房的安全、稳定和高效运行。 二、设计…

数据库索引、三范式、事务

索引 索引(Index)是帮助 MySQL 高效获取数据的数据结构。常见的查询算法,顺序查找,二分查找,二叉排序树查找,哈希散列法,分块查找,平衡多路搜索树 B 树(B-tree)。 常见索引原则有 选择唯一性索引:唯一性索引的值是唯…

【k8s】deamonset文件和说明

目录 deamonset的相关命令 deamonset的定义 deamonset的使用场景 deamonset的例子 deamonset字段说明 serviceAccountName DaemonSet的结构及其各个部分的作用 deamonset的相关命令 #查看<name-space>空间内有哪些deamonset kubectl get DaemonSet -n <na…

mfc100u.dll文件丢失,有五种不同解决方法

在计算机使用过程中&#xff0c;我们经常会遇到一些错误提示&#xff0c;其中之一就是“找不到mfc100u.dll文件”。那么&#xff0c;mfc100u.dll文件到底是什么&#xff1f;为什么会出现丢失的情况&#xff1f;本文将详细介绍mfc100u.dll文件的作用以及丢失的原因&#xff0c;并…

IoT 物联网常用协议

物联网协议是指在物联网环境中用于设备间通信和数据传输的协议。根据不同的作用&#xff0c;物联网协议可分为传输协议、通信协议和行业协议。 传输协议&#xff1a;一般负责子网内设备间的组网及通信。例如 Wi-Fi、Ethernet、NFC、 Zigbee、Bluetooth、GPRS、3G/4G/5G等。这些…

数据仓库-数仓优化小厂实践

一、背景 由于公司规模较小&#xff0c;大数据相关没有实现平台化&#xff0c;相关的架构都是原生的Apache组件&#xff0c;所以集群的维护和优化都需要人工的参与。根据自己的实践整理一些数仓相关的优化。 二、优化 1、简易架构图 2、ODS层优化 2.1 分段式解析 随着业务增长…

Docker 概念介绍

1、Docker 简介 Docker一个快速交付应用、运行应用的技术: 可以将程序及其依赖、运行环境一起打包为一个镜像&#xff0c;可以迁移到任意Linux操作系统运行时利用沙箱机制形成隔离容器&#xff0c;各个应用互不干扰启动、移除都可以通过一行命令完成&#xff0c;方便快捷 Doc…

Android 接入第三方数数科技平台

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 前言一、数数科技平台是什么&#xff1f;二、使用步骤1.集成SDK2. 初始化3. 发送事件和设置账号id4. 验证发送事件是否成功 小结 前言 一个成熟的App必然不可缺少对…

VSCODE : SSH远程配置+免密登录

SSH基础配置 填入地址&#xff0c;回车 ssh userhost-or-ip 然后选择默认的配置&#xff0c;回车&#xff0c;得到以下结果&#xff1a; 点击链接 选择远程的系统 输入密码 免密登录 生成SSH密钥&#xff1a; 首先&#xff0c;确保你已经在本地生成了SSH密钥。你可以使…

c语言-数据类型详细介绍

目录 前言一、数据类型介绍1.1 基本内置类型 二、类型的基本分类2.1 整型家族2.1.1 signed char表示的数值范围2.1.2 unsigned char表示的数值范围 2.2 浮点数家族2.3 构造类型2.4 指针类型2.5 空类型 总结 前言 本篇文章对c语言中数据类型进行详细介绍。 一、数据类型介绍 1…