Thursday, April 28, 2016

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

No comments:

Post a Comment