Tech is political: The people under attack in Palestine 🇵🇸, Iran 🇮🇷, and Lebanon 🇱🇧 are people like us. They’re our brothers and sisters, too. Read up on their history, scrutinize what you’re told, and demand respect and accountability. Hide

Frontend Dogma

“performance” News Archive (2)

Entry (Sources) and Additional TopicsDate#
How to Prevent Unnecessary React Component Re-Rendering740
how-tos, react, client-side-rendering
Is Lighthouse a Misleading Performance Tool?739
lighthouse, web-vitals, tooling
What Is Page Bloat? And How Is It Hurting Your Business, Your Search Rank, and Your Users? (tam/spe)738
user-experience, user-conversion, metrics, economics
In Defence of “DOMContentLoaded” (css)737
javascript, dom
Comparing npm, Yarn, and pnpm Package Managers: Which One Is Right for Your Distributed Project to Handle High Loads?736
npm, yarn, pnpm, comparisons, best-practices
What Does the Image “decoding” Attribute Actually Do? (tun)735
html, attributes, images
Debugging INP (scr)734
videos, debugging, web-vitals
The Cost of JavaScript 2023 (add)733
videos, javascript
Too Much JavaScript? Why the Frontend Needs to Build Better732
javascript, web-platform
Style Recalculation Secrets They Don’t Want You to Know (pat/css)731
videos, css, selectors
Before Your Next Frontend Pull Request, Use This Checklist (tra/evi)730
checklists, compression, dependencies, accessibility, legibility, naming
Reducing Complexity in Front End Development (mic)729
complexity, css, javascript
How to Detect Unnecessary Renderings of DOM Elements in Your Web App to Improve Performance728
how-tos, rendering, dom, debugging, angular
How Chrome Achieved High Scores on Three Browser Benchmarks727
browsers, chrome
Performance Is Not a Checklist (tka)726
user-experience
Watch Out for Layout Shifts With “ch” Units (pau/clo)725
css, units
Deploying AVIF for More Responsive Websites724
images, avif
Announcing INP as the Next Core Web Vital: What Shopify Stores Can Do Now (sia)723
web-vitals, shopify
The 9 Most Effective Core Web Vitals Opportunities of 2023 (tun)722
videos, web-vitals
Advancing Interaction to Next Paint (rvi+)721
web-vitals
Introducing INP to Core Web Vitals720
introductions, web-vitals, search, seo
How to Optimize Web Responsiveness With Interaction to Next Paint (ann)719
videos, how-tos, web-vitals
Diagnose Slow Interactions in the Lab (mal)718
web-vitals
Optimize Input Delay (mal)717
web-vitals, optimization
Find Slow Interactions in the Field (mal)716
web-vitals, auditing
How Large DOM Sizes Affect Interactivity, and What You Can Do About It (mal)715
dom, html, optimization
Script Evaluation and Long Tasks (mal)714
javascript, web-vitals
Client-Side Rendering of HTML and Interactivity (mal)713
html, client-side-rendering
Pay Attention to Web Performance Metrics to Improve the UX (uxm)712
metrics, user-experience, web-vitals, optimization
5 Best Practices to Sustainably Improve Core Web Vitals (ben/cal)711
web-vitals, best-practices
Make Your Website Load Fast by Optimizing Request Priorities (mat/deb)710
optimization, network
The Intersectionality of Web Performance709
sustainability, dei
Load Websites Faster With Code Splitting708
code-splitting, react
A Complete Guide to Performance Budgets (spe)707
guides, performance-budgets, metrics
CDNs: Speed Up Performance by Reducing Latency (aus)706
content-delivery
Practical Guide to Not Blocking the Event Loop705
guides, javascript, event-loop, events
Reducing the Cost of String Serialization in Node.js Core (yag)704
nodejs, strings
Frontend Web Performance Checklist (jac)703
checklists
Exploring the Potential of Web Workers for Multithreading on the Web (sma)702
web-workers, multithreading, javascript
Intro to Runtime Performance in the Chrome DevTools Performance Panel (ann/thi)701
videos, introductions, dev-tools, browsers, chrome
DevTools: A Better Way to Visualize Your JavaScript700
dev-tools, visualization, browsers, lighthouse, chrome, edge
Serving Less Data to Users With the “prefers-reduced-data” Media Query (sea)699
css, media-queries, sustainability
Speeding Up the JavaScript Ecosystem—Draft-js Emoji Plugin (mar)698
javascript, plugins
Costly CSS Properties and How to Optimize Them697
css, optimization
Understanding CSS Preload and Other Resource Hints (log)696
css, hints, preloading
Load Balancing (sam)695
load-balancing, visualization, architecture
The Performance Golden Rule Revisited (tka)694
metrics
The Real Difference Between “useMemo” and “Memo” in React693
react, hooks, examples
Slow Start and Congestion Control (Browser Networking)692
protocols, tcp
7 Tricks to Take the Performance of Your Website to the Moon691
minification, tree-shaking, tips-and-tricks
10 Ways to Hide Elements in CSS (cra)690
hiding, css, accessibility
Flutter Performance Optimization Techniques and Best Practices689
flutter, optimization, best-practices
Defaulting on Single Page Applications (SPA) (zac)688
single-page-apps, javascript
Senior Engineering Strategies for Advanced React and TypeScript (tec)687
strategies, react, typescript, architecture, testing, accessibility, security, maintenance
The Ultimate Guide to Image Optimisation (fox/cal)686
guides, images, compression, optimization
Speeding Up the JavaScript Ecosystem—npm Scripts (mar)685
javascript, bundling, npm
2023 Web Framework Performance Report684
frameworks, astro, sveltekit, gatsby, remix, wordpress, nextjs, nuxt, comparisons
Optimising Large Contentful Paint (css/btc)683
videos, web-vitals, optimization
Client-Side JavaScript and React Criticism: What Comes Next?682
javascript, react, accessibility, resilience, progressive-enhancement
The JavaScript Site Generator Review, 2023 (zac)681
site-generators, comparisons, astro, eleventy, gatsby, nextjs, nuxt, remix, sveltekit
An Approach to Lazy Loading Custom Elements (css)680
web-components, lazy-loading
This Is Why Performance Matters (bel)679
javascript, user-experience
Caching at DEV678
case-studies, caching
What’s New in Lighthouse 10677
release-notes, lighthouse
Speeding Up the JavaScript Ecosystem—ESLint (mar)676
javascript, eslint, linting
The Gotcha With Animating Custom Properties (bra)675
css, animations, custom-properties
Speed for Who? (bel)674
frameworks, developer-experience, user-experience
Monitoring Node.js Performance (ano)673
nodejs, monitoring, tooling, nsolid
Optimal Images in HTML (ste/bui)672
html, images, backgrounds, optimization
Your Web Performance Is Too Reactive; It’s Time to Do More Than Put Out Fires (fox/cal)671
The Modern Way of Serving Images (kur)670
images, html
How to Review a Web Site (uxm)669
how-tos, user-experience, seo
Optimize Time to First Byte (mal)668
optimization
Why We Switched CDNs: How Google’s Core Web Vitals Led Us to Cloudflare Pages667
content-delivery, web-vitals, cloudflare
The Truth About CSS Selector Performance (pat)666
css, selectors
Optimizing the Image Element LCP (sma)665
web-vitals, images
Speeding Up the JavaScript Ecosystem—Module Resolution (mar)664
javascript, modules, esm, commonjs
Why Not “document.write()”? (css)663
javascript
Our Top Core Web Vitals Recommendations for 2023 (phi+)662
web-vitals, best-practices
Why Web Performance Still Matters in 2023 (sia)661
Priority Hints and Optimizing LCP (kev)660
web-vitals, optimization, hints
Performance Culture Through the Looking-Glass (per)659
videos, culture
The RUM Archive and Benford’s Law (per)658
HTTP/3 Prioritization Demystified (pro/per)657
http, protocols
Signals: The Nitty-Gritty (web/per)656
javascript, signals
Bad Performance Is Bad Accessibility (bru)655
accessibility
The Performance Inequality Gap, 2023 (sli)654
javascript, metrics
Beating Latency on Scalemates.com (tim/per)653
optimization
Using Inline JavaScript Modules to Prevent CSS Blockage (sto/per)652
javascript, css
An HTML-First Mental Model (noa/per)651
html, dom
Get Off the Main Thread With an Inline Web Worker: An Example (sto/per)650
javascript, web-workers, examples
LCP(FE) (tim/per)649
web-vitals
Web Performance and Compression (per)648
compression
Optimize Interaction to Next Paint (mal+)647
optimization, web-vitals
Accessibility: The Land That “Time to Interactive” Forgot (tin/per)646
videos, accessibility
Adding Complementary Performance Data to Your Site (eth/mat)645
apis
Reduce Image Sizes by Removing Metadata (per)644
images, metadata, optimization
Fast Is Good, Instant Is Better (tun/per)643
caching
Prerender Pages in Chrome for Instant Page Navigations (tun)642
browsers, chrome
Developing Faster JavaScript Apps: The Ultimate Guide to Web Workers (cra)641
guides, web-apps, web-workers, javascript
7 Website Performance Metrics to Track for Better UX (cal)640
user-experience, metrics
Speeding Up the JavaScript Ecosystem—One Library at a Time (mar)639
javascript, libraries
Minification and Cache Directives for the Most Popular Websites of the Internet (dvk)638
minification, javascript, css, html, lightning-css, html-minifier, metrics, caching
Lazy Loading Images in HTML (sim)637
html, lazy-loading
A Guide to Image Optimization on Jamstack Sites (daw/sma)636
guides, images, compression, optimization, tech-stacks, jamstack
Improving React Interaction Times by 4×635
react, optimization
Early Learnings for Early Hints at Shopify (sia/per)634
videos, case-studies, shopify, hints
Client-Side Routing Without the JavaScript (rya/thi)633
javascript, frameworks
6 Steps to Improve HTML Images for Users and Developers (aus)632
html, images, responsive-design
HTML and CSS Features, Tips for a 10× Faster Page Loading Speed631
html, css, tips-and-tricks
Is Turbopack Really 10× Faster Than Vite? (eva)630
tooling, bundling, turbopack, vite
CSS Runtime Performance629
slides, css
A Beginner’s Guide to Chrome Tracing (nol)628
guides, browsers, chrome, tracing
Conditionally Adaptive CSS—Browser Behavior That Might Improve Your Performance (pep)627
css, responsive-design
Performance (rvi/htt)626
web-almanac, studies, research, metrics, web-vitals
How We Improved React Loading Times by 70% With Next.js625
react, nextjs, case-studies
Which Serverless Edge Platform Has the Fastest Git Deployments? (den)624
serverless, edge-computing, git, deploying
CDN (htt)623
web-almanac, studies, research, metrics, content-delivery, tooling
Speeding Up Async Snippets (css)622
javascript, asynchrony
How to Animate CSS Box Shadows and Optimize Performance621
how-tos, css, animations, shadows
Sustainable Web Development Strategies Within an Organization (mic/sma)620
sustainability, optimization
SVG Sprites: Old-School, Modern, Unknown, and Forgotten (pep)619
svg, images, sprites
How to Optimize Resource Loading With the “fetchpriority” Attribute (mat/deb)618
how-tos, html, optimization
Optimize Long Tasks (mal)617
javascript, optimization
GIFs Without the .gif: The Most Performant Image and Video Options Right Now (oll/css)616
multimedia, images, gif, html
Performance Budgets: The Easiest Way to a Faster Site (fox/cal)615
performance-budgets
Five Data-Loading Patterns to Boost Web Performance (sma)614
Page Weight (jam/htt)613
web-almanac, studies, research, metrics
Element Timing: One True Metric to Rule Them All? (and/spe)612
time, apis, metrics
Will Serving Real HTML Content Make a Website Faster? Let’s Experiment! (sco)611
studies, research, html
How to Substantially Slow Down Your Node.js Server610
how-tos, nodejs
Total Blocking Time: A Short and Sweet Guide for Happier Users (ben/cal)609
javascript
Your Next.js Bundle Will Thank You608
nextjs, bundling
Critical CSS? Not So Fast! (css)607
css, critical-path
How to Improve Largest Contentful Paint for Faster Load Times (fox/cal)606
how-tos, web-vitals, optimization
Disabled JavaScript Turns Off Native Lazy Loading (ste)605
javascript, html, lazy-loading
Why Your Website Should Be Under 14 kB in Size604
protocols
Measure What You Impact, Not What You Influence (css)603
metrics, optimization
Optimize Data Fetching602
data-fetching
Can Browsers Optimize the Loading of Third-Party Resources? (add)601
browsers, embed-code
Tip: Use “fetchpriority=high” to Load Your LCP Hero Image Sooner (add)600
html, web-vitals
(Re-)Introducing Gatsby, a Reactive Site Generator599
gatsby, react, reactivity, site-generators, introductions
How and Why We Removed jQuery From GOV.UK598
jquery, maintainability
Core Web Vitals Tools to Boost Your Web Performance Scores (sma)597
web-vitals, tooling
Making a Website Under 1 kB596
minimalism, html
Which Generator Builds Markdown the Fastest? (zac)595
site-generators, markdown, comparisons
500 ms to 1.7 ms in React: A Journey and a Checklist594
react
Priority Hints—What Your Browser Doesn’t Know (Yet)593
hints
Fix Web Performance for the Long-Term (sia)592
testing, processes
Powerful Image Optimization Tools (lou/sma)591
link-lists, images, compression, tooling
Can SVG Symbols Affect Web Performance?590
svg, images
Avoiding “<img>” Layout Shifts: “aspect-ratio” vs. “width” and “height” Attributes (jaf)589
web-vitals, comparisons, html, attributes, aspect-ratio, css
Frontend Web Performance: The Essentials588
fundamentals, javascript
Faster WordPress Rendering With 3 Lines of Configuration (sto)587
wordpress, css, http, configuration
A CLS Punishment for Progressive Enhancement? (bel/pic)586
web-vitals, progressive-enhancement
Image Guard (j9t)585
packages, npm, images, compression, jpeg, png, gif, webp, avif
Everything You Need to Know About Web Performance (in 5 Minutes)584
web-vitals, compression
Style Scoping Versus Shadow DOM: Which Is Fastest? (nol)583
selectors, scope, dom, shadow-dom, comparisons, metrics
How to Remove 99% of JavaScript From Main Thread (wea)582
videos, how-tos, javascript
What We’ve Learned From One Year of Real User Monitoring Data on GOV.UK (the)581
monitoring, metrics
Measuring the Performance of Typefaces for Users II (sma)580
typography, fonts
Measuring the Performance of Typefaces for Users (sma)579
typography, fonts
Don’t Sink Your Website With Third Parties (sma)578
embed-code, dependencies
Two Lines of CSS That Boosts 7× Rendering Performance577
css, rendering
Conditionally Loading CSS or Any Resource Using Media Queries (ami)576
html, media-queries
Rethinking Server-Timing as a Critical Monitoring Tool (sma)575
time, http, metrics, monitoring
Don’t Fight the Browser Preload Scanner (mal)574
browsers, html, parsing
How to Use Google CrUX to Analyze and Compare the Performance of JS Frameworks (sma)573
how-tos, google, crux, metrics, javascript, frameworks
A Management Maturity Model for Performance (sli)572
Performance Game Changer: Browser Back/Forward Cache (tun/sma)571
browsers, caching, web-vitals
Get to Know Your Browser’s Performance Profiler570
browsers, tooling, profiling
Understanding the Performance Impact of Anti-Flicker Snippets (and/spe)569
web-vitals
Is Measuring Speed a Useful Metric for Design Systems? (amy+)568
videos, metrics, design-systems
Faster Initialization of Instances With New Class Features (joy)567
browsers, javascript, javascript-engines, v8
How to Improve Core Web Vitals (8 Ways)566
how-tos, web-vitals
The Ultimate Guide to Optimizing JavaScript for Quick Page Loads (ste/bui)565
guides, javascript, optimization
Core Web Vitals: Finding Common Ground Between SEOs and Developers (moz)564
web-vitals, seo, metrics
How to Optimize Your LCP (with Visuals) (ste)563
how-tos, web-vitals, optimization
Optimising Largest Contentful Paint (css)562
web-vitals
Picture Perfect Images With the Modern “<img>” Element (add)561
images, html, web-vitals
Speed Needs Design, or: You Can’t Delight Users You’ve Annoyed560
design, user-experience
The Web Is for Everyone: Our Vision for the Evolution of the Web (moz)559
web, outlooks, privacy, security, accessibility, user-experience
Optimising Core Web Vitals on SPAs (sim)558
web-vitals, single-page-apps, optimization
Improving Your User Experience to Reduce Bounce Rates (uxm)557
user-experience, usability, seo
Performance Tests on Common JavaScript Array Methods (hac)556
testing, javascript, arrays
Optimizing SVG Patterns to Their Smallest Size (css)555
svg, images
The Impact That High Quality Mark-Up Can Have on Accessibility, Performance, and Discoverability (vle)554
videos, html, accessibility
The Weirdly Obscure Art of Streamed HTML553
html, streaming
Making the World’s Fastest Website, and Other Mistakes552
mistakes
Ten Years of Page Bloat: What Have We Learned? (spe)551
web-vitals, user-experience
7 Ways to Achieve a Faster Core Web Vitals Score (hac)550
web-vitals
Performance Signals for Customizing Website UX (tun/sma)549
user-experience, web-vitals, customization
A New Speed Milestone for Chrome548
browsers, chrome
Should Frontend Devs Care About Performance?547
Top 2021 CSS Frameworks Report: The CSS File Sizes (cit)546
studies, research, frameworks, css
How to Make MPAs That Are as Fast as SPAs (cfe)545
how-tos, multi-page-apps, single-page-apps
Improving a CDN’s Cache Hit Ratio (erw)544
content-delivery, caching
Minimizing Google Fonts by Only Loading It for Certain Characters (ami)543
typography, google, fonts, minimalism
Core Web Vitals: What Next? (moz)542
web-vitals, seo
The Difference Between Brotli and Gzip Compression Algorithms to Speed Up Your Site541
compression, brotli, gzip
This Is Why Your Node.js Application Is Slow540
nodejs
Reducing the Web’s Carbon Footprint: Optimizing Social Media Embeds (mic/sma)539
social-media, embed-code, sustainability
Improving JavaScript Bundle Performance With Code-Splitting (cod/sma)538
javascript, bundling, code-splitting, optimization
Speed Matters, but It Isn’t Everything537
user-experience, metrics
Caching Header Best Practices (sim)536
caching, http, http-headers, best-practices
Optimize Your PNGs With Oxipng and pre-commit (ada)535
images, png, compression, tooling
Big Images, Blazingly Fast534
images, quality
How to Avoid Layout Shifts Caused by Web Fonts (sim)533
how-tos, user-experience, fonts
Website Performance and the Planet (fer)532
sustainability, caching
Memory Leaks: The Forgotten Side of Web Performance (nol)531
memory
Improving WordPress Performance: An Open Letter (erw)530
open-letters, wordpress, css, javascript
A Unified Theory of Web Performance (sli/per)529
Exposing Mid-Resource LCP Values (per)528
web-vitals
Page Visibility: If a Tree Falls in the Forest… (pau/per)527
web-vitals, user-experience
Using Diagnostic Metrics (ann/per)526
metrics
Practical Tips for Load-Testing Web Applications (per)525
testing, tips-and-tricks, web-apps
The Business Case for Performance (per)524
economics
Faster Websites by Using Less HTML (j9t)523
cross-posts, html, optimization, minimalism
Redirect Liquidation (tim/per)522
optimization, redirecting
Frontend Web Performance: The Essentials521
fundamentals, rendering
Web Performance, Core Web Vitals, and Vanity Metrics (per)520
web-vitals, metrics
Hands On With the New Responsiveness Metrics (per)519
responsive-design, metrics
Explain Like I’m Five: Web Performance Optimization (sto/per)518
optimization
Performance Implications of JavaScript Errors (per)517
javascript, errors
Defer Non-Critical Resources (per)516
html
Caching: Understanding the Scope (per)515
caching
Test Your Product on a Crappy Laptop (eri/css)514
testing, usability
HTTP Compression (per)513
http, protocols, compression
Have Core Web Vitals Made the Web Faster? (tun/per)512
web-vitals
Plugging Memory Leaks in Your App (sto/per)511
memory
Request for a General Theory of Web Performance (per)510
Page Weight (htt)509
web-almanac, studies, research, metrics
Smashing Podcast Episode 44 With Chris Ferdinandi: Is the Web Dead? (cfe+/sma)508
podcasts, interviews, web-platform, standards, tooling, developer-experience
7 Ways to Improve Node.js Performance at Scale (app)507
nodejs, optimization
How JavaScript Engines Achieve Great Performance506
javascript, javascript-engines
Improving the Performance of Wix Websites (Case Study) (sma)505
monitoring, culture, case-studies
Designing Sustainable Websites (ger)504
sustainability, software-design
Performance (sia/htt)503
web-almanac, studies, research, metrics, user-experience
Get Your “Head” Straight (css/btc)502
videos, html
Your CSS Is an Interface (eri)501
css
Why IndexedDB Is Slow and What to Use Instead500
databases, indexeddb, javascript
Why Your Website Should Not Use Dithered Images499
images, dithering, compression
Using Web Workers to Boost Third-Party Script Performance (log)498
web-workers, javascript
Chrome DevTools: Record and Playback Your User Journeys497
dev-tools, user-experience, browsers, chrome
How to Implement Memoization in React to Improve Performance496
how-tos, react, memoization, optimization
Everything You Have to Know About Core Web Vitals (fox/cal)495
web-vitals
Best Practices on Embedding Third-Party Web Widgets494
embed-code, best-practices
Web Performance Metrics Cheatsheet (ire)493
metrics, cheat-sheets
Building an Effective Image Component492
components, javascript
Optimizing Resource Loading With the Fetch Priority API (add+)491
data-fetching, apis, optimization
New HTTP Standards for Caching on the Modern Web (pim)490
http, protocols, caching, standards
How I Made Google’s Data Grid Scroll 10× Faster With One Line of CSS489
css
My Challenge to the Web Performance Community (phi)488
jsPerf—Online JavaScript Performance Benchmark487
websites, javascript
Using Modern Image Formats: AVIF and WebP (add/sma)486
images, avif, webp, jpeg, png, comparisons, compression
Faster React Apps With Memoization485
react, memoization
ct.css—Let’s Take a Look Inside Your “<head>” (css)484
css, debugging
Small Bundles, Fast Pages: What to Do With Too Much JavaScript (cal)483
javascript, bundling
Optimizing Images on the Web482
images, cloudflare
Vanilla JS Is a Web Performance Decision (cfe)481
javascript
Blowing Up HTML Size With Responsive Images (deb)480
html, images, responsive-design
Designing for Long Waits and Interruptions: Mitigating Breaks in Workflow in Complex Application Design (nng)479
user-experience, complexity
Writing High-Performance JavaScript (cfe)478
javascript
What Are the Web Performance Metrics That Actually Matter? (cfe)477
metrics
Lighthouse Scores Do Not Affect Google Search/SEO (erw)476
lighthouse, google, search, seo
HTTP/3: Performance Improvements (pro/sma)475
http, protocols
Does Shadow DOM Improve Style Performance? (nol)474
dom, shadow-dom, rendering
Big O, Code Efficiency Analysis473
algorithms
“<Lazy>” Rendering in Vue to Improve Performance472
vuejs, client-side-rendering, optimization
A Performance-Focused Workflow Based on Google Tools471
web-vitals, tooling, google
How We Reduced Next.js Page Size by 3.5× and Achieved a 98 Lighthouse Score470
nextjs, lighthouse, case-studies
CSS Architecture and Performance in Micro Frontends469
css, architecture, micro-frontends
Learnings From a WebPageTest Session on CSS-Tricks (chr/css)468
webpagetest
A Beginner’s Guide to Lighthouse467
guides, lighthouse, web-vitals
How to Eliminate Render-Blocking Resources: A Deep Dive (sia)466
how-tos, rendering
What Is Tree Shaking? (cfe)465
javascript, concepts, tree-shaking
The Performance Effects of Too Much Lazy-Loading (rvi+)464
web-vitals, lazy-loading
Performance Design: The Illusion of Speed463
user-experience
Resource Inlining in JavaScript Frameworks (mge)462
javascript, frameworks, web-vitals
Making the Web—Faster461
web, developer-experience, principles
Half the Size of Images by Optimising for High Density Displays (jaf)460
html, images
Serving Sharp Images to High Density Screens (jaf)459
images
What Can the HTTP Archive Tell Us About Largest Contentful Paint? (pau)458
Using AVIF to Compress Images on Your Site457
images, avif, compression
Best Practices for Fonts (tun)456
fonts, best-practices
How to Fix Cumulative Layout Shift (CLS) Issues (tun/sma)455
how-tos, web-vitals
CSS for Web Vitals (una)454
css, web-vitals
Elasticsearch Boolean Query Performance (ast)453
tooling, search
Tree-Shaking: A Reference Guide (ati/sma)452
guides, optimization, javascript, tree-shaking
Reducing HTML Payload With Next.js (Case Study) (sma)451
nextjs, html, case-studies
An Introduction to Performance Budgets450
introductions, performance-budgets, metrics
The Lazy-Loading Property Pattern in JavaScript (nza)449
javascript, software-design-patterns, lazy-loading
9 Principles of Good Web Design448
design, principles, simplicity, navigation, content, layout, mobile
Bypassing Cookie Consent Banners in Lighthouse and WebPageTest (and)447
consent-management, cookies, lighthouse, webpagetest, testing
The 5-Hour CDN (fly)446
content-delivery
Measuring Web Performance in Mobile Safari (css)445
testing, mobile, browsers, safari
39 Page Speed Optimization Tips (to Crush Your Load Time)444
optimization, tips-and-tricks
What About Ember? (tka)443
emberjs
Testing Performance (kel)442
testing
Front-End Performance 2021: Build Optimizations (sma)441
checklists, link-lists, building
Front-End Performance 2021: Delivery Optimizations (sma)440
checklists, link-lists
Front-End Performance 2021: Assets Optimizations (sma)439
checklists, link-lists, compression, images
HTML and CSS Techniques to Reduce Your JavaScript (per)438
html, css, javascript
Continuous Performance Analysis With Lighthouse CI and GitHub Actions (css)437
lighthouse, github-actions
Optimizing Image Depth (mey/css)436
images, quality, optimization
Page Weight (htt)435
web-almanac, studies, research, metrics
Time to Say Goodbye to Google Fonts: Cache Performance434
google, fonts, caching
Ruthlessly Eliminating Layout Shift on netlify.com (zac)433
netlify, web-vitals, optimization
Best Practices for Inclusive Textual Websites432
security, accessibility, best-practices
Measuring Core Web Vitals With Sentry (fon/css)431
web-vitals, tooling
Warp: Improved JS Performance in Firefox 83 (jan/moz)430
firefox, browsers, javascript, spidermonkey, javascript-engines
The What, Why, and How of Using a Skeleton Loading Screen (tre)429
placeholders, react
Core Web Vitals: A Guide to Google’s Web Performance Metrics (cra)428
guides, google, web-vitals
Signed Exchanges (SXGs) (twi)427
authentication, signed-exchanges, web-packaging
How to Create High-Performance CSS Animations426
how-tos, css, animations
Reducing the Site Speed Impact of Third-Party Tags (and)425
embed-code
Enforcing Performance Budgets With Webpack (css)424
performance-budgets, webpack
AVIF Has Landed (jaf)423
images, avif, quality, jpeg, webp, svg, png, comparisons
Loading Third-Party JavaScript (add)422
javascript
Performance Is an Issue of Equity (clo)421
accessibility
Lazy Loading Images in Svelte (css)420
images, lazy-loading, svelte
Methods of Improving and Optimizing Performance in React Apps (sma)419
react, optimization
We Need More Inclusive Web Performance Metrics (sco)418
metrics, dei
How I Used Brotli to Get Even Smaller CSS and JavaScript Files at CDN Scale (css)417
compression, brotli
5 Projects to Help You Master Modern CSS (cra)416
css, print, forms
Core Web Vitals (chr/css)415
web-vitals, metrics
On Fixed Elements and Backgrounds (hui)414
css, backgrounds, positioning, scrolling
Speed Up Google Fonts (css)413
google, fonts
The Need for Speed, 23 Years Later (nng)412
user-experience, history
Maybe You Don’t Need That SPA411
single-page-apps, javascript, react, marko
prerender.js (chr/css)410
libraries
Introducing Web Vitals: Essential Metrics for a Healthy Site409
introductions, web-vitals, metrics
Real-World Effectiveness of Brotli (css)408
compression, brotli, comparisons
The Cost of JavaScript Frameworks (tka)407
javascript, frameworks, metrics, jquery, vuejs, angular, react
Start Render: The Web Performance Metric That Heralds the End of the Blank Page406
metrics, web-vitals
Performance Tips: Minifying HTML, CSS, and JS405
videos, html, css, javascript, minification, tips-and-tricks
Setting Height and Width on Images Is Important Again (tun/sma)404
html, images, web-vitals
Improving Perceived Performance With the CSS “font-display” Property (the)403
css, fonts
Encrypting DNS Query Bad for Performance? (erw)402
dns, http, encryption, security
Page Builders Might Not Be a Good Idea (cit)401
maintainability, consistency, quality
Do This to Improve Image Loading on Your Website (fon/css)400
images, html
Google Tag Manager vs. Page Speed: The Impact and How to Improve399
google, tag-management, analytics, optimization
The Web in 2020: Extensibility and Interoperability (una/css)398
web-platform, extensibility, interoperability, houdini, variable-fonts, custom-properties, logical-properties, web-components, media-queries
Should You Self-Host Google Fonts? (tun)397
fonts, google, self-hosting
Improving Site Performance With Webpack Tree Shaking396
optimization, webpack, tree-shaking
Performance Budgets, Pragmatically (css)395
performance-budgets
Putting Devs Before Users: How Frameworks Destroyed Web Performance394
frameworks, developer-experience
An HTML Optimizer’s Config for HTML Minifier (j9t)393
html, html-minifier, minification, optimization, configuration, minimalism
How Do You Remove Unused CSS From a Site? (chr/css)392
css, tooling
Stop Using Ridiculously Low DNS TTLs (jed)391
dns, content-delivery, load-balancing
Speed Up Your Website With WebP (sma)390
optimization, webp, images
A Guide to Optimizing Images for Mobile (sma)389
guides, images, optimization, mobile
On Writing Better Markup (j9t)388
html, quality, maintainability, terminology
Workflow Considerations for Using an Image Management Service (chr/css)387
images, tooling, content-delivery
Recipes for Performance Testing Single Page Applications in Webpagetest (pha/css)386
testing, single-page-apps, tooling, webpagetest
Some HTML Is “Optional” (chr/css)385
html, standards
Faster Image Loading With Embedded Image Previews (sma)384
images, lazy-loading, techniques, javascript
Other Ways to SPAs (chr/css)383
single-page-apps, tooling
Lazy Load Embedded YouTube Videos (chr/css)382
youtube, lazy-loading, embed-code
Optional HTML: Everything You Need to Know (j9t)381
html, minimalism
Accessibility and Web Performance Are Not Features, They’re the Baseline (fon/css)380
accessibility, amp, user-experience
Handling Unused CSS in Sass to Improve Performance (sma)379
css, sass, optimization
What CMS to Use for Optimale TTFB (and Site Speed?) (erw)378
content-management, metrics, wp-engine, automattic
I Used the Web for a Day on a 50 MB Budget (sma)377
mobile
How Google Pagespeed Works: Improve Your Score and Search Engine Ranking (ben/css)376
google, tooling, lighthouse, seo
Browsers Are Pretty Good at Loading Pages, It Turns Out375
javascript, rendering, browsers
The Simplest Way to Load CSS Asynchronously (sco)374
css, asynchrony
Shifting the Performance Burden (sco)373
Optimizing Google Fonts Performance (sma)372
google, fonts, optimization
How to Increase Your Page Size by 1,500% With Webpack and Vue (bur/css)371
webpack, vuejs
The Problem With Web Development Checklists, or: The Frontend Checklist, Revised (j9t)370
checklists, html, accessibility, seo, social-media
Responsible JavaScript (mal/ali)369
javascript, tree-shaking, code-splitting, embed-code, transpiling, tooling
Image Optimization in WordPress (sma)368
wordpress, images, optimization
Self-Host Your Static Assets (css)367
self-hosting, caching
Characteristics of a Strong Performance Culture (tka)366
culture, principles
Understanding Image Compression: Tooling and Context (j9t)365
images, compression, tooling
The Scoville Scale of Web Font Loading Opinions (zac/btc)364
videos, fonts
Browser Resource Hints: “preload”, “prefetch”, and “preconnect” (mat/deb)363
hints, html, http-headers, http, preloading
Optimizing Performance With Resource Hints (dre/sma)362
hints, optimization
The Serif Tax (chr/css)361
fonts, ttf
Improving Perceived Performance With the Link “rel=preconnect” HTTP Header (and)360
http, http-headers, hints
“Cache-Control” for Civilians (css)359
caching, http
How to Avoid DOM Blocking in JavaScript (cra)358
how-tos, dom, javascript
Rendering on the Web (add+)357
server-side-rendering, client-side-rendering, rendering, hydration, seo
8 Reasons Why You’re Doing SEO Wrong (erw)356
seo
HTML and Performance: Leave Out Optional Tags and Quotes (j9t)355
html
The Ethics of Web Performance (tka)354
ethics, accessibility
The Elements of UI Engineering (dan)353
user-experience, consistency, navigation, prioritization, accessibility, internationalization, resilience
Static vs. Server Rendering352
rendering, comparisons, react
Speed Up Next-Page Navigations With Prefetching (add)351
hints, html, http-headers, http, webpack
Keeping Sass Simple and Speedy on Eleventy (phi)350
sass, eleventy
On Visions for Performance, or: Performance Optimization Is a Process (j9t)349
optimization, outlooks, processes
Tips to Help You Write Faster MySQL Queries348
mysql, databases, tips-and-tricks
Front-End Developers Have to Manage the Loading Experience (chr/css)347
user-experience
Performance Rule #1: Do What You Need to Do—But Not More (j9t)346
simplicity
PageSpeed Insights, Now Powered by Lighthouse (che+)345
tooling, lighthouse
A Netflix Web Performance Case Study (add)344
netflix, case-studies
Reduce JavaScript Payloads With Code Splitting (mal)343
javascript, code-splitting
Improve Animated GIF Performance With HTML5 Video (sma)342
images, gif, multimedia
Performance Budgets 101341
introductions, performance-budgets, metrics
A Guide to Caching in WordPress340
guides, wordpress, caching, plugins
How to Configure Lighthouse for Balanced Quality Websites (j9t)339
how-tos, lighthouse, configuration, quality
A Minimal JavaScript Setup (css)338
javascript, conventions, naming, scope, maintainability, examples
Chrome’s Noscript Intervention (tka)337
chrome, browsers, javascript, mobile
20 Tips for Optimizing CSS Performance (cra)336
css, optimization, tips-and-tricks
Variable Fonts: What They Are, and How to Use Them335
how-tos, fonts, variable-fonts
Browser Painting and Considerations for Web Performance (css)334
browsers, browser-engines, painting, rendering
Slow Websites (geo/css)333
performance-budgets
The Cost of JavaScript in 2018 (add)332
javascript, code-splitting, lazy-loading, performance-budgets, bundling
HTTP/2: The Difference Between HTTP/1.1, Benefits, and How to Use It331
protocols, http, comparisons
Delivering WordPress in 7 KB (css)330
wordpress, themes
HTTP/2: Background, Performance Benefits, and Implementations329
protocols, http
Improving Performance Perception: On-Demand Image Resizing (swa)328
optimization, images, resizing, html
Tips for Writing Better Performing PHP Code327
php, tips-and-tricks
How I Dropped 250 KB of Dead CSS Weight With PurgeCSS (sar)326
css, purgecss
The Four Big Ways Jetpack Helps With Image Performance (css)325
wordpress, plugins, images
Here’s the Thing About “Unused CSS” Tools (chr/css)324
css, quality, tooling
7 Performance Tips for Jank-Free JavaScript Animations323
javascript, animations, tips-and-tricks
Making Your Website Faster and Safer With Cloudflare322
caching, security, cloudflare
How Do You Know Your Website Is a Success? (sma)321
product-management, strategies, metrics, user-experience, content, microcontent, navigation, testing
Page Transitions for Everyone (css)320
design, user-experience, animations, transitions, caching
Introducing Last Painted Hero (spe)319
introductions
How Fast Is AMP Really? (tka)318
amp, metrics
Three Techniques for Performant Custom Font Usage (oll/css)317
fonts, techniques, flash-of-x
AMP News (chr/css)316
amp, community
Website Performance—Does Your Hosting Plan Matter?315
hosting
Why Fast Matters (css/btc)314
videos, economics
Finding Dead CSS (css)313
css, maintenance
How to Optimize CSS and JS for Faster Sites312
how-tos, css, javascript, minification, optimization
SYN Packet Handling in the Wild311
tcp, protocols, network
Performance of CSS Selectors Is Still Irrelevant (j9t)310
css, selectors
Progressive Web Apps: A Crash Course309
crash-courses, web-apps, progressive-web-apps, lighthouse
Optimizing CSS: Tweaking Animation Performance With DevTools308
css, animations, optimization, dev-tools, browsers, firefox
On Big Picture Thinking in Web Development (j9t)307
user-experience, maintainability, consistency, accessibility, outlooks
How to Optimize SQL Queries for Faster Sites306
how-tos, sql, mysql, databases, caching, optimization
Understanding the “Vary” Header (tri/sma)305
http, http-headers, caching
The Front-End Checklist (the)304
websites, checklists, html, css, javascript, images, accessibility, seo
The State of the Web (fox)303
web
Using the Paint Timing API (mal/css)302
apis, time, painting, rendering, javascript
(Now More Than Ever) You Might Not Need jQuery (oll/css)301
jquery, javascript, ajax, comparisons, examples
Three Reasons Why You Should Care About Google Lighthouse (fox/cal)300
lighthouse, google
What Google AMP Means for the JavaScript Community299
amp, google, javascript, open-web
What Is the Future of Front End Web Development? (chr/css)298
outlooks, user-experience, javascript, documentation, native, web, urls, css, preprocessors, html, building, tooling
What We Talk About When We Talk About Web Performance (btc)297
videos
Let the Content Delivery Network Optimize Your Images (jon/sma)296
content-delivery, images, optimization
Optimizing Web Fonts for Performance: The State of the Art295
fonts, optimization
Moving From PHP (Laravel) to Go (dvk)294
migrating, php, laravel, go, metrics
Brotli and Static Compression (mal/css)293
compression, brotli, gzip, comparisons
What Are Performance Budgets and Why You Should Use One292
performance-budgets
A Comprehensive Guide to HTTP/2 Server Push (mal/sma)291
guides, http, protocols, servers
Cut the File Size With These Three HTML Minification Tools290
minification, tooling, html, minimize, html-minifier, compression, comparisons, gzip
Guetzli, Google’s New JPEG Encoder (tel)289
images, jpeg, compression, tooling
AMP and the Web (tka)288
amp, web-platform, web
Considering How We Use HTTP/2 (mal/ali)287
optimization, http, protocols
Using HTTP/2 Responsibly: Adapting for Users (mal/ali)286
http, protocols, support, servers
11 Tips to Optimize JavaScript and Improve Website Loading and Rendering Speeds285
javascript, optimization, minification, compression, caching
The Web, Worldwide (tka)284
websites, metrics
A Checklist for Website Reviews (hcr)283
checklists, browsers, seo, accessibility, security
Performant Parallaxing (aer)282
scrolling, css, effects, parallax, positioning
Performance: Shame, Hope, Nuance, and Interesting Problems (bka)281
The Joy of Optimizing (una/btc)280
videos, images, optimization
Web Packaging Format279
web-packaging
Next Generation Server Compression With Brotli (mal/sma)278
compression, brotli, gzip, comparisons
When Is the Right Time to Think About Web Performance? (fon/css)277
processes
High Performance SVGs (sar/css)276
svg, images, tooling, optimization
The Performance Benefits of “rel=noopener” (jaf)275
html, links, security
Ways You Need to Tell the Browser How to Optimize (chr/css)274
browsers, css, optimization
Accessibility and Performance (mar)273
accessibility, javascript, optimization
Service Workers and PWAs: It’s About Reliable Performance, Not “Offline” (sli)272
web-apps, progressive-web-apps, web-workers, javascript, reliability
6 SEO Trends to Watch for in 2016271
trends, seo, content, marketing, mobile, social-media
How to Optimize Mobile Performance (sma)270
how-tos, mobile, optimization, performance-budgets, content-management, caching, testing
CPP: A Standardized Alternative to AMP (tka)269
amp, policies
Critical Metric: Critical Resources268
metrics, css, javascript
Lazy-Loading Images: How Not to Really Annoy Your Users267
images, lazy-loading, jquery
Why You Should Choose Your Own HTTPS (hel)266
http, content-delivery, tooling, cloudflare
10 Web Predictions for 2016 (cra)265
web, outlooks, security, site-generators, browsers, css, mobile, webassembly, seo
The Problem With Progressive Enhancement264
progressive-enhancement, javascript, resilience
Critical Web Fonts (zac)263
fonts, css, flash-of-x, critical-path, metrics
The Cost of Frameworks Recap (chr/css)262
frameworks
Loading Web Fonts With the Web Font Loader (fon/css)261
fonts, flash-of-x, user-experience
JavaScript Frameworks and Mobile Performance260
javascript, frameworks, mobile
Design + Performance (zem/btc)259
videos, design, user-experience
HTTP/2: The Pros, the Cons, and What You Need to Know258
protocols, http
The 5 Biggest Killers for Your WordPress Speed257
wordpress, caching, images, minification
Performance Budgets in Action (spe)256
performance-budgets
Using Web Fonts the Best Way (in 2015) (hel)255
fonts
AMP and Incentives (tka)254
amp, web
Introducing RAIL: A User-Centric Model for Performance (pau/sma)253
introductions, metrics, user-experience
Factors Affecting Website Performance252
network, browsers, memory, servers, images, multimedia
Preloading Images in Parallel With Promises (kit)251
javascript, promises, images, preloading
Delivering Responsibly (sco/btc)250
videos, usability, accessibility, sustainability
10 Common Mistakes Web Developers Make249
mistakes, html, css, javascript, career
5 Easy Performance Tweaks for Node.js Express (cra)248
nodejs, express, optimization, compression
Strategies for Cache-Busting CSS (chr/css)247
css, caching, tooling, strategies
Understanding Critical CSS (sma)246
css, critical-path
Mastering Image Optimization in WordPress245
wordpress, images, optimization
React + Performance = ? (aer)244
react, metrics
Page Bloat Update: The Average Web Page Is More Than 2 MB in Size (tam)243
metrics, comparisons
Performance Tools (fon/css)242
tooling, content-delivery, testing, dev-tools, images, css, javascript, optimization, link-lists
Choosing Performance (tka)241
facebook+meta