Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/awesomelistsio/awesome-web-performance
A curated list of awesome resources, tools, and tips to improve web performance.
https://github.com/awesomelistsio/awesome-web-performance
List: awesome-web-performance
awesome awesome-list awesome-lists web-performance
Last synced: 28 days ago
JSON representation
A curated list of awesome resources, tools, and tips to improve web performance.
- Host: GitHub
- URL: https://github.com/awesomelistsio/awesome-web-performance
- Owner: awesomelistsio
- Created: 2024-08-18T02:36:37.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2024-11-03T02:37:59.000Z (about 2 months ago)
- Last Synced: 2024-11-22T20:02:02.475Z (29 days ago)
- Topics: awesome, awesome-list, awesome-lists, web-performance
- Language: Python
- Homepage: https://github.com/brandonhimpfen/awesome
- Size: 6.84 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- ultimate-awesome - awesome-web-performance - A curated list of awesome resources, tools, and tips to improve web performance. (Other Lists / PowerShell Lists)
README
# Awesome Web Performance [](https://github.com/brandonhimpfen/awesome)
[](https://tinyurl.com/d4xnrptz) [](https://tinyurl.com/mr22naua) [](https://tinyurl.com/e8ymxdw3)
> A curated list of awesome resources, tools, and tips to improve web performance.
## Contents
- [General Resources](#general-resources)
- [Performance Metrics](#performance-metrics)
- [Performance Tools](#performance-tools)
- [Optimization Techniques](#optimization-techniques)
- [Performance Budgeting](#performance-budgeting)
- [Case Studies](#case-studies)
- [Blogs & Newsletters](#blogs--newsletters)
- [Books](#books)
- [Talks & Videos](#talks--videos)
- [Communities](#communities)
- [Courses & Tutorials](#courses--tutorials)
---
## General Resources
- [Web Performance 101](https://3perf.com/talks/web-perf-101/) - Introduction to web performance.
- [Google Web Fundamentals: Performance](https://developers.google.com/web/fundamentals/performance) - Comprehensive guide to web performance.
- [MDN Web Docs: Performance](https://developer.mozilla.org/en-US/docs/Web/Performance) - Web performance documentation by Mozilla.
## Performance Metrics
- [Core Web Vitals](https://web.dev/vitals/) - Google's essential metrics for user experience.
- [Lighthouse Metrics](https://developers.google.com/web/tools/lighthouse) - Google Lighthouse metrics for web performance.
- [TTFB (Time to First Byte)](https://www.keycdn.com/support/ttfb) - Explanation and importance of TTFB.
## Performance Tools
- [Google Lighthouse](https://developers.google.com/web/tools/lighthouse) - Automated tool for improving the quality of web pages.
- [WebPageTest](https://www.webpagetest.org/) - Detailed performance testing with real browsers.
- [GTmetrix](https://gtmetrix.com/) - Website performance testing and monitoring.
- [Pingdom](https://www.pingdom.com/) - Uptime and performance monitoring.
- [PerfBudget](https://perf-budget.com/) - Set and track performance budgets.
## Optimization Techniques
### Network Optimization
- [Critical Rendering Path](https://developers.google.com/web/fundamentals/performance/critical-rendering-path) - Understanding and optimizing the critical rendering path.
- [HTTP/2](https://developers.google.com/web/fundamentals/performance/http2) - How HTTP/2 improves performance.
- [Image Optimization](https://imageoptim.com/) - Tools and techniques for optimizing images.
### Frontend Optimization
- [Lazy Loading](https://developer.mozilla.org/en-US/docs/Web/Performance/Lazy_loading) - Techniques to delay loading of non-critical resources.
- [Code Splitting](https://webpack.js.org/guides/code-splitting/) - Splitting your code for faster load times.
- [Minification](https://developers.google.com/speed/docs/insights/MinifyResources) - Minifying HTML, CSS, and JS.
### Backend Optimization
- [Server-Side Rendering (SSR)](https://developers.google.com/web/updates/2019/02/rendering-on-the-web) - How SSR can improve performance.
- [Caching Strategies](https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/http-caching) - Using cache to speed up content delivery.
- [Content Delivery Networks (CDN)](https://www.cloudflare.com/learning/cdn/what-is-a-cdn/) - How CDNs can improve performance.
## Performance Budgeting
- [Setting a Performance Budget](https://web.dev/performance-budgets-101/) - How to set and manage performance budgets.
- [Performance Budget Calculator](https://perfbudget.io/) - Tool for calculating performance budgets.
## Case Studies
- [Pinterest](https://medium.com/@Pinterest_Engineering/driving-user-growth-with-performance-improvements-cfc50dafadd7) - Pinterest's approach to improving performance.
- [The Guardian](https://www.guardsquare.com/blog/how-we-improved-our-web-performance-by-90-percent) - How The Guardian improved their web performance.
## Blogs & Newsletters
- [Web.Dev Blog](https://web.dev/blog/) - Official blog for web development and performance tips.
- [CSS Tricks](https://css-tricks.com/tag/performance/) - Articles related to web performance.
- [PerfPlanet](http://perfplanet.com/) - Performance tips, tricks, and articles.
## Books
- *[High Performance Browser Networking](https://hpbn.co/)* by Ilya Grigorik - A book on how browsers interact with the network.
- *[Web Performance in Action](https://www.manning.com/books/web-performance-in-action)* by Jeremy Wagner - Practical techniques for improving web performance.
- *[Designing for Performance](http://designingforperformance.com/)* by Lara Hogan - Techniques for a faster, more efficient web.
## Talks & Videos
- [Designing for Performance](https://vimeo.com/106599453) - Talk by Lara Hogan.
- [Web Performance Made Easy](https://www.youtube.com/watch?v=RWLzUnESylc) - Google I/O talk on web performance.
- [The Cost of JavaScript](https://www.youtube.com/watch?v=_bzqF05xsC4) - Google Chrome Developers talk on JS performance.
## Communities
- [PerfPlanet Slack](https://perfplanet.slack.com/) - Slack community for web performance.
- [r/webdev](https://www.reddit.com/r/webdev/) - Reddit community with discussions on web performance.
## Courses & Tutorials
- [Udacity: Website Performance Optimization](https://www.udacity.com/course/website-performance-optimization--ud884) - Free course on web performance.
- [Frontend Masters: Web Performance](https://frontendmasters.com/courses/web-performance/) - In-depth course on web performance optimization.
## Contribute
Contributions are welcome!
## License
[](http://creativecommons.org/licenses/by-sa/4.0/)