Browser normalization tools: transpilers, polyfills and shims

Transpiler

• It's a source-to-source compiler.
• Converts and older ES syntax to the new one. 
• Additionally, it's a must when using TypeScript or Coffe-Script to generate the corresponding ES code.
• Executed before deployment, it's a development tool not needed at run-time.

Example: Babel

Polyfills

• A polyfill is code that detects if a certain “expected” API is missing and manually implements it.
• Polyfills often have to use multiple language platforms because sometimes a particular JS API doesn’t exist in that browser at all.
• A JS library and eventually other native artifacts are required at run-time.

Example: core-js

Shim

• A shim is code that intercepts existing API calls and implements different behavior (the API already exists but it must be normalized/patched).
• Usually they are smaller pieces of code than polyfills.
• Usually they are entirely written in JS.
• A JS library it's required at run-time.

Example: es6-shim

References

• Differences between polyfills and shims explanation.
• ES6 tools
• ES7 tools