Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
Front-End-Performance-Checklist
🎮 The only Front-End Performance Checklist that runs faster than the others
https://github.com/thedaviddias/Front-End-Performance-Checklist
Last synced: 3 days ago
JSON representation
-
Server
-
References
- How to avoid bad requests
- Using cache-control for browser caching
- Let's Encrypt
- Why Use HTTPS? | Cloudflare
- Enabling HTTPS Without Sacrificing Your Web Performance - Moz
- How HTTPS Affects Website Performance
- HTTP versus HTTPS versus HTTP2 - The real story | Tune The Web
- HTTP vs HTTPS — Test them both yourself
- What Does My Site Cost?
- web - Measure full page size in Chrome DevTools - Stack Overflow
- Average Page Load Times for 2018 - How does yours compare? - MachMetrics Speed Blog
- What is Waiting (TTFB) in DevTools, and what to do about it
- Monitoring your servers with free tools is easy
- Global latency testing tool
- Cookie specification: RFC 6265
- Cookies
- Browser Cookie Limits
- Google's Web Performance Best Practices #3: Minimize Request Overhead - GlobalDots Blog
- 10 Tips to Optimize CDN Performance - CDN Planet
- HTTP Caching  | Web Fundamentals  | Google Developers
- Check GZIP compression
- Check Brotli Compression
- Can I use... Brotli
- Page Weight
- Learn more about Brotli Compression
- Combine external JavaScript
- Time to First Byte (TTFB)
- Combine external CSS
-
-
How to use?
-
Performance tools
- Sitespeed.io - Welcome to the wonderful world of Web Performance
- Calibre
- packtracker.io - Check your webpack bundle size on every pull request.
- Exthouse - Analyze the impact of a browser extension on web performance
- WebPagetest - Website Performance and Optimization Test
- GTmetrix | Website Speed and Performance Optimization
- Treo: Page Speed Monitoring
- Website and Server Uptime Monitoring - Pingdom
- PWMetrics - CLI tool and lib to gather performance metrics
- Checkbot browser extension - Checks for web performance best practices
- Yellow Lab Tools | Online test to help speeding up heavy web pages
- DebugBear - Monitor website performance and Lighthouse scores
- Lighthouse - Google
- SpeedCurve: Monitor front-end performance
-
References
-
-
Introduction
-
References
-
Performance tools
-
-
HTML
-
CSS
-
References
- cssnano: A modular minifier based on the PostCSS ecosystem. - cssnano
- @neutrinojs/style-minify - npm
- HTTP: Optimizing Application Delivery - High Performance Browser Networking (O'Reilly)
- Performance Best Practices in the HTTP/2 Era
- Example of preload CSS using loadCSS
- Preloading content with rel="preload"
- Preload: What Is It Good For? — Smashing Magazine
- UnCSS Online
- Understanding Critical CSS
- Inlining critical CSS for better web performance | Go Make Things
- Critical Path CSS Generator - Prioritize above the fold content :: SiteLocity
- Observe CSS Best Practices: Avoid CSS Inline Styles
- TestMyCSS | Optimize and Check CSS Performance
- CSS Stats
- Project Wallace
- CSS Minfier
- TestMyCSS | Optimize and Check CSS Performance
- Observe CSS Best Practices: Avoid CSS Inline Styles
-
-
Fonts
-
References
- A Book Apart, Webfont Handbook
- WOFF 2.0 – Learn more about the next generation Web Font Format and convert TTF to WOFF2
- Create Your Own @font-face Kits » Font Squirrel
- IcoMoon App - Icon Font, SVG, PDF & PNG Generator
- Using @font-face | CSS-Tricks
- Faster Google Fonts with Preconnect - CDN Planet
- Make Your Site Faster with Preconnect Hints | Viget
- Ultimate Guide to Browser Hints: Preload, Prefetch, and Preconnect - MachMetrics Speed Blog
- A Comprehensive Guide to Font Loading Strategies—zachleat.com
- `font-display` for the Masses
- CSS font-display: The Future of Font Rendering on the Web
-
-
Images
-
References
- Essential Image Optimization - An eBook by Addy Osmani
- TinyJPG – Compress JPEG images intelligently
- Kraken.io - Online Image Optimizer
- ImageEngine - Image Webpage Loading Test
- Serve Images in Next-Gen Formats  | Tools for Web Developers  | Google Developers
- What Is the Right Image Format for Your Website? — SitePoint
- 8-bit vs 16-bit - What Color Depth You Should Use And Why It Matters - DIY Photography
- Base64 Encoding & Performance, Part 1 and 2 by Harry Roberts
- When to base64 encode images (and when not to) | David Calhoun
- 5 Brilliant Ways to Lazy Load Images For Faster Page Loads - Dynamic Drive Blog
- Responsive images - Learn web development | MDN
- Base64 encoding images for faster pages | Performance and seo factors
- PNG8 - The Clear Winner — SitePoint
- A closer look at Base64 image performance – The Page Not Found Blog
- Compressor.io - optimize and compress JPEG photos and PNG images
-
-
JavaScript
-
References
- uglify-js - npm
- Short read: How is HTTP/2 different? Should we still minify and concatenate?
- 11 Tips to Optimize JavaScript and Improve Website Loading Speeds
- Remove Render-Blocking JavaScript
- npm-check
- Greenkeeper
- Vanilla JavaScript for building powerful web applications
- npm
- webpack-bundle-analyzer - npm
- js-dependency-viewer - npm
- JavaScript Profiling With The Chrome Developer Tools — Smashing Magazine
- Chapter 22 - Profiling the Frontend - Blackfire
- 30 Tips To Improve Javascript Performance
- What Are Service Workers and How They Help Improve Performance
- How does a service worker work? - YouTube
- Online JavaScript Compressor
- Defer loading JavaScript
- Size Limit: Make the Web lighter — Martian Chronicles, Evil Martians’ team blog
-
-
Performances and JS Frameworks
-
Performances and CMS
-
WordPress
- Test Your Website Speed | WordPress Hosting by @WPEngine
- 19 Tips to Speed Up WordPress Performance (Updated)
- Speed Up Your WordPress - How to Save Images Optimized for Web
- Caching Plugin for WordPress - Speed up your website with WP Rocket
- WP-Sweep | WordPress.org
- Imagify Image Optimizer | WordPress.org
- Test Your Website Speed | WordPress Hosting by @WPEngine
-
-
Support
-
WordPress
-
-
Author
-
WordPress
-
-
Uncategorized
-
Uncategorized
-
-
Sponsors
-
WordPress
-
Programming Languages
Categories
Sub Categories