Dark Art of Webpack Bundle Tuning

This submission has been added to the schedule

Dark Art of Webpack Bundle Tuning

Submitted Mar 9, 2017

Technical level: Intermediate

While webpack continues to become more and more popular and de-facto choice of module bundling in an increasingly ES6 and ES7 centric world, its VERY easy to get lost in all the hoopla of getting the webpack to work.

What the developers endup with is - huge bundles for your application - which are slow to load up and degrade user experience.

The talk will showcases such scenario, introduce tools and fixes to alleviate the issues.

At the end of the session, users will know how to utilize Webpack more optimally.

Outline

A typical flow of talk would be to showcase following:
a. A typical application having bloated webpack bundles
b. Tools to analyze the bundles and how to read / understand the output of those tools. (2-4 tools)
c. Based on hints / information from the tools, perform “live-fixes” / “walk through git-diff” to show how small changes in chunk definitions / import statements, etc can make big changes in your webpack bundle sizes.
d. How extract-text-plugin can help get CSS moved out of bundles for production and get more performance benefit.
e. how to turnon / turn-off source maps for PROD build.

Requirements

The audience is expected to know what webpack is and its basic usage.

Speaker bio

Vijay is Principal Architect at Infosys.He is Open Source Evangelist and Developer Advocate within and outside of Infosys. Vijay organizes yearly technology conference within Infosys. Vijay spoke at Great Indian Developer Summit (2017) about webpack as well. See links section for slides and demo code.

While a Java veteran for many years, in last 4 years, Vijay has focussed completely on UI and UX and has spearheaded Front-end development of many large enterprise projects. He has always tried incorporate all the best practices in JS and CSS world in his projects. He loves everything about UX and has been very particular about providing the Best User Experience to the end users.

Vijay has more than years experience in webpack and has tuned his own large enterprise application with many of the techniques outlined in this topic.

ReactFoo Pune