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