两者似乎都被用于web开发领域,例如HTML5 Cross Browser Polyfills,它说:

所以我们在这里收集所有的垫片、备用材料和填充物……

或者,还有es5-shim项目。

在我目前的项目中,我们使用了许多这些,我想把它们都放在同一个目录中。所以,我应该叫这个目录——垫片,还是填充物?


当前回答

Shim

If you are familiar with the adapter pattern, then you know what a shim is. Shims intercept API calls and create an abstract layer between the caller and the target. Typically shims are used for backward compatibility. For instance the es5-shim npm package will let you write ECMAScript 5 (ES5) syntax and not care if the browser is running ES5 or not. Take Date.now as an example. This is a new function in ES5 where the syntax in ES3 would be new Date().getTime(). If you use the es5-shim you can write Date.now and if the browser you’re running in supports ES5 it will just run. However, if the browser is running the ES3 engine es5-shim will intercept the call to Date.now and just return new Date().getTime() instead. This interception is called shimming. The relevant source code from es5-shim looks like this:

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

Polyfill

Polyfilling is really just a specialized version of shimming. Polyfill is about implementing missing features in an API, whereas a shim wouldn’t necessarily be as much about implementing missing features as it is about correcting features. I know these seems overly vague, but where shims are used as a more broader term, polyfill is used to describe shims that provide backward compatibility for older browsers. So while shims are used for covering up old sins, polyfills are used for bringing future enhancements back in time. As an example there is no support for sessionStorage in IE7, but the polyfill in the sessionstorage npm package will add this feature in IE7 (and older) by using techniques like storing data in the name property of the window or by using cookies.

其他回答

shim是执行API调用拦截并提供抽象层的任何一段代码。它并不一定局限于web应用程序或HTML5/CSS3。 polyfill是一种填充物,通常使用Javascript或Flash将传统浏览器改造为现代HTML5/CSS3功能。

在回答您的特定问题时,如果您希望保持目录的通用性,请将目录称为shims。

几年前有一篇关于这方面的精彩文章,很好地解释了这一点:

什么是Polyfill?

在文中,(2)被简单地对比如下:

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

Polyfill:你可以加入的东西(即JavaScript),它会无声地模仿现有的浏览器api,否则不受支持。

据我所知:

polyfill是检测是否缺少某个“预期的”API并手动实现它的代码。如。

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

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

Shim

If you are familiar with the adapter pattern, then you know what a shim is. Shims intercept API calls and create an abstract layer between the caller and the target. Typically shims are used for backward compatibility. For instance the es5-shim npm package will let you write ECMAScript 5 (ES5) syntax and not care if the browser is running ES5 or not. Take Date.now as an example. This is a new function in ES5 where the syntax in ES3 would be new Date().getTime(). If you use the es5-shim you can write Date.now and if the browser you’re running in supports ES5 it will just run. However, if the browser is running the ES3 engine es5-shim will intercept the call to Date.now and just return new Date().getTime() instead. This interception is called shimming. The relevant source code from es5-shim looks like this:

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

Polyfill

Polyfilling is really just a specialized version of shimming. Polyfill is about implementing missing features in an API, whereas a shim wouldn’t necessarily be as much about implementing missing features as it is about correcting features. I know these seems overly vague, but where shims are used as a more broader term, polyfill is used to describe shims that provide backward compatibility for older browsers. So while shims are used for covering up old sins, polyfills are used for bringing future enhancements back in time. As an example there is no support for sessionStorage in IE7, but the polyfill in the sessionstorage npm package will add this feature in IE7 (and older) by using techniques like storing data in the name property of the window or by using cookies.

Polyfill只是一个脚本用来检查浏览器中是否存在某个API ? 如果API不存在于浏览器填充(这是一个简单的脚本)将会像这样:

例如,我要在浏览器中使用蓝牙API,我知道有些浏览器没有这样的API,所以我会写一些这样的东西来检查我的API是否存在:

if(!navigator.bluetooth) { // write polyfill here } 

Shim也是一个脚本,主要是作为一个插件或库提供的,它是如何工作的?

实际上,它将覆盖一个已经存在的API,并实现不同的行为,以便在旧的浏览器中支持新的API。 值得注意的是,Shims主要用于向后兼容。