brooklynjs/brooklynjs.github.io

babel-fish

caiogondim opened this issue · 1 comments

BrooklynJS Talk Submission

Talk Title:
babel-fish: on-the-fly JS transpiler/optimizer.

Talk Description:
babel-fish is an on-the-fly optimized JavaScript transpiler. It acts as a reverse proxy for JavaScript resources and uses information about the requesting browser to optimize transpilation and polyfill addition to make full use of native browser features that are available in the requesting agent. This results in smaller, more performant bundles for newer browsers.

It applies 3 main optimizations techniques:

  • dynamic transpilation: minimum transpilation possible on the request file for the requesting browser
  • dynamic polyfill: only polyfill what's needed for the requested file to run on the requesting browser
  • dynamic compression: uses the best compression algorithm (gzip, deflate or brotli) supported by the requesting browser

babel-fish was originally created to be used with VHS3 (NYT media player). There
we saw a 16% drop in bundle size on the uncompressed asset and 30% drop on the
compressed asset by using better minification and compression algorithms.

final-bundle-size-chart

Name:
Caio Gondim
Jonah Smith

Pronouns:
He/Him
He/Him

Twitter Handle (optional):
https://twitter.com/caio_gondim

Website (optional):
https://caiogondim.com

Months Available to Speak:
August/2019
September/2019

👋 @caiogondim your talk has been accepted! You'll be receiving speaker details soon via email.