智能捆绑：如何仅向旧版浏览器提供旧版代码

Desknumber

虽然近年来网络上资源的有效捆绑受到了广泛关注，但我们向用户提供前端资源的方式几乎保持不变。网站附带的 JavaScript 和样式资源的平均权重正在上升——尽管用于优化网站的构建工具从未如此出色。随着常青浏览器的市场份额快速上升，浏览器同步推出对新功能的支持，我们是时候重新考虑现代网络的资产交付了吗？

如今，网站的大部分流量来自长青浏览器，其中大多数浏览器对 ES6+、新的 JavaScript 标准、新的 Web 平台 API 和 CSS 属性都有良好的支持。然而，在不久的将来，旧版浏览器仍然需要得到支持——它们的使用份额足够大，不容忽视，具体取决于您的用户群。

快速浏览一下的使用表就会发现，长青浏览器 电子邮件营销列表 占据了浏览器市场的最大份额——超过 75%。尽管如此，规范是给 CSS 加上前缀，将所有 JavaScript 转译为 ES5，并包含 polyfill 来支持我们关心的每个用户。

虽然从历史背景来看这是可以理解的——网络一直都是关于渐进增强的——但问题仍然存在：我们是否会放慢大多数用户的网络速度，以支持越来越少的旧版浏览器？



平均而言，未转译的包比已转译为 ES5 的包小约 25%。这并不奇怪，因为 ES6+ 提供了一种更紧凑、更具表现力的方式来表示等效逻辑，并且将其中一些功能转换为 ES5 可能需要大量代码。

ES6+ POLYFILL  
虽然 Babel 在将语法转换应用于 ES6+ 代码方面做得很好，但 ES6+ 中引入的内置功能（例如Promise、MapandSet以及新的数组和字符串方法）仍然需要进行多填充。按原样放入babel-polyfill可能会给您的缩小包增加近 90 KB。