当前位置: 首页 > news >正文

webpack与vite对比

1. 底层的语言

webpack是基于nodejs构建,js是以毫秒计数。
vite是基于esbulid预构建依赖,esbulid是采用go语言编写的,go语言是纳秒级别的。

总结:因为js是毫秒级别,go语言是纳秒级别。所以vitewebpack打包器快10-100倍。

2. 打包过程

webpack:分析各个模块之间的依赖=>然后进行编译打=>打包后的代码在本地服务器渲染。随着模块增多,打包的体积变大,造成热更新速度变慢。
vite:启动服务器=>请求模块时按需动态编译显示。(vite遵循的是ES Modlues模块规范来执行代码,不需要打包编译成es5模块即可在浏览器运行。)

总结:vite启动的时候不需要分析各个模块之间的依赖关系、不需要打包编译。vite可按需动态编译缩减时间。当项目越复杂、模块越多的情况下,vite明显优于webpack

3. 热更新

webpack:模块以及模块依赖的模块需重新编译
vite:浏览器重新请求该模块即可

4使用方面

vite开箱即用,更加简单,基于浏览器esm,使得hmr更加优秀,达到极速的效果;webpack更加灵活,api以及插件生态更加丰富。

5. 原理不同

webpack是bundle,自己实现了一套模块导入导出机制。vite是利用浏览器的esm能力,是bundless。

相关文章:

  • Linux中的权限机制
  • 字符串函数【C语言-3】
  • 【Docker】Docker-Compose基础使用说明
  • 用python抠图
  • Java Object类下getClass()方法具有什么功能呢?
  • MongoDB安装使用教程
  • 封装js一些常用的方法(默认值、数组、判空、数值等等)
  • OpenCV之图片预处理方法
  • 跟我学Python图像处理丨傅里叶变换之高通滤波和低通滤波
  • 分布式监控系统——Zabbix(2)部署
  • 机械学习房价预测实战(mse 回归 交叉验证)
  • 未来5年,这个职业最有可能被BI软件替代,网友:现在跑还来得及
  • 【热力学】基于Matlab模拟生成热晕
  • 『Halcon与C#混合编程』第二章02_迈德威视工业相机SDK图像变量转换
  • NASA成功撞击1100公里外小行星!人类史上首次,主动避免恐龙覆辙,马斯克亦有贡献...
  • “大数据应用场景”之隔壁老王(连载四)
  • 4. 路由到控制器 - Laravel从零开始教程
  • happypack两次报错的问题
  • iOS 颜色设置看我就够了
  • Java到底能干嘛?
  • k8s如何管理Pod
  • Koa2 之文件上传下载
  • Laravel 实践之路: 数据库迁移与数据填充
  • Octave 入门
  • python 学习笔记 - Queue Pipes,进程间通讯
  • Spring Boot快速入门(一):Hello Spring Boot
  • 前端面试之CSS3新特性
  • 三栏布局总结
  • 我是如何设计 Upload 上传组件的
  • 正则学习笔记
  • 智能合约开发环境搭建及Hello World合约
  • # 学号 2017-2018-20172309 《程序设计与数据结构》实验三报告
  • ###C语言程序设计-----C语言学习(3)#
  • #define
  • #define MODIFY_REG(REG, CLEARMASK, SETMASK)
  • (01)ORB-SLAM2源码无死角解析-(56) 闭环线程→计算Sim3:理论推导(1)求解s,t
  • (16)UiBot:智能化软件机器人(以头歌抓取课程数据为例)
  • (8)Linux使用C语言读取proc/stat等cpu使用数据
  • (Bean工厂的后处理器入门)学习Spring的第七天
  • (cos^2 X)的定积分,求积分 ∫sin^2(x) dx
  • (env: Windows,mp,1.06.2308310; lib: 3.2.4) uniapp微信小程序
  • (附源码)springboot家庭财务分析系统 毕业设计641323
  • (六) ES6 新特性 —— 迭代器(iterator)
  • (论文阅读31/100)Stacked hourglass networks for human pose estimation
  • (原創) 如何刪除Windows Live Writer留在本機的文章? (Web) (Windows Live Writer)
  • (转)nsfocus-绿盟科技笔试题目
  • ****** 二 ******、软设笔记【数据结构】-KMP算法、树、二叉树
  • .net core Swagger 过滤部分Api
  • .Net MVC4 上传大文件,并保存表单
  • .sdf和.msp文件读取
  • ??myeclipse+tomcat
  • @TableId注解详细介绍 mybaits 实体类主键注解
  • [8-23]知识梳理:文件系统、Bash基础特性、目录管理、文件管理、文本查看编辑处理...
  • [BZOJ1053][HAOI2007]反素数ant
  • [bzoj1912]异象石(set)