动态Polyfill


Polyfill

我们希望浏览器提供一些特性,但是没有,然后我们自己写一段代码来实现他,那这段代码就是补丁。

一般处理方式:babel-polyfill.js

引入 然后就 es6、es7 特性随便写了,但缺点是,babel-polyfill 包含所有补丁,不管浏览器是否支持,也不管你的项目是否有用到,都全量引了

动态补丁polyfill.io

在需要补丁的浏览器会加载补丁代码,不需要补丁的浏览器不会加载代码,比如:

<script src="https://polyfill.io/v3/polyfill.min.js?features=Promise%2CArray.prototype.includes"></script>

然后在 Chrome@71 下的输出是:

/* Disable minification (remove `.min` from URL path) for more info */

啥都没有,因为 Promsie 特性 Chrome@71 已经支持了。

阿里也搭了个服务,可以考虑引用阿里的

<script src="https://polyfill.alicdn.com/polyfill.min.js?features=Promise%2CArray.prototype.includes"></script>

原文