/web-performance-studies

Web performance studies

MIT LicenseMIT

Web Performance Studies

My studies on web performance

General

Type Name Status
Article Front-End Performance Checklist 2021 📑
Article Chrome’s Paint Flashing Tool 📑
Video Improving Page Performance in Modern Web Apps 📑
Video Speed Essentials: Key Techniques for Fast Websites 🎥
Video Improving Page Performance in Modern Web Apps 📑
Article Building the DOM faster: speculative parsing, async, defer and preload 📑
Article Improving React Runtime Performance 📑
Article Building the DOM faster 📑
Article Maybe you don't need Rust and WASM to speed up your JS 📑
Article Fast load times 📑
Video Demystifying Speed Tooling 🎥
Article Monitoring Your Core Web Vital (Performance) Metrics 📑

Performance Budget

Type Name Status
Article Chrome’s Paint Flashing Tool 📑
Article Start Performance Budgeting 📑
Article Performance budgets 101 📑
Article Optimizing startup performance 📑
Article Setting a performance budget 📑
Article Responsive Design on a Budget 📑
Article Web Performance Budgets are more than mere thresholds 📑
Article User-centric performance metrics 📑
Article Operationalizing Performance with Performance Budgets 📑
Video Core Web Vitals - Measure what matters 🎥

Case Studies

Type Name Status
Article A Netflix Web Performance Case Study 📑
Video Performance Signup in React & Transactional Apps with Redux 🎥
Article Making Instagram.com faster: Part 1 📑
Article Making Instagram.com faster: Part 2 📑
Article Making Instagram.com faster: Part 3 — cache first 📑
Article Making instagram.com faster: Code size and execution optimizations (Part 4) 📑
Article A Pinterest Progressive Web App Performance Case Study 📑
Article Twitter Lite and High Performance React Progressive Web Apps at Scale 📑
Article React Performance Fixes on Airbnb Listing Pages 📑
Article The Road to Great Product Performance: The First Steps 📑
Article Zillow: Bigger, Faster, and More Engaging while on a Budget 📑
Article Gantry: Slack’s Fast-booting Frontend Framework 📑
Article A Tinder PWA Performance Case Study 📑
Article Treebo: A React PWA Performance Case Study 📑
Article How Mercado Libre optimized for Web Vitals (TBT/FID) 📑
Article Nikkei achieves a new level of quality and performance with their multi-page PWA 📑

Cache & Memoization

Type Name Status
Video Love your cache: Optimize for the second load 🎥

Prefetching

Type Name Status
Article <link rel=”prefetch/preload”> in webpack 📑
Article preload-webpack-plugin 📑
Article Webpack Prefetching/Preloading modules 📑
Article Speed up next-page navigations with prefetching 📑

Images

Type Name Status
Video Image compression deep-dive 🎥

Browser APIs

Type Name Status
Article Adaptive Serving using JavaScript and the Network Information API 📑

Cumulative Layout Shift

Type Name Status
Article How I removed website layout shift using a predeploy script 📑
Article Measuring Cumulative Layout Shift 📑

Largest Contentful Paint

Type Name Status
Article Measuring Largest Contentful Paint 📑