【前端】探索webpack3项目build速度优化, 优化个p

文章目录

    • 背景
    • uglifyjs-webpack-plugin
    • webpack3 压缩混淆js 优化踩坑。
    • 结论

背景

webpack3 + babel7 + uglifyjs-webpack-plugin的项目,build起来是什么体验。 大抵是写了两个月后,发现build时间从120s激增到400s。而这400秒中,有50多秒是UglifyJsPlugin贡献的。(更耗时的其实是babel-loader,但是咱拿他没办法)

uglifyjs-webpack-plugin

这玩意儿是什么呢,其实就是对js进行压缩和混淆的插件(包含去除未使用用变量, 去除console, 去除debugger等),使用nodejs编写,常用于webpack3中。而在webpack4-5中,已经弃用了,替代品叫做terser-webpack-plugin, 可能快一丢丢。

然后,目前追求更进一步的性能提升,那就是用编译性语言替代nodejs来对js压缩混淆。

常见的有

  • go语言esbuild: 用于webpack5中的esbuild-webpack-plugin以及vite。
  • rust语言swc: 忘了,似乎用于 umi@4
  • rust语言rsbuild: 字节整的,用于平滑替换webpack5生态。好像兼容了90%的插件,目前似乎0.7.8版本。
    这几个的问题在于,最低只能编译到es2015,也就是不支持ie全系列。无法避免ie的话,还是老老实实babel-loader吧
    在这里插入图片描述

webpack3 压缩混淆js 优化踩坑。

  • webpack-parallel-uglify-plugin@1: 毫无用处,负优化。
  • happypack: 毫无用处,负优化。
  • 别的似乎没什么优化方案了。

结论

别优化了,又不是不能用。

  • 从webpack3提取pubic和src,丢到webpack5 +rsbuild打包
  • 从360s -> 20s… emm不得不说真是绝活。
    在这里插入图片描述

再看看webpack3的,真是我测。
在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

如何看待IBM中国研发部裁员?三个方向快速解析

如何看待IBM中国研发部裁员? 近日,有媒体从IBM中国方面确认,IBM将彻底关闭中国研发部门,涉及员工数量超过1000人。 3分钟裁员上千人! IBM中国宣布撤出在华两大研发中心,引发了IT行业对于跨国公司在华研发战…

ubuntu16.04下qt5.7.1添加对openssl的支持

文章目录 前言一、编译安装openssl二、编译qt5.7.1三、配置qtcreator开发环境四、demo 前言 最近工作中要求客户端和服务端通过ssl加密通信,其中客户端是qt编程,服务端是linux编程.我的开发环境是ubuntu16.04;运行环境是debian9.13,是基于gnu的linux操作系统,64位arm架构. 一…

C++_17_友元

友元 > 友元 友元 是单向的 甲和乙 甲说 他是乙朋友 乙有可能不承认 所以 是单向的 > 只要是 友元 就可以访问他私有的东西 所以 友元会破坏 封装性作用:可以访问友元 的私有成员 特点: 单项性不能被传递不能被继承 关键字&#xff1a…

OpenCV结构分析与形状描述符(13)拟合椭圆函数fitEllipseDirect()的使用

操作系统:ubuntu22.04 OpenCV版本:OpenCV4.9 IDE:Visual Studio Code 编程语言:C11 算法描述 围绕一组2D点拟合一个椭圆。 该函数计算出一个椭圆,该椭圆拟合一组2D点。它返回一个内切于该椭圆的旋转矩形。使用了由[91]提出的直接…

Ubuntu22.04之禁止内核自动更新(二百六十八)

简介: CSDN博客专家、《Android系统多媒体进阶实战》一书作者 新书发布:《Android系统多媒体进阶实战》🚀 优质专栏: Audio工程师进阶系列【原创干货持续更新中……】🚀 优质专栏: 多媒体系统工程师系列【…

第二阶段(c语言)

内存:一块临时存储区域 虚拟内存 vm 物理内存 pm 内存单元:一个内存单元的大小是1byte 内存块:连续多个内存单元 内存地址:相当于是教室的门牌号 内存中的值:相当于是教室里面所存放的东西 int num 0; …

Prometheus + Grafana + nVisual 实现运维监控全面可视化

Prometheus主要实现采集、存储、查询设备数据指标、告警等功能;Grafana通过Prometheus的API以仪表板的形展示数据,同时在线提供了大量监测数据展示模版。然而,实际运维中我们不仅需要实时监测数据,还需要了解设备的物理位置、拓扑…

Axure科技感设计案例教程:从按钮到大屏的全面探索

Axure RP,作为一款强大的原型设计工具,不仅能够帮助设计师快速构建产品界面,还能通过其丰富的交互功能实现高度逼真的科技感效果。以下是一个简要的教程,介绍如何使用Axure RP设计科技感按钮、图标、统计、图表以及大屏界面。 1.…

