glup与webpack

383 阅读2分钟

记录一下比较认可的glup与webpack对比结论:

GlupWebpack
定位基于流的自动化构建工具一个万能模块打包器
目标自动化和优化开发工作流,为通用website开发而生通用模块打包加载器,为移动端大型SPA应用而生
学习难度易于学习和使用,API总共10个方法大量新的概念和API但文档详尽
适用场景基于流的作业方式适合多页面应用开发一切皆模块的特点适合单页应用SPA开发
作业方式对输入(gulp.src)的 js,ts,scss,less 等源文件依次执行打包(bundle)、编译(compile)、压缩、重命名等处理后输出(gulp.dest)到指定目录中去,为了构建而打包对入口文件(entry)递归解析生成依赖关系图,然后将所有依赖打包在一起,在打包之前会将所有依赖转译成可打包的 js 模块,为了打包而构建
使用方式常规 js 开发,编写一系列构建任务(task)json配置项
优点适合多页面开发,易上手,接口优雅可以打包一切资源,适配各种模块系统
缺点在单页面应用方面输出乏力,而且对流行的单页技术有些难以处理(比如 Vue 单文件组件,使用 gulp 处理就会很困难,而 webpack 一个 loader 就能轻松搞定)不适合多页应用开发,灵活度高但同时配置很繁琐复杂。“打包一切” 这个优点对于 HTTP/1.1 尤其重要,因为所有资源打包在一起能明显减少浏览器访问页面时的资源请求数量,从而减少应用程序必须等待的时间。但这个优点可能会随着 HTTP/2 的流行而变得不那么突出,因为 HTTP/2 的多路复用可以有效解决客户端并行请求时的瓶颈问题
结论多页应用(MPA)首选方案单页应用(SPA)首选方案
最新版本glup4.0Webpack 5(2020-10-10),重大变更有:清理弃用功能,不再为Node.js模块自动引用Polyfills;长期缓存;开发支持;支持新的一些Web平台特性;开发体验以及构建优化等

Glup官方文档(www.gulpjs.com.cn/docs/gettin…)
Webpack官方文档(www.webpackjs.com/)

原文写的很详细,有兴趣的请移步(www.cnblogs.com/iovec/p/792…)