Awesome
Awesome Web Performance
A curated list of awesome resources, tools, and tips to improve web performance.
Contents
- General Resources
- Performance Metrics
- Performance Tools
- Optimization Techniques
- Performance Budgeting
- Case Studies
- Blogs & Newsletters
- Books
- Talks & Videos
- Communities
- Courses & Tutorials
General Resources
- Web Performance 101 - Introduction to web performance.
- Google Web Fundamentals: Performance - Comprehensive guide to web performance.
- MDN Web Docs: Performance - Web performance documentation by Mozilla.
Performance Metrics
- Core Web Vitals - Google's essential metrics for user experience.
- Lighthouse Metrics - Google Lighthouse metrics for web performance.
- TTFB (Time to First Byte) - Explanation and importance of TTFB.
Performance Tools
- Google Lighthouse - Automated tool for improving the quality of web pages.
- WebPageTest - Detailed performance testing with real browsers.
- GTmetrix - Website performance testing and monitoring.
- Pingdom - Uptime and performance monitoring.
- PerfBudget - Set and track performance budgets.
Optimization Techniques
Network Optimization
- Critical Rendering Path - Understanding and optimizing the critical rendering path.
- HTTP/2 - How HTTP/2 improves performance.
- Image Optimization - Tools and techniques for optimizing images.
Frontend Optimization
- Lazy Loading - Techniques to delay loading of non-critical resources.
- Code Splitting - Splitting your code for faster load times.
- Minification - Minifying HTML, CSS, and JS.
Backend Optimization
- Server-Side Rendering (SSR) - How SSR can improve performance.
- Caching Strategies - Using cache to speed up content delivery.
- Content Delivery Networks (CDN) - How CDNs can improve performance.
Performance Budgeting
- Setting a Performance Budget - How to set and manage performance budgets.
- Performance Budget Calculator - Tool for calculating performance budgets.
Case Studies
- Pinterest - Pinterest's approach to improving performance.
- The Guardian - How The Guardian improved their web performance.
Blogs & Newsletters
- Web.Dev Blog - Official blog for web development and performance tips.
- CSS Tricks - Articles related to web performance.
- PerfPlanet - Performance tips, tricks, and articles.
Books
- High Performance Browser Networking by Ilya Grigorik - A book on how browsers interact with the network.
- Web Performance in Action by Jeremy Wagner - Practical techniques for improving web performance.
- Designing for Performance by Lara Hogan - Techniques for a faster, more efficient web.
Talks & Videos
- Designing for Performance - Talk by Lara Hogan.
- Web Performance Made Easy - Google I/O talk on web performance.
- The Cost of JavaScript - Google Chrome Developers talk on JS performance.
Communities
- PerfPlanet Slack - Slack community for web performance.
- r/webdev - Reddit community with discussions on web performance.
Courses & Tutorials
- Udacity: Website Performance Optimization - Free course on web performance.
- Frontend Masters: Web Performance - In-depth course on web performance optimization.
Contribute
Contributions are welcome!