Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

What is the difference between a shim and a polyfill?

DZone's Guide to

What is the difference between a shim and a polyfill?

· Web Dev Zone ·
Free Resource

Learn how to add document editing and viewing to your web app on .Net (C#), Node.JS, Java, PHP, Ruby, etc.

In the JavaScript world, one frequently hears the words shim and polyfill. What are those things and what is the difference between them?

Shim. A shim is a library that brings a new API to an older environment, using only the means of that environment.

Polyfill. In October 2010, Remy Sharp blogged about the term “polyfill” [via Rick Waldron]:

A polyfill is a piece of code (or plugin) that provides the technology that you, the developer, expect the browser to provide natively. Flattening the API landscape if you will.

Thus, a polyfill is a browser-related shim. You typically check if a browser supports a given API and load a polyfill if it doesn’t. That allows you to use the API in either case. The term polyfill comes from a home improvement product:

Polyfilla is a UK product known as Spackling Paste in the US. With that in mind: think of the browsers as a wall with cracks in it. These [polyfills] help smooth out the cracks and give us a nice smooth wall of browsers to work with.


Polyfilla – image from tooled-up.com [via Paul]


Examples.
Paul Irish has published a list with “HTML5 Cross Browser Polyfills”. es5-shim is an example of a (non-polyfill) shim – it retrofits ECMAScript 5 features on ECMAScript 3 engines. It is purely language-related and makes just as much sense on Node.js as it does on browsers.

 

Source: http://www.2ality.com/2011/12/shim-vs-polyfill.html

Extend your web service functionality with docx, xlsx and pptx editing. Check out ONLYOFFICE document editors for integration.

Topics:

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}