动态Polyfill

Polyfill

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

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

引入
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/7.2.5/polyfill.js"></script>
然后就 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>
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,790评论 1 92
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 27,626评论 1 45
  • babel官网 babel 介绍 Babel 是一个通用的多用途 JavaScript 编译器。通过 Babel ...
    锋享前端阅读 1,843评论 0 10
  • 根据《点绛唇》产生的联想 点绛唇 李清照 蹴罢秋千,起来慵整纤纤手。露浓花瘦,薄汗轻衣透。 ...
    梦忆北兮阅读 569评论 0 1
  • 晚睡对于现代人特别年轻人可能都很习惯啦,也会有很多借口让自己晚睡. 还有些人甚至觉得如果不晚睡就不是年轻人感觉.....
    蜜薛儿阅读 351评论 5 5