写点什么

Rollup 1.0 发布,支持对捆绑包进行代码拆分

  • 2019-04-12
  • 本文字数:1096 字

    阅读完需:约 4 分钟

Rollup 1.0发布,支持对捆绑包进行代码拆分

Rollup最近发布了它的第一个主要迭代版本。开发者可以使用 Rollup 1.0 对他们的库进行代码拆分,并暴露多个导入目标。


Rollup 1.0 发布公告给出了一个假想的库的例子,它有四个入口点,对应于每个导出的库函数:



Rollup 1.0 将 8 个模块减少到 5 个块,每个入口模块对应一个块,还有一个被其他几个块导入的块。每个块本身就是标准的 ES 模块,它们使用浏览器的内置模块加载器进行加载,没有任何额外的运行时开销,同时还可以利用 Rollup 的摇树优化功能。


对应的 Rollup 配置由一个 rollup.config.js 文件组成,文件内容如下:


export default     {        input: {            index: 'src/main.js',            upper: 'src/upper.js',            lower: 'src/lower.js',            upperFirst: 'src/upperFirst.js'        },        output: [            {                dir: 'esm',                format: 'esm'            },            {                dir: 'cjs',                format: 'cjs'            }        ]    }
复制代码


入口点通过 input 属性来指定,输出目录通过 output 属性来指定。然后在 package.json 文件中引用目录:


{  "name": "fancy-case",  "version": "1.0.0",  "main": "cjs/index.js",  "module": "esm/index.js",  "scripts": {    "prepare": "rollup --config"  },  "files": [    "cjs/*",    "esm/*"  ],  "devDependencies": {    "rollup": "^1.0.0"  }}
复制代码


代码拆分可以将代码基库拆分成更小的块,这些块可以按需加载。将这项技术应用于整个 Web 应用程序上时,用户可以更快地获得可交互的页面,而不必等待完整的包被执行。将这项技术应用于库上时,用户可以从单独的文件导入库的独立部分。例如,使用 import merge from ‘lodash-es/merge’来导入 merge 函数。用户还可以使用以下命令从 lodash 中导入任意数量的函数:


import { partition, memoize } from ‘lodash-es’;
复制代码


Rollup 的主要贡献者 Lukas Taegert 指出,“当然,你也可以使用 Rollup 来捆绑 Web 应用程序(通过动态导入进行代码拆分)”。Rollup的文档中提供了一个额外的示例。


Rollup 在 2016 年率先使用摇树来优化应用程序包。Rollup 的目标是为 JavaScript 库生成“看起来是由人类编写的最高效的包”。代码拆分是在 Rollup 0.55 中引入的。后来,经过了一些 bug 修复和改进,被包含在 Rollup 1.0 中。


Webpack 始于 2012 年,目标是构建复杂的单页应用程序(SPA)。为此,Webpack 引入了代码拆分和静态资产捆绑功能。Webpack 在它的第二个主要迭代版本中引入了基本的摇树优化功能。


查看英文原文https://www.infoq.com/news/2019/03/rollup-code-splitting


2019-04-12 09:265159
用户头像

发布了 731 篇内容, 共 484.5 次阅读, 收获喜欢 2008 次。

关注

评论 1 条评论

发布
用户头像
Rollup可以替代webpack在生产环境中吗?
2019-04-12 15:43
回复
没有更多了
发现更多内容

软件测试/测试开发丨学习笔记之Web自动化测试

测试人

程序员 软件测试 自动化测试 测试开发

狂刷三遍398道java最新MySQL笔记后,我四面阿里研发部,成功定级P7

Java MySQL 数据库

从7天到1天,Kyligence 和亚马逊云科技助力欣和提高数据应用价值

Kyligence

数字化转型 指标平台

国内好用的堡垒机推荐-行云管家堡垒机

行云管家

网络安全 堡垒机

太赞了,京东研发一哥力荐的高可用网站构建技术

Java 架构 京东

精准快速搜索文件:Find Any File 激活版

真大的脸盆

Mac 办公效率 文件搜索 搜索工具 搜索文件

kafka集群是如何选择leader,你知道吗?

JAVA旭阳

kafka

Spring Boot实现第一次启动时自动初始化数据库

Java spring Spring Boot

莉莉丝游戏与火山引擎ByteHouse达成合作,为实时数仓建设提速

字节跳动数据平台

数据仓库 云原生 实时

双非渣硕,开发两年,苦刷算法47天,四面字节斩获offer

Java 数据结构 算法 LeetCode

Kafka集群是如何选择leader,你知道吗?

Java kafka 集群

Git入门指南:从新手到高手的完全指南

小万哥

git Linux 程序员 后端 C/C++

辅助测试和研发人员的一款小插件【数据安全】 | 京东云技术团队

京东科技开发者

浏览器 数据安全 插件开发 企业号 5 月 PK 榜

医疗领域实体抽取:UIE Slim最新升级版含数据标注、serving部署、模型蒸馏等教学,助力工业应用场景快速落地

汀丶人工智能

人工智能 自然语言处理 知识图谱 关系抽取 命名实体识别

电商行业实践专栏上线|阿里巴巴风控实战如何解决大规模风控的技术难点?

Apache Flink

大数据 flink 实时计算

Hybrid Shuffle 测试分析和使用建议

Apache Flink

大数据 flink 实时计算

阿里P8大佬的1800页计算机基础知识总结与操作系统,太强了!

Java 程序员 操作系统

阿里大神级Elasticsearch学习笔记,还学不会就埋了

Java elasticsearch 分布式搜索引擎 ES

小程序容器与PWA的完美结合:提升应用性能与用户体验

FinFish

私有小程序技术 小程序容器 PWA 小程序化 小程序技术

全国流体力学盛会召开,飞桨AI4S携最新科研进展亮相西湖大学

飞桨PaddlePaddle

人工智能 百度飞桨 科学计算

如何避免写重复代码:善用抽象和组合

阿里技术

Java 代码实战

Mysql DDL执行方式-pt-osc介绍 | 京东云技术团队

京东科技开发者

MySQL 数据库 企业号 5 月 PK 榜 DDL执行方式 pt-soc

ByConity与主流开源OLAP引擎(Clickhouse、Doris、Presto)性能对比分析

墨天轮

数据库 字节跳动 OLAP Clickhouse Doris

房地产行业IT运维安全就用行云管家堡垒机!

行云管家

运维 房地产 IT运维

内核调试环境搭建

郑州埃文科技

网络安全 网络环境

火山引擎DataLeap的Catalog系统搜索实践(一):背景与功能需求

字节跳动数据平台

大语言模型技术原理

NineData

AIGC ChatGPT AI大语言模型 大语言模型 技术原理

Flutter三棵树系列之BuildOwner | 京东云技术团队

京东科技开发者

flutter 移动开发 源码解读 企业号 5 月 PK 榜 BuildOwner

Rollup 1.0发布,支持对捆绑包进行代码拆分_编程语言_Bruno Couriol_InfoQ精选文章