Performance Optimizations for Progressive Web Apps

on YouTube ↗32m

" summary

Shows a production Xfinity xFi progressive web app built with Google Polymer and the PRPL pattern and demonstrates concrete wins not platitudes. Uses Chrome DevTools & Lighthouse, the user timing API and Comcast’s surf library to measure; applies code‑splitting, defer scripts, dns prefetch, service workers and CSS/DOM fixes. Replaces heavy libs like moment with smaller alternatives. Claims include shrinking initial payload toward the 130–170 KB budget and cutting desktop startup from about 6s to 2.3s and real‑world median from 21s to 15s.

AI-written summary · about

" chapters (6)

1. 0:00Start
2. 4:46What is our Goal?
3. 18:01Code splitting
4. 18:44CRITICAL PATH
5. 21:32An Optimal DOM Tree
6. 29:48Discipline

" related talks

• 51mOutrun the 🐻! Performance Optimizations for Progressive Web AppsChris Lorenzo · Windcity DevFest 2019
• 23mPerformance Optimizations for Progressive Web AppsChris Lorenzo · Node+JS Interactive 2018
• 35mImprove Your Web Application Using Progressive Web MetricsArtem Denysov · JavaScript fwdays'17
• 33mEnd to End Apps with PolymerKevin Schaaf · Polymer Summit 2017
• 32mPractical Performance Tips Building Progressive Web AppsNarendra Shetty · React Amsterdam 2017
• 51mProgressive Web AppsThomas Steiner · code.talks 2016
• 27mProgressive what apps?Patrick Kettner · Render Conference 2017
• 39mProgressive web apps with PolymerMartin Splitt · JavaScript fwdays'17