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#
The 9 Most Effective Core Web Vitals Opportunities of 2023 (tun)711
videos, web-vitals
Advancing Interaction to Next Paint (rvi+)710
web-vitals
Introducing INP to Core Web Vitals709
introductions, web-vitals, search, seo
How to Optimize Web Responsiveness With Interaction to Next Paint (ann)708
videos, how-tos, web-vitals
Diagnose Slow Interactions in the Lab (mal)707
web-vitals
Optimize Input Delay (mal)706
web-vitals, optimization
Find Slow Interactions in the Field (mal)705
web-vitals, auditing
How Large DOM Sizes Affect Interactivity, and What You Can Do About It (mal)704
dom, html, optimization
Script Evaluation and Long Tasks (mal)703
javascript, web-vitals
Client-Side Rendering of HTML and Interactivity (mal)702
html, client-side-rendering
Pay Attention to Web Performance Metrics to Improve the UX (uxm)701
metrics, user-experience, web-vitals, optimization
5 Best Practices to Sustainably Improve Core Web Vitals (ben/cal)700
web-vitals, best-practices
The Intersectionality of Web Performance (ada)699
sustainability, dei
Make Your Website Load Fast by Optimizing Request Priorities (mat/deb)698
optimization, network
A Complete Guide to Performance Budgets (spe)697
guides, performance-budgets, metrics
Load Websites Faster With Code Splitting696
code-splitting, react
CDNs: Speed Up Performance by Reducing Latency (aus)695
content-delivery
Practical Guide to Not Blocking the Event Loop694
guides, javascript, event-loop, events
Reducing the Cost of String Serialization in Node.js Core (yag)693
nodejs, strings
Frontend Web Performance Checklist (jac)692
checklists
Exploring the Potential of Web Workers for Multithreading on the Web (sma)691
web-workers, multithreading, javascript
Intro to Runtime Performance in the Chrome DevTools Performance Panel (ann/thi)690
videos, introductions, dev-tools, browsers, chrome
DevTools: A Better Way to Visualize Your JavaScript689
dev-tools, visualization, browsers, lighthouse, chrome, edge
Serving Less Data to Users With the “prefers-reduced-data” Media Query (sea)688
css, media-queries, sustainability
Speeding Up the JavaScript Ecosystem—Draft-js Emoji Plugin (mar)687
javascript, plugins
Costly CSS Properties and How to Optimize Them686
css, optimization
Understanding CSS Preload and Other Resource Hints (log)685
css, hints, preloading
Load Balancing (sam)684
load-balancing, visualization, architecture
The Performance Golden Rule Revisited (tka)683
metrics
The Real Difference Between “useMemo” and “Memo” in React682
react, hooks, examples
Slow Start and Congestion Control (Browser Networking)681
protocols, tcp
7 Tricks to Take the Performance of Your Website to the Moon680
minification, tree-shaking, tips-and-tricks
10 Ways to Hide Elements in CSS (cra)679
hiding, css, accessibility
Flutter Performance Optimization Techniques and Best Practices678
flutter, optimization, best-practices
Defaulting on Single Page Applications (SPA) (zac)677
single-page-apps, javascript
Senior Engineering Strategies for Advanced React and TypeScript (tec)676
strategies, react, typescript, architecture, testing, accessibility, security, maintenance
The Ultimate Guide to Image Optimisation (fox/cal)675
guides, images, compression, optimization
Speeding Up the JavaScript Ecosystem—npm Scripts (mar)674
javascript, bundling, npm
2023 Web Framework Performance Report673
frameworks, astro, sveltekit, gatsby, remix, wordpress, nextjs, nuxt, comparisons
Client-Side JavaScript and React Criticism: What Comes Next? (mol)672
javascript, react, accessibility, resilience, progressive-enhancement
Optimising Large Contentful Paint (css/btc)671
videos, web-vitals, optimization
The JavaScript Site Generator Review, 2023 (zac)670
site-generators, comparisons, astro, eleventy, gatsby, nextjs, nuxt, remix, sveltekit
An Approach to Lazy Loading Custom Elements (css)669
web-components, lazy-loading
This Is Why Performance Matters (bel)668
javascript, user-experience
Caching at DEV667
case-studies, caching
What’s New in Lighthouse 10666
release-notes, lighthouse
Speeding Up the JavaScript Ecosystem—ESLint (mar)665
javascript, eslint, linting
The Gotcha With Animating Custom Properties (bra)664
css, animations, custom-properties
Speed for Who? (bel)663
frameworks, developer-experience, user-experience
Monitoring Node.js Performance (ano)662
nodejs, monitoring, tooling, nsolid
Optimal Images in HTML (ste/bui)661
html, images, backgrounds, optimization
Your Web Performance Is Too Reactive; It’s Time to Do More Than Put Out Fires (fox/cal)660
The Modern Way of Serving Images (kur)659
images, html
How to Review a Web Site (uxm)658
how-tos, user-experience, seo
Optimize Time to First Byte (mal)657
optimization
Why We Switched CDNs: How Google’s Core Web Vitals Led Us to Cloudflare Pages656
content-delivery, web-vitals, cloudflare
The Truth About CSS Selector Performance (pat)655
css, selectors
Optimizing the Image Element LCP (sma)654
web-vitals, images
Speeding Up the JavaScript Ecosystem—Module Resolution (mar)653
javascript, modules, esm, commonjs
Why Not “document.write()”? (css)652
javascript
Our Top Core Web Vitals Recommendations for 2023 (phi+)651
web-vitals, best-practices
Why Web Performance Still Matters in 2023 (sia)650
Priority Hints and Optimizing LCP (kev)649
web-vitals, optimization, hints
Performance Culture Through the Looking-Glass (per)648
videos, culture
The RUM Archive and Benford’s Law (per)647
HTTP/3 Prioritization Demystified (pro/per)646
http, protocols
Signals: The Nitty-Gritty (web/per)645
javascript, signals
Bad Performance Is Bad Accessibility (bru)644
accessibility
The Performance Inequality Gap, 2023 (sli)643
javascript, metrics
Beating Latency on Scalemates.com (tim/per)642
optimization
Using Inline JavaScript Modules to Prevent CSS Blockage (sto/per)641
javascript, css
An HTML-First Mental Model (noa/per)640
html, dom
Get Off the Main Thread With an Inline Web Worker: An Example (sto/per)639
javascript, web-workers, examples
LCP(FE) (tim/per)638
web-vitals
Web Performance and Compression (per)637
compression
Optimize Interaction to Next Paint (mal+)636
optimization, web-vitals
Adding Complementary Performance Data to Your Site (mat)635
apis
Accessibility: The Land That “Time to Interactive” Forgot (tin/per)634
videos, accessibility
Reduce Image Sizes by Removing Metadata (per)633
images, metadata, optimization
Fast Is Good, Instant Is Better (tun/per)632
caching
Prerender Pages in Chrome for Instant Page Navigations (tun)631
browsers, chrome
7 Website Performance Metrics to Track for Better UX (cal)630
user-experience, metrics
Developing Faster JavaScript Apps: The Ultimate Guide to Web Workers (cra)629
guides, web-apps, web-workers, javascript
Speeding Up the JavaScript Ecosystem—One Library at a Time (mar)628
javascript, libraries
Minification and Cache Directives for the Most Popular Websites of the Internet (dvk)627
minification, tooling, lightning-css, html-minifier, caching, metrics
Lazy Loading Images in HTML (sim)626
html, lazy-loading
A Guide to Image Optimization on Jamstack Sites (daw/sma)625
guides, images, compression, optimization, tech-stacks, jamstack
Improving React Interaction Times by 4×624
react, optimization
Early Learnings for Early Hints at Shopify (sia/per)623
videos, case-studies, shopify, hints
Client-Side Routing Without the JavaScript (rya/thi)622
javascript, frameworks
6 Steps to Improve HTML Images for Users and Developers (aus)621
html, images, responsive-design
HTML and CSS Features, Tips for a 10× Faster Page Loading Speed620
html, css, tips-and-tricks
Is Turbopack Really 10× Faster Than Vite? (eva)619
tooling, bundling, turbopack, vite
CSS Runtime Performance618
slides, css
A Beginner’s Guide to Chrome Tracing (nol)617
guides, browsers, chrome, tracing
Conditionally Adaptive CSS—Browser Behavior That Might Improve Your Performance (pep)616
css, responsive-design
Performance (rvi/htt)615
web-almanac, studies, research, metrics, web-vitals
How We Improved React Loading Times by 70% With Next.js614
react, nextjs, case-studies
Which Serverless Edge Platform Has the Fastest Git Deployments? (den)613
serverless, edge-computing, git, deploying
CDN (htt)612
web-almanac, studies, research, metrics, content-delivery, tooling
Speeding Up Async Snippets (css)611
javascript, asynchronicity
How to Animate CSS Box Shadows and Optimize Performance610
how-tos, css, animations, shadows
Sustainable Web Development Strategies Within an Organization (mic/sma)609
sustainability, optimization
SVG Sprites: Old-School, Modern, Unknown, and Forgotten (pep)608
svg, images, sprites
How to Optimize Resource Loading With the “fetchpriority” Attribute (mat/deb)607
how-tos, html, optimization
Optimize Long Tasks (mal)606
javascript, optimization
GIFs Without the .gif: The Most Performant Image and Video Options Right Now (oll/css)605
multimedia, images, gif, html
Performance Budgets: The Easiest Way to a Faster Site (fox/cal)604
performance-budgets
Five Data-Loading Patterns to Boost Web Performance (sma)603
Page Weight (jam/htt)602
web-almanac, studies, research, metrics
Element Timing: One True Metric to Rule Them All? (spe)601
time, apis, metrics
Will Serving Real HTML Content Make a Website Faster? Let’s Experiment!600
studies, research, html
Total Blocking Time: A Short and Sweet Guide for Happier Users (ben/cal)599
javascript
How to Substantially Slow Down Your Node.js Server598
how-tos, nodejs
Your Next.js Bundle Will Thank You597
nextjs, bundling
How to Improve Largest Contentful Paint for Faster Load Times (fox/cal)596
how-tos, web-vitals, optimization
Critical CSS? Not So Fast! (css)595
css, critical-path
Disabled JavaScript Turns Off Native Lazy Loading (ste)594
javascript, html, lazy-loading
Why Your Website Should Be Under 14 kB in Size593
protocols
Measure What You Impact, Not What You Influence (css)592
metrics, optimization
Optimize Data Fetching591
data-fetching
Can Browsers Optimize the Loading of Third-Party Resources? (add)590
browsers, embed-code
Tip: Use “fetchpriority=high” to Load Your LCP Hero Image Sooner (add)589
html, web-vitals
(Re-)Introducing Gatsby, a Reactive Site Generator588
gatsby, react, reactivity, site-generators, introductions
How and Why We Removed jQuery From GOV.UK587
jquery, maintainability
Core Web Vitals Tools to Boost Your Web Performance Scores (sma)586
web-vitals, tooling
Making a Website Under 1 kB585
minimalism, html
Which Generator Builds Markdown the Fastest? (zac)584
site-generators, markdown, comparisons
500 ms to 1.7 ms in React: A Journey and a Checklist583
react
Priority Hints—What Your Browser Doesn’t Know (Yet)582
hints
Fix Web Performance for the Long-Term (sia)581
testing, processes
Powerful Image Optimization Tools (lou/sma)580
link-lists, images, compression, tooling
Can SVG Symbols Affect Web Performance?579
svg, images
Avoiding “<img>” Layout Shifts: “aspect-ratio” vs. “width” and “height” Attributes (jaf)578
web-vitals, comparisons, html, attributes, aspect-ratio, css
Frontend Web Performance: The Essentials577
fundamentals, javascript
Faster WordPress Rendering With 3 Lines of Configuration (sto)576
wordpress, css, http, configuration
A CLS Punishment for Progressive Enhancement? (bel/pic)575
web-vitals, progressive-enhancement
Image Guard (j9t)574
packages, npm, images, compression, jpeg, png, gif, webp, avif
Everything You Need to Know About Web Performance (in 5 Minutes)573
web-vitals, compression
Style Scoping Versus Shadow DOM: Which Is Fastest? (nol)572
selectors, scope, dom, shadow-dom, comparisons, metrics
How to Remove 99% of JavaScript From Main Thread (wea)571
videos, how-tos, javascript
What We’ve Learned From One Year of Real User Monitoring Data on GOV.UK570
monitoring, metrics
Measuring the Performance of Typefaces for Users II (sma)569
typography, fonts
Measuring the Performance of Typefaces for Users (sma)568
typography, fonts
Don’t Sink Your Website With Third Parties (sma)567
embed-code, dependencies
Two Lines of CSS That Boosts 7× Rendering Performance566
css, rendering
Conditionally Loading CSS or Any Resource Using Media Queries (ami)565
html, media-queries
Rethinking Server-Timing as a Critical Monitoring Tool (sma)564
time, http, metrics, monitoring
Don’t Fight the Browser Preload Scanner (mal)563
browsers, html, parsing
How to Use Google CrUX to Analyze and Compare the Performance of JS Frameworks (sma)562
how-tos, google, metrics, javascript, frameworks
A Management Maturity Model for Performance (sli)561
Performance Game Changer: Browser Back/Forward Cache (tun/sma)560
browsers, caching, web-vitals
Get to Know Your Browser’s Performance Profiler559
browsers, tooling, profiling
Understanding the Performance Impact of Anti-Flicker Snippets (spe)558
web-vitals
Is Measuring Speed a Useful Metric for Design Systems? (amy+)557
videos, metrics, design-systems
Faster Initialization of Instances With New Class Features (joy)556
browsers, javascript, javascript-engines, v8
How to Improve Core Web Vitals (8 Ways)555
how-tos, web-vitals
The Ultimate Guide to Optimizing JavaScript for Quick Page Loads (ste/bui)554
guides, javascript, optimization
Core Web Vitals: Finding Common Ground Between SEOs and Developers (moz)553
web-vitals, seo, metrics
How to Optimize Your LCP (with Visuals) (ste)552
how-tos, web-vitals, optimization
Optimising Largest Contentful Paint (css)551
web-vitals
Picture Perfect Images With the Modern “<img>” Element (add)550
images, html, web-vitals
Speed Needs Design, or: You Can’t Delight Users You’ve Annoyed549
design, user-experience
The Web Is for Everyone: Our Vision for the Evolution of the Web (moz)548
web, outlooks, privacy, security, accessibility, user-experience
Optimising Core Web Vitals on SPAs (sim)547
web-vitals, single-page-apps, optimization
Improving Your User Experience to Reduce Bounce Rates (uxm)546
user-experience, usability, seo
Performance Tests on Common JavaScript Array Methods (hac)545
testing, javascript, arrays
Optimizing SVG Patterns to Their Smallest Size (css)544
svg, images
The Impact That High Quality Mark-Up Can Have on Accessibility, Performance, and Discoverability543
videos, html, accessibility
Making the World’s Fastest Website, and Other Mistakes542
mistakes
The Weirdly Obscure Art of Streamed HTML541
html, streaming
Ten Years of Page Bloat: What Have We Learned? (spe)540
web-vitals, user-experience
7 Ways to Achieve a Faster Core Web Vitals Score (hac)539
web-vitals
Performance Signals for Customizing Website UX (tun/sma)538
user-experience, web-vitals, customization
A New Speed Milestone for Chrome537
browsers, chrome
Should Frontend Devs Care About Performance?536
Top 2021 CSS Frameworks Report: The CSS File Sizes (cit)535
studies, research, frameworks, css
How to Make MPAs That Are as Fast as SPAs (cfe)534
how-tos, multi-page-apps, single-page-apps
Improving a CDN’s Cache Hit Ratio (erw)533
content-delivery, caching
Minimizing Google Fonts by Only Loading It for Certain Characters (ami)532
typography, google, fonts, minimalism
Core Web Vitals: What Next? (moz)531
web-vitals, seo
The Difference Between Brotli and Gzip Compression Algorithms to Speed Up Your Site530
compression, brotli, gzip
This Is Why Your Node.js Application Is Slow529
nodejs
Reducing the Web’s Carbon Footprint: Optimizing Social Media Embeds (mic/sma)528
social-media, embed-code, sustainability
Improving JavaScript Bundle Performance With Code-Splitting (cod/sma)527
javascript, bundling, code-splitting, optimization
Speed Matters, but It Isn’t Everything526
user-experience, metrics
Caching Header Best Practices (sim)525
caching, http, http-headers, best-practices
Optimize Your PNGs With Oxipng and pre-commit (ada)524
images, png, compression, tooling
Big Images, Blazingly Fast523
images, quality
How to Avoid Layout Shifts Caused by Web Fonts (sim)522
how-tos, user-experience, fonts
Website Performance and the Planet (fer)521
sustainability, caching
Memory Leaks: The Forgotten Side of Web Performance (nol)520
memory
Improving WordPress Performance: An Open Letter (erw)519
open-letters, wordpress, css, javascript
A Unified Theory of Web Performance (sli/per)518
Exposing Mid-Resource LCP Values (per)517
web-vitals
Page Visibility: If a Tree Falls in the Forest… (pau/per)516
web-vitals, user-experience
Using Diagnostic Metrics (per)515
metrics
Practical Tips for Load-Testing Web Applications (per)514
testing, tips-and-tricks, web-apps
The Business Case for Performance (per)513
economics
Faster Websites by Using Less HTML (j9t)512
cross-posts, html, optimization, minimalism
Redirect Liquidation (tim/per)511
optimization, redirecting
Frontend Web Performance: The Essentials510
fundamentals, rendering
Web Performance, Core Web Vitals, and Vanity Metrics (per)509
web-vitals, metrics
Hands On With the New Responsiveness Metrics (per)508
responsive-design, metrics
Explain Like I’m Five: Web Performance Optimization (sto/per)507
optimization
Performance Implications of JavaScript Errors (per)506
javascript, errors
Defer Non-Critical Resources (per)505
html
Caching: Understanding the Scope (per)504
caching
Test Your Product on a Crappy Laptop (eri/css)503
testing, usability
HTTP Compression (per)502
http, protocols, compression
Have Core Web Vitals Made the Web Faster? (tun/per)501
web-vitals
Plugging Memory Leaks in Your App (sto/per)500
memory
Request for a General Theory of Web Performance (per)499
Page Weight (htt)498
web-almanac, studies, research, metrics
Smashing Podcast Episode 44 With Chris Ferdinandi: Is the Web Dead? (cfe+/sma)497
podcasts, interviews, web-platform, standards, tooling, developer-experience
7 Ways to Improve Node.js Performance at Scale (app)496
nodejs, optimization
How JavaScript Engines Achieve Great Performance495
javascript, javascript-engines
Improving the Performance of Wix Websites (Case Study) (sma)494
monitoring, culture, case-studies
Designing Sustainable Websites (ger)493
sustainability, software-design
Performance (sia/htt)492
web-almanac, studies, research, metrics, user-experience
Get Your “Head” Straight (css/btc)491
videos, html
Your CSS Is an Interface (eri)490
css
Why IndexedDB Is Slow and What to Use Instead489
databases, indexeddb, javascript
Using Web Workers to Boost Third-Party Script Performance (log)488
web-workers, javascript
Why Your Website Should Not Use Dithered Images487
images, dithering, compression
Chrome DevTools: Record and Playback Your User Journeys486
dev-tools, user-experience, browsers, chrome
Everything You Have to Know About Core Web Vitals (fox/cal)485
web-vitals
How to Implement Memoization in React to Improve Performance484
how-tos, react, memoization, optimization
Best Practices on Embedding Third-Party Web Widgets483
embed-code, best-practices
Building an Effective Image Component482
components, javascript
Web Performance Metrics Cheatsheet (ire)481
metrics, cheat-sheets
How I Made Google’s Data Grid Scroll 10× Faster With One Line of CSS480
css
Optimizing Resource Loading With the Fetch Priority API (add+)479
data-fetching, apis, optimization
New HTTP Standards for Caching on the Modern Web (pim)478
http, protocols, caching, standards
My Challenge to the Web Performance Community (phi)477
jsPerf—Online JavaScript Performance Benchmark476
websites, javascript
Using Modern Image Formats: AVIF and WebP (add/sma)475
images, avif, webp, jpeg, png, comparisons, compression
Faster React Apps With Memoization474
react, memoization
ct.css—Let’s Take a Look Inside Your “<head>” (css)473
css, debugging
Small Bundles, Fast Pages: What to Do With Too Much JavaScript (cal)472
javascript, bundling
Optimizing Images on the Web471
images, cloudflare
Vanilla JS Is a Web Performance Decision (cfe)470
javascript
Blowing Up HTML Size With Responsive Images (deb)469
html, images, responsive-design
Designing for Long Waits and Interruptions: Mitigating Breaks in Workflow in Complex Application Design (nng)468
user-experience, complexity
Writing High-Performance JavaScript (cfe)467
javascript
What Are the Web Performance Metrics That Actually Matter? (cfe)466
metrics
Lighthouse Scores Do Not Affect Google Search/SEO (erw)465
lighthouse, google, search, seo
HTTP/3: Performance Improvements (pro/sma)464
http, protocols
Does Shadow DOM Improve Style Performance? (nol)463
dom, shadow-dom, rendering
Big O, Code Efficiency Analysis462
algorithms
“<Lazy>” Rendering in Vue to Improve Performance461
vuejs, client-side-rendering, optimization
A Performance-Focused Workflow Based on Google Tools460
web-vitals, tooling, google
How We Reduced Next.js Page Size by 3.5× and Achieved a 98 Lighthouse Score459
nextjs, lighthouse, case-studies
CSS Architecture and Performance in Micro Frontends458
css, architecture, micro-frontends
Learnings From a WebPageTest Session on CSS-Tricks (chr/css)457
webpagetest
A Beginner’s Guide to Lighthouse456
guides, lighthouse, web-vitals
How to Eliminate Render-Blocking Resources: A Deep Dive (sia)455
how-tos, rendering
What Is Tree Shaking? (cfe)454
javascript, concepts, tree-shaking
The Performance Effects of Too Much Lazy-Loading (rvi+)453
web-vitals, lazy-loading
Performance Design: The Illusion of Speed452
user-experience
Resource Inlining in JavaScript Frameworks (mge)451
javascript, frameworks, web-vitals
Making the Web—Faster450
web, developer-experience, principles
Half the Size of Images by Optimising for High Density Displays (jaf)449
html, images
Serving Sharp Images to High Density Screens (jaf)448
images
What Can the HTTP Archive Tell Us About Largest Contentful Paint? (pau)447
Using AVIF to Compress Images on Your Site446
images, avif, compression
Best Practices for Fonts (tun)445
fonts, best-practices
How to Fix Cumulative Layout Shift (CLS) Issues (tun/sma)444
how-tos, web-vitals
CSS for Web Vitals (una)443
css, web-vitals
Elasticsearch Boolean Query Performance (ast)442
tooling, search
Tree-Shaking: A Reference Guide (ati/sma)441
guides, optimization, javascript, tree-shaking
Reducing HTML Payload With Next.js (Case Study) (sma)440
nextjs, html, case-studies
An Introduction to Performance Budgets439
introductions, performance-budgets, metrics
The Lazy-Loading Property Pattern in JavaScript (nza)438
javascript, software-design-patterns, lazy-loading
9 Principles of Good Web Design437
design, principles, simplicity, navigation, content, layout, mobile
Bypassing Cookie Consent Banners in Lighthouse and WebPageTest (and)436
consent-management, cookies, lighthouse, webpagetest, testing
The 5-Hour CDN (fly)435
content-delivery
Measuring Web Performance in Mobile Safari (css)434
testing, mobile, browsers, safari
What About Ember? (tka)433
emberjs
Front-End Performance 2021: Assets Optimizations (vit/sma)432
checklists, link-lists, compression, images
Front-End Performance 2021: Build Optimizations (vit/sma)431
checklists, link-lists, building
Front-End Performance 2021: Delivery Optimizations (vit/sma)430
checklists, link-lists
Testing Performance (kel)429
testing
HTML and CSS Techniques to Reduce Your JavaScript (per)428
html, css, javascript
Continuous Performance Analysis With Lighthouse CI and GitHub Actions (css)427
lighthouse, github-actions
Optimizing Image Depth (mey/css)426
images, quality, optimization
Page Weight (htt)425
web-almanac, studies, research, metrics
Time to Say Goodbye to Google Fonts: Cache Performance424
google, fonts, caching
Ruthlessly Eliminating Layout Shift on netlify.com (zac)423
netlify, web-vitals, optimization
Best Practices for Inclusive Textual Websites422
security, accessibility, best-practices
Measuring Core Web Vitals With Sentry (fon/css)421
web-vitals, tooling
Warp: Improved JS Performance in Firefox 83 (jan/moz)420
firefox, browsers, javascript, spidermonkey, javascript-engines
The What, Why, and How of Using a Skeleton Loading Screen (tre)419
placeholders, react
Core Web Vitals: A Guide to Google’s Web Performance Metrics (cra)418
guides, google, web-vitals
Signed Exchanges (SXGs) (twi)417
authentication, signed-exchanges, web-packaging
How to Create High-Performance CSS Animations (rac)416
how-tos, css, animations
Reducing the Site Speed Impact of Third-Party Tags415
embed-code
Enforcing Performance Budgets With Webpack (css)414
performance-budgets, webpack
AVIF Has Landed (jaf)413
images, avif, quality, jpeg, webp, svg, png, comparisons
Loading Third-Party JavaScript (add)412
javascript
Performance Is an Issue of Equity (clo)411
accessibility
Lazy Loading Images in Svelte (css)410
images, lazy-loading, svelte
Methods of Improving and Optimizing Performance in React Apps (sma)409
react, optimization
We Need More Inclusive Web Performance Metrics (sco)408
metrics, dei
How I Used Brotli to Get Even Smaller CSS and JavaScript Files at CDN Scale (css)407
compression, brotli
5 Projects to Help You Master Modern CSS (cra)406
css, print, forms
Core Web Vitals (chr/css)405
web-vitals, metrics
On Fixed Elements and Backgrounds (hui)404
css, backgrounds, positioning, scrolling
Speed Up Google Fonts (css)403
google, fonts
The Need for Speed, 23 Years Later (nng)402
user-experience, history
Maybe You Don’t Need That SPA401
single-page-apps, javascript, react, marko
prerender.js (chr/css)400
libraries
Introducing Web Vitals: Essential Metrics for a Healthy Site399
introductions, web-vitals, metrics
Real-World Effectiveness of Brotli (css)398
compression, brotli, comparisons
The Cost of JavaScript Frameworks (tka)397
javascript, frameworks, metrics, jquery, vuejs, angular, react
Start Render: The Web Performance Metric That Heralds the End of the Blank Page396
metrics, web-vitals
Performance Tips: Minifying HTML, CSS, and JS395
videos, html, css, javascript, minification, tips-and-tricks
Setting Height and Width on Images Is Important Again (tun/sma)394
html, images, web-vitals
Improving Perceived Performance With the CSS “font-display” Property (the)393
css, fonts
Encrypting DNS Query Bad for Performance? (erw)392
dns, http, encryption, security
Page Builders Might Not Be a Good Idea (cit)391
maintainability, consistency, quality
Do This to Improve Image Loading on Your Website (fon/css)390
images, html
Google Tag Manager vs. Page Speed: The Impact and How to Improve389
google, tag-management, analytics, optimization
The Web in 2020: Extensibility and Interoperability (una/css)388
web-platform, extensibility, interoperability, houdini, variable-fonts, custom-properties, logical-properties, web-components, media-queries
Should You Self-Host Google Fonts? (tun)387
fonts, google, self-hosting
Improving Site Performance With Webpack Tree Shaking386
optimization, webpack, tree-shaking
Performance Budgets, Pragmatically (css)385
performance-budgets
Putting Devs Before Users: How Frameworks Destroyed Web Performance384
frameworks, developer-experience
An HTML Optimizer’s Config for HTML Minifier (j9t)383
html, html-minifier, minification, optimization, configuration, minimalism
How Do You Remove Unused CSS From a Site? (chr/css)382
css, tooling
Stop Using Ridiculously Low DNS TTLs (jed)381
dns, content-delivery, load-balancing
Speed Up Your Website With WebP (sma)380
optimization, webp, images
A Guide to Optimizing Images for Mobile (sma)379
guides, images, optimization, mobile
On Writing Better Markup (j9t)378
html, quality, maintainability, terminology
Workflow Considerations for Using an Image Management Service (chr/css)377
images, tooling, content-delivery
Recipes for Performance Testing Single Page Applications in Webpagetest (pha/css)376
testing, single-page-apps, tooling, webpagetest
Some HTML Is “Optional” (chr/css)375
html, standards
Faster Image Loading With Embedded Image Previews (sma)374
images, lazy-loading, techniques, javascript
Other Ways to SPAs (chr/css)373
single-page-apps, tooling
Lazy Load Embedded YouTube Videos (chr/css)372
youtube, lazy-loading, embed-code
Optional HTML: Everything You Need to Know (j9t)371
html, minimalism
Accessibility and Web Performance Are Not Features, They’re the Baseline (fon/css)370
accessibility, amp, user-experience
Handling Unused CSS in Sass to Improve Performance (sma)369
css, sass, optimization
What CMS to Use for Optimale TTFB (and Site Speed?) (erw)368
content-management, metrics, wp-engine, automattic
I Used the Web for a Day on a 50 MB Budget (sma)367
mobile
How Google Pagespeed Works: Improve Your Score and Search Engine Ranking (ben/css)366
google, tooling, lighthouse, seo
Browsers Are Pretty Good at Loading Pages, It Turns Out365
javascript, rendering, browsers
The Simplest Way to Load CSS Asynchronously (sco)364
css, asynchronicity
Shifting the Performance Burden (sco)363
Optimizing Google Fonts Performance (sma)362
google, fonts, optimization
How to Increase Your Page Size by 1,500% With Webpack and Vue (bur/css)361
webpack, vuejs
The Problem With Web Development Checklists, or: The Frontend Checklist, Revised (j9t)360
checklists, html, accessibility, seo, social-media
Responsible JavaScript (mal/ali)359
javascript, tree-shaking, code-splitting, embed-code, transpiling, tooling
Image Optimization in WordPress (sma)358
wordpress, images, optimization
Self-Host Your Static Assets (css)357
self-hosting, caching
Characteristics of a Strong Performance Culture (tka)356
culture, principles
Understanding Image Compression: Tooling and Context (j9t)355
images, compression, tooling
The Scoville Scale of Web Font Loading Opinions (zac/btc)354
videos, fonts
Browser Resource Hints: “preload”, “prefetch”, and “preconnect” (mat/deb)353
hints, html, http-headers, http, preloading
Optimizing Performance With Resource Hints (dre/sma)352
hints, optimization
The Serif Tax (chr/css)351
fonts, ttf
Improving Perceived Performance With the Link “rel=preconnect” HTTP Header (and)350
http, http-headers, hints
“Cache-Control” for Civilians (css)349
caching, http
How to Avoid DOM Blocking in JavaScript (cra)348
how-tos, dom, javascript
Rendering on the Web (add+)347
server-side-rendering, client-side-rendering, rendering, hydration, seo
8 Reasons Why You’re Doing SEO Wrong (erw)346
seo
HTML and Performance: Leave Out Optional Tags and Quotes (j9t)345
html
The Ethics of Web Performance (tka)344
ethics, accessibility
The Elements of UI Engineering (dan)343
user-experience, consistency, navigation, prioritization, accessibility, internationalization, resilience
Static vs. Server Rendering342
rendering, comparisons, react
Speed Up Next-Page Navigations With Prefetching (add)341
hints, html, http-headers, http, webpack
Keeping Sass Simple and Speedy on Eleventy (phi)340
sass, eleventy
On Visions for Performance, or: Performance Optimization Is a Process (j9t)339
optimization, outlooks, processes
Tips to Help You Write Faster MySQL Queries338
mysql, databases, tips-and-tricks
Front-End Developers Have to Manage the Loading Experience (chr/css)337
user-experience
Performance Rule #1: Do What You Need to Do—But Not More (j9t)336
simplicity
PageSpeed Insights, Now Powered by Lighthouse (che+)335
tooling, lighthouse
Performance Budgets 101334
introductions, performance-budgets, metrics
A Netflix Web Performance Case Study (add)333
netflix, case-studies
Reduce JavaScript Payloads With Code Splitting (mal)332
javascript, code-splitting
Improve Animated GIF Performance With HTML5 Video (sma)331
images, gif, multimedia
A Guide to Caching in WordPress330
guides, wordpress, caching, plugins
How to Configure Lighthouse for Balanced Quality Websites (j9t)329
how-tos, lighthouse, configuration, quality
A Minimal JavaScript Setup (css)328
javascript, conventions, naming, scope, maintainability, examples
Chrome’s Noscript Intervention (tka)327
chrome, browsers, javascript, mobile
20 Tips for Optimizing CSS Performance (cra)326
css, optimization, tips-and-tricks
Variable Fonts: What They Are, and How to Use Them325
how-tos, fonts, variable-fonts
Browser Painting and Considerations for Web Performance (css)324
browsers, browser-engines, painting, rendering
Slow Websites (geo/css)323
performance-budgets
The Cost of JavaScript in 2018 (add)322
javascript, code-splitting, lazy-loading, performance-budgets, bundling
HTTP/2: The Difference Between HTTP/1.1, Benefits, and How to Use It321
protocols, http, comparisons
Delivering WordPress in 7 KB (css)320
wordpress, themes
HTTP/2: Background, Performance Benefits, and Implementations319
protocols, http
Improving Performance Perception: On-Demand Image Resizing (swa)318
optimization, images, resizing, html
Tips for Writing Better Performing PHP Code317
php, tips-and-tricks
How I Dropped 250 KB of Dead CSS Weight With PurgeCSS (sar)316
css, purgecss
The Four Big Ways Jetpack Helps With Image Performance (css)315
wordpress, plugins, images
Here’s the Thing About “Unused CSS” Tools (chr/css)314
css, quality, tooling
7 Performance Tips for Jank-Free JavaScript Animations313
javascript, animations, tips-and-tricks
Making Your Website Faster and Safer With Cloudflare312
caching, security, cloudflare
How Do You Know Your Website Is a Success? (sma)311
product-management, strategies, metrics, user-experience, content, microcontent, navigation, testing
Page Transitions for Everyone (css)310
design, user-experience, animations, transitions, caching
Introducing Last Painted Hero (spe)309
introductions
How Fast Is AMP Really? (tka)308
amp, metrics
Three Techniques for Performant Custom Font Usage (oll/css)307
fonts, techniques, flash-of-x
AMP News (chr/css)306
amp, community
Website Performance—Does Your Hosting Plan Matter?305
hosting
Why Fast Matters (css/btc)304
videos, economics
Finding Dead CSS (css)303
css, maintenance
How to Optimize CSS and JS for Faster Sites302
how-tos, css, javascript, minification, optimization
SYN Packet Handling in the Wild301
tcp, protocols, network
Performance of CSS Selectors Is Still Irrelevant (j9t)300
css, selectors
Progressive Web Apps: A Crash Course299
crash-courses, web-apps, progressive-web-apps, lighthouse
Optimizing CSS: Tweaking Animation Performance With DevTools298
css, animations, optimization, dev-tools, browsers, firefox
On Big Picture Thinking in Web Development (j9t)297
user-experience, maintainability, consistency, accessibility, outlooks
How to Optimize SQL Queries for Faster Sites296
how-tos, sql, mysql, databases, caching, optimization
Understanding the “Vary” Header (tri/sma)295
http, http-headers, caching
The Front-End Checklist (the)294
websites, checklists, html, css, javascript, images, accessibility, seo
The State of the Web (fox)293
web
Using the Paint Timing API (mal/css)292
apis, time, painting, rendering, javascript
(Now More Than Ever) You Might Not Need jQuery (oll/css)291
jquery, javascript, ajax, comparisons, examples
Three Reasons Why You Should Care About Google Lighthouse (fox/cal)290
lighthouse, google
What Is the Future of Front End Web Development? (chr/css)289
outlooks, user-experience, javascript, documentation, native, web, urls, css, preprocessors, html, building, tooling
What We Talk About When We Talk About Web Performance (btc)288
videos
Let the Content Delivery Network Optimize Your Images (jon/sma)287
content-delivery, images, optimization
Optimizing Web Fonts for Performance: The State of the Art286
fonts, optimization
Brotli and Static Compression (mal/css)285
compression, brotli, gzip, comparisons
What Are Performance Budgets and Why You Should Use One284
performance-budgets
A Comprehensive Guide to HTTP/2 Server Push (mal/sma)283
guides, http, protocols, servers
Guetzli, Google’s New JPEG Encoder (tel)282
images, jpeg, compression, tooling
AMP and the Web (tka)281
amp, web-platform, web
Considering How We Use HTTP/2 (mal/ali)280
optimization, http, protocols
Using HTTP/2 Responsibly: Adapting for Users (mal/ali)279
http, protocols, support, servers
11 Tips to Optimize JavaScript and Improve Website Loading and Rendering Speeds278
javascript, optimization, minification, compression, caching
The Web, Worldwide (tka)277
websites, metrics
A Checklist for Website Reviews (hcr)276
checklists, browsers, seo, accessibility, security
Performant Parallaxing (aer)275
scrolling, css, effects, parallax, positioning
Performance: Shame, Hope, Nuance, and Interesting Problems (bka)274
The Joy of Optimizing (una/btc)273
videos, images, optimization
Web Packaging Format272
web-packaging
Next Generation Server Compression With Brotli (mal/sma)271
compression, brotli, gzip, comparisons
When Is the Right Time to Think About Web Performance? (fon/css)270
processes
High Performance SVGs (sar/css)269
svg, images, tooling, optimization
The Performance Benefits of “rel=noopener” (jaf)268
html, links, security
Ways You Need to Tell the Browser How to Optimize (chr/css)267
browsers, css, optimization
Accessibility and Performance (mar)266
accessibility, javascript, optimization
Service Workers and PWAs: It’s About Reliable Performance, Not “Offline” (sli)265
web-apps, progressive-web-apps, web-workers, javascript, reliability
6 SEO Trends to Watch for in 2016264
trends, seo, content, marketing, mobile, social-media
How to Optimize Mobile Performance (sma)263
how-tos, mobile, optimization, performance-budgets, content-management, caching, testing
CPP: A Standardized Alternative to AMP (tka)262
amp, policies
Critical Metric: Critical Resources261
metrics, css, javascript
Lazy-Loading Images: How Not to Really Annoy Your Users260
images, lazy-loading, jquery
Why You Should Choose Your Own HTTPS (hel)259
http, content-delivery, tooling, cloudflare
10 Web Predictions for 2016 (cra)258
web, outlooks, security, site-generators, browsers, css, mobile, webassembly, seo
The Problem With Progressive Enhancement257
progressive-enhancement, javascript, resilience
Critical Web Fonts (zac)256
fonts, css, flash-of-x, critical-path, metrics
The Cost of Frameworks Recap (chr/css)255
frameworks
Loading Web Fonts With the Web Font Loader (fon/css)254
fonts, flash-of-x, user-experience
JavaScript Frameworks and Mobile Performance253
javascript, frameworks, mobile
Design + Performance (zem/btc)252
videos, design, user-experience
HTTP/2: The Pros, the Cons, and What You Need to Know251
protocols, http
Performance Budgets in Action (spe)250
performance-budgets
Using Web Fonts the Best Way (in 2015) (hel)249
fonts
AMP and Incentives (tka)248
amp, web
Introducing RAIL: A User-Centric Model for Performance (pau/sma)247
introductions, metrics, user-experience
Factors Affecting Website Performance246
network, browsers, memory, servers, images, multimedia
Preloading Images in Parallel With Promises (kit)245
javascript, promises, images, preloading
Delivering Responsibly (sco/btc)244
videos, usability, accessibility, sustainability
10 Common Mistakes Web Developers Make243
mistakes, html, css, javascript, career
5 Easy Performance Tweaks for Node.js Express (cra)242
nodejs, express, optimization, compression
Strategies for Cache-Busting CSS (chr/css)241
css, caching, tooling, strategies
Understanding Critical CSS (sma)240
css, critical-path
Mastering Image Optimization in WordPress239
wordpress, images, optimization
React + Performance = ? (aer)238
react, metrics
Page Bloat Update: The Average Web Page Is More Than 2 MB in Size (tam)237
metrics, comparisons
Performance Tools (fon/css)236
tooling, content-delivery, testing, dev-tools, images, css, javascript, optimization, link-lists
Choosing Performance (tka)235
facebook+meta
Advanced Performance Audits With DevTools (pau)234
auditing, browsers, dev-tools
Tour of a Performant and Responsive CSS Only Site (css)233
css, parallax, effects, case-studies
Planning for Performance (sco/ali)232
Performance Budget Metrics (tka)231
performance-budgets, metrics
Progress Indicators Make a Slow System Less Insufferable (nng)230
progress-indicators, user-experience, design
The Perception of Performance (lou)229
user-experience
Image Optimization Services (gri/clo)228
images, optimization, link-lists
JS Parse and Execution Time (tka)227
javascript, parsing, metrics
How a New HTML Element Will Make the Web Faster (ars)226
html, images, responsive-design
What I’d Tell My Younger Self About Learning Development as a Web Designer225
learning, programming, javascript, databases, servers, preprocessors, version-control, security, career
Minimising Font Downloads (jaf)224
fonts, css, optimization, support, browsers
Faster YouTube Embeds With JavaScript223
embed-code, youtube, javascript
Introduction to the Resource Timing API222
introductions, time, apis, javascript
Authoring Critical Above-the-Fold CSS (css)221
css, sass, asynchronicity
Optimizing WordPress Performance With P3220
wordpress, optimization, plugins
Pixels Are Expensive (aer)219
rendering, painting
Speed Up Your WordPress Site218
wordpress, tooling
How to Speed Up WordPress (sma)217
how-tos, wordpress
Cache Invalidation Strategies With Varnish Cache (per/sma)216
caching, tooling
WordPress Performance Improvements That Can Go Wrong (sma)215
wordpress, plugins
Grunt and Gulp Tasks for Performance Optimization214
yeoman, grunt, gulp, tooling, optimization
Controlling Heavy Weight Websites213
user-experience, case-studies
Nine Things to Expect From HTTP/2 (mno)212
http, protocols, network