24年最新版ocpp2.0.1文档目录:24年最新ocpp_201-v10欧标通讯协议

推荐一套企业级开源充电桩平台:完整代码包含多租户、硬件模拟器、多运营商、多小程序,汽车 电动自行车、云快充协议;——(慧哥)慧知开源充电桩平台;https://liwenhui.blog.csdn.net/article/details/134773779?spm1001.2014.3001…

【私活儿分享】手串珠子管理小程序,便捷查询珠子(串手链的珠子)位置

前言 之间帮客户做了个查询手串珠子位置的小程序,便于帮助客户管理众多的珠子,这个珠子就是戴在手上串起来的饰品。好了,话不多说,进入正题! 正文 小程序比较简单,采用云开发。两个页面,一个查…

从阅读到编辑,全方位PDF编辑器软件功能探索

你现在收到的文件是不是大部分也都是PDF格式的?这个格式可以完整的保存任意Office软件制作文档的格式,但是编辑起来就不是那么方便了。这次我汇集了一些我和身边小伙伴常用的类似福昕高级pdf编辑器这样的编辑工具统统分享给你吧。 1.福昕PDF编辑器 链接…

OFDM系统PAPR算法的MATLAB仿真,对比SLM,PTS以及CAF,对比不同傅里叶变换长度

目录 1.算法运行效果图预览 2.算法运行软件版本 3.部分核心程序 4.算法理论概述 4.1、选择映射(SLM) 4.2 相位截断星座图(PTS) 5.算法完整程序工程 1.算法运行效果图预览 (完整程序运行后无水印) 2.算法运行软件版本 mat…

《JavaEE进阶》----14.<SpringMVC配置文件实践之【验证码项目】>

本篇博客介绍的是Google的开源项目Kaptcha来实现的验证码。 这种是最简单的验证码。 也是很常见的一种验证码。可以去看项目结果展示。就可以明白这个项目了。 前言: 随着安全性的要求越来越高、很多项目都使用了验证码。如今验证码的形式也是有许许多多、更复杂的图…

RT-Thread Nano版本在STM32F103RB上的快速移植

目录 概述 1 RT-Thread Nano 1.1 Nano版本介绍 1.2 RT-Thread Nano的特点 2 STM32Cube 创建工程 2.1 STM32Cub配置板卡参数 2.2 项目程序架构 3 移植RT-Thread 3.1 Keil IDE加载RT-Thread 3.2 解决上面两个ERROR 3.2.1 ERROR-1: 3.2.2 ERROR-2 3.3 移植FINSH 3.4…

下载Mongodb 4.2.25 版本教程

1、MongoDB 安装包的下载链接 Download MongoDB Community Server | MongoDB 进入如下截图: 2、查找历史版本 往下拉,点击“...”,找到”Archived releases”,点击进入 、 3、下载Mongodb 4.2.25 版本 找到如下图4.2.25版本下载链接,点击就可…

LSP协议:打造流动性管理的市场新标杆

随着以太坊从 PoW(工作量证明)向 PoS(权益证明)的转型,PoS已然成为主流区块链共识机制的重要组成部分。再加上跨链技术的发展,包含比特币在内的不同生态之间进行资产质押与交换也催生出市场对于流动性管理的…

基于RP2350 MCU的树莓派Pico 2开发板及MicroPython编程使用

2021年1月21日,树莓派基金会同时发布了第1代RP2040 MCU芯片和基于RP2040 MCU的第1代树莓派Pico开发板(Raspberry Pi Pico/ Raspberry Pi Pico 1)。2024年8月8日,树莓派基金会又发布了第2代RP2350 MCU芯片并推出了基于RP2350 MCU的第2代树莓派Pico开发板(Raspberry Pi Pico 2)…

英文外链代发服务靠谱吗?

英文外链代发服务的可靠性因供应商和服务类型而异。外链代发服务的主要目标是提高网站在搜索引擎中的排名,通过增加指向目标网站的链接数量和质量来实现。然而,并不是所有的外链代发服务都是可靠的,很多外链都是只管发,但是发了有…

驾校预约学习系统的设计与实现

摘 要 伴随着信息技术与互联网技术的不断发展,人们进到了一个新的信息化时代,传统管理技术性没法高效率、容易地管理信息内容。为了实现时代的发展必须,提升管理高效率,各种各样管理管理体系应时而生,各个领域陆续进到…

【学习笔记】 陈强-机器学习-Python-Ch15 人工神经网络(1)sklearn

系列文章目录 监督学习:参数方法 【学习笔记】 陈强-机器学习-Python-Ch4 线性回归 【学习笔记】 陈强-机器学习-Python-Ch5 逻辑回归 【课后题练习】 陈强-机器学习-Python-Ch5 逻辑回归(SAheart.csv) 【学习笔记】 陈强-机器学习-Python-…