Fast Loading Your React Apps : Where to start?

Fast Loading Your React Apps : Where to start?

D30c8a66d280aa8b7cd86f82bc105bec?s=128

Punit Sethi

March 09, 2019
Tweet

Transcript

  1. Fast Loading Your React Apps Where to Start? punit@tezify.com

  2. About • Past : Performance Engineer for a decade -

    various parts of tech stack. • Current : Consulting Performance Engineer primarily focussed on Frontend Performance
  3. Objective With so many options, where to start? What will

    benefit your app speed the most?
  4. Know Your Top Entry Routes - Loading initial routes is

    the slowest. - Amount of JS that loads @ entry routes. - Not just vendor.js / main.js / app.js but total JS (Why? Addy says so.)
  5. Get a Devtools View of Things - Devtools -> Network

    tab gives a fair idea of biggest time consumers (Here’s how) - If your app users are mostly mobile, look at the Devtools of your site loaded on actual mobile. (Here’s how)
  6. Get a Devtools View of Things

  7. Zoom in With Webpack Bundle Analyzer - Know the biggest

    contributors to your JS chunks that load at entry routes. - Question - If these need to be loaded? - If these can be loaded later? - Start leveraging the sea of optimizations.
  8. Zoom in With Webpack Bundle Analyzer

  9. Questions? punit@tezify.com / @geekybiz