垫片和polyfill有什么区别?

这两个似乎都被用在networking开发界,例如见HTML5跨浏览器Polyfills ,它说:

所以在这里我们收集所有垫片,回退和polyfill …

或者,有es5-shim项目。

在我目前的项目中,我们正在使用其中的一些,我想把它们全部放在同一个目录中。 那么,我应该怎么称呼这个目录— shims或者polyfills

如果你想保持目录的通用性,就调用它。 填充是一种填充types,通常使用Javascript或Flash来改造传统的浏览器,使用现代的HTML5 / CSS3特性。 另一方面,垫片是指执行拦截API调用并提供抽象层的任何代码。 它不一定限于Web应用程序或HTML5 / CSS3。

据我所知:

polyfill是检测某个“预期”API是否丢失并手动实现的代码。 例如

 if (!Function.prototype.bind) { Function.prototype.bind = ...; } 

填充是拦截现有API调用并实现不同行为的代码。 这里的想法是规范不同环境中的某些API。 因此,如果两个浏览器以不同的方式实现相同的API,则可以在其中一个浏览器中拦截API调用,并使其行为与其他浏览器保持一致。 或者,如果某个浏览器在其某个API中存在错误,则可以再次拦截对该API的调用,然后绕过该错误。

如果您熟悉适配器模式,那么您知道垫片是什么。 Shims拦截API调用,并在调用者和目标之间创build一个抽象层。 典型的垫片用于向后兼容。 例如, es5-shim npm软件包可以让你编写ECMAScript 5(ES5)语法,而不用关心浏览器是否运行ES5。 以Date.now为例。 这是ES5中的新function,其中ES3中的语法将是新的Date()。getTime() 。 如果使用es5-shim ,则可以编写Date.now ,如果运行的浏览器支持ES5,则它将运行。 但是,如果浏览器正在运行ES3引擎, es5-shim将拦截对Date.now的调用,而只是返回新的Date().getTime() 。 这个拦截被称为匀场。 es5-shim的相关源代码如下所示:

 if (!Date.now) { Date.now = function now() { return new Date().getTime(); }; } 

填充工具

Polyfilling实际上只是一种专门的匀场。 Polyfill是关于在API中实现缺less的function,而垫片不一定就是关于实现缺less的function,因为它是关于纠正function。 我知道这些看起来过于模糊,但是垫片用作更广泛的术语,polyfill用于描述为旧版浏览器提供向后兼容性的垫片。 因此,虽然垫片用于掩盖旧的罪恶,但是填充物被用于未来的改进。 作为一个例子,IE7中不支持sessionStorage,但sessionstorage npm包中的polyfill将通过使用诸如在窗口的name属性中存储数据的技术或通过使用cookie在IE7(及更早版本)中添加此function。

从他的书中引用Axel Rauschmayer Speaking JavaScript

  • 垫片是一个图书馆,带来一个新的API到一个旧的环境,只使用该环境的手段。
  • 一个polyfill是一个浏览器API的垫片。 它通常会检查浏览器是否支持API。 如果没有,polyfill会自行安装。 这允许您在任何情况下使用API​​。 “填充”一词来源于家庭装修产品; 根据雷米夏普 :

Polyfilla是英国产品,在美国被称为Spackling Paste。 考虑到这一点:将浏览器视为具有裂缝的墙。 这些[polyfills]有助于平滑裂缝,并为我们提供一个非常平滑的浏览器墙。

沉。 垫片是一个图书馆,带来一个新的API到一个旧的环境,只使用该环境的手段。

填充工具。 2010年10月,雷米·夏普(Remy Sharp)在博客上写道:“通过Rick Waldron的”polyfill“:

polyfill是一段代码(或插件),它提供了开发人员希望浏览器本地提供的技术。 如果您愿意的话,可以将API横向展平。

几年前写了一篇很棒的文章,这很好地解释了这一点:

什么是Polyfill?

(2)在这篇文章中简单对比:

Shim:你可以添加一段代码(即JavaScript )来修复一些function,但是它通常会有自己的API

Polyfill:您可以放入的东西(即JavaScript ),它会默默地工作,以模仿现有的浏览器API ,否则不支持。