Help! My app bundle is 5MB! My users are angry that my app is so slow! It’s easy to forget that performance matters when we are under pressure to deliver features quickly. What data should we use to inform our decisions? From code splitting, lazy loading, and tree shaking to bundle analysis, progressive rendering, and modern transpiling, come learn how you can deliver a better experience to your users with high-performing front-end apps. This talk is library-agnostic (React, Angular, Vue, etc.).
The most recent version of the slides for this talk are here on SpeakerDeck (from RWX2018).
You can watch the video from Full Stack Fest in Barcelona here:
Want to learn more about how to measure and improve performance? Here you go:
- Modern DevTools course by Umar Hansa
- /dev tips by Umar Hansa
- Optimize Website Speed with Chrome DevTools by Kayce Basques
- Assessing Loading Performance in Real Life with Navigation and Resource Timing by Jeremy Wagner
- User Timing API – Measuring User Experience Performance by Cody Arsenault
- Measure Performance with the RAIL Model by Meggin Kearney, et. al.
- Reduce JavaScript Payloads with Tree Shaking by Jeremy Wagner
- Reduce JavaScript Payloads with Code Splitting by Jeremy Wagner and Addy Osmani
- Lazy Loading Images and Video by Jeremy Wagner
- The Cost of JavaScript in 2018 by Addy Osmani
- The Cost of JavaScript by Addy Osmani
- Why Web Developers Need to Care about Interactivity by Philip Walton
- Preload, Prefetch And Priorities in Chrome by Addy Osmani
- Webpack build analysis on SurviveJS by Juho Vepsäläinen
- https://www.webpagetest.org/easy easy no configuration set up for a slow-3G connection and mid-level phone, specifically Chrome on a Motorola G (gen 4) tested from Dulles, Virginia on a 400 Kbps 3G connection with 400ms of latency.
- Responsive Images by Pete LePage
- Responsive Images Udacity Course by Google
- Optimizing Images in Webpack on SurviveJS by Juho Vepsäläinen
- Can You Afford It?: Real-world Web Performance Budgets by Alex Russell
- Deploying ES2015+ Code in Production Today by Philip Walton
- HTTP Caching by Ilya Grigorik
- Take a (Client) Hint! by Jeremy Wagner
- To push, or not to push?! - The future of HTTP/2 server push by Patrick Hamann
- The Future is Fast on performance and Gatsby.js by Jason Lengstorf
- If you have the chance, attend one of Harry Robert's talks or workshops on performance
- Does my site need HTTPS?
Other sources:
- Speed is now a landing page factor for Google Search and Ads by Addy Osmani and Ilya Grigorik
- WPO Stats - Case studies and experiments demonstrating the impact of web performance optimization (WPO) on user experience and business metrics
- Why performance matters by Jeremy Wagner
- End to End Apps with Polymer (Polymer Summit 2017) talk by Kevin Schaaf which also shows the time to interactive video
- This is why I prefer Progressive Rendering + Bootstrapping. tweet by Paul Lewis with graphic comparing progressing rendering with SSR and CSR
- Why Waiting Is Torture by Alex Stone
- The Truth About Download Time by Christine Perfetti
- The need for mobile speed: How mobile latency impacts publisher revenue report by DoubleClick by Google
You can follow me on Twitter and Medium!
Interested in having me speak at your event? Check out my speaking history and/or my website.