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 that they be respected and included. Hide

Frontend Dogma

“performance” News Archive (2)

Entry (Sources) and Additional TopicsDate#
DevTools: A Better Way to Visualize Your JavaScript680
dev-tools, visualization, browsers, lighthouse, google, chrome, microsoft, edge
Serving Less Data to Users With the “prefers-reduced-data” Media Query (sea)679
css, media-queries, sustainability
Speeding Up the JavaScript Ecosystem—Draft-js Emoji Plugin (mar)678
javascript, plugins
Costly CSS Properties and How to Optimize Them677
css, optimization
Understanding CSS Preload and Other Resource Hints (log)676
css, hints, preloading
Load Balancing (sam)675
load-balancing, visualization, architecture
The Performance Golden Rule Revisited (tka)674
metrics
The Real Difference Between “useMemo” and “Memo” in React673
react, hooks, examples
Slow Start and Congestion Control (Browser Networking)672
protocols, tcp
7 Tricks to Take the Performance of Your Website to the Moon671
minification, tree-shaking, tips-and-tricks
10 Ways to Hide Elements in CSS (cra)670
hiding, css, accessibility
Flutter Performance Optimization Techniques and Best Practices669
flutter, optimization, best-practices
Defaulting on Single Page Applications (SPA) (zac)668
single-page-apps, javascript
Senior Engineering Strategies for Advanced React and TypeScript (tec)667
strategies, react, typescript, architecture, testing, accessibility, security, maintenance
The Ultimate Guide to Image Optimisation (fox/cal)666
guides, images, compression, optimization
Speeding Up the JavaScript Ecosystem—npm Scripts (mar)665
javascript, bundling, npm
2023 Web Framework Performance Report (ast)664
frameworks, astro, sveltekit, gatsby, remix, wordpress, nextjs, nuxt, comparisons
Client-Side JavaScript and React Criticism: What Comes Next? (mol)663
javascript, react, accessibility, resilience, progressive-enhancement
Optimising Large Contentful Paint (css/btc)662
videos, web-vitals, optimization
The JavaScript Site Generator Review, 2023 (zac)661
site-generators, comparisons, astro, eleventy, gatsby, nextjs, nuxt, remix, sveltekit
An Approach to Lazy Loading Custom Elements (css)660
web-components, lazy-loading
This Is Why Performance Matters (bel)659
javascript, user-experience
Caching at DEV658
case-studies, caching
What’s New in Lighthouse 10657
release-notes, google, lighthouse
Speeding Up the JavaScript Ecosystem—ESLint (mar)656
javascript, eslint, linting
The Gotcha With Animating Custom Properties (bra)655
css, animations, custom-properties
Monitoring Node.js Performance (ano)654
nodejs, monitoring, tooling
Speed for Who? (bel)653
frameworks, developer-experience, user-experience
Optimal Images in HTML (ste/bui)652
html, images, backgrounds, optimization
Your Web Performance Is Too Reactive; It’s Time to Do More Than Put Out Fires (fox/cal)651
The Modern Way of Serving Images (kur)650
images, html
How to Review a Web Site (uxm)649
how-tos, user-experience, seo
Optimize Time to First Byte (mal)648
optimization
Why We Switched CDNs: How Google’s Core Web Vitals Led Us to Cloudflare Pages647
content-delivery, web-vitals, cloudflare
The Truth About CSS Selector Performance (pat)646
css, selectors
Optimizing the Image Element LCP (sma)645
web-vitals, images
Speeding Up the JavaScript Ecosystem—Module Resolution (mar)644
javascript, modules, esm, commonjs
Why Not “document.write()”? (css)643
javascript
Our Top Core Web Vitals Recommendations for 2023 (phi+)642
web-vitals, best-practices
Why Web Performance Still Matters in 2023 (sia)641
Priority Hints and Optimizing LCP (kev)640
web-vitals, optimization, hints
Performance Culture Through the Looking-Glass (per)639
videos, culture
The RUM Archive and Benford’s Law (per)638
HTTP/3 Prioritization Demystified (pro/per)637
http, protocols
Signals: The Nitty-Gritty (web/per)636
javascript, signals
Bad Performance Is Bad Accessibility (bru)635
accessibility
The Performance Inequality Gap, 2023 (sli)634
javascript, metrics
Beating Latency on Scalemates.com (tim/per)633
optimization
Using Inline JavaScript Modules to Prevent CSS Blockage (sto/per)632
javascript, css
An HTML-First Mental Model (noa/per)631
html, dom
Get Off the Main Thread With an Inline Web Worker: An Example (sto/per)630
javascript, web-workers, examples
LCP(FE) (tim/per)629
web-vitals
Web Performance and Compression (per)628
compression
Optimize Interaction to Next Paint (mal+)627
optimization, web-vitals
Adding Complementary Performance Data to Your Site (mat)626
apis
Accessibility: The Land That “Time to Interactive” Forgot (tin/per)625
videos, accessibility
Reduce Image Sizes by Removing Metadata (per)624
images, metadata, optimization
Fast Is Good, Instant Is Better (tun/per)623
caching
Prerender Pages in Chrome for Instant Page Navigations (tun)622
browsers, google, chrome
7 Website Performance Metrics to Track for Better UX (cal)621
user-experience, metrics
Developing Faster JavaScript Apps: The Ultimate Guide to Web Workers (cra)620
guides, web-apps, web-workers, javascript
Speeding Up the JavaScript Ecosystem—One Library at a Time (mar)619
javascript, libraries
Minification and Cache Directives for the Most Popular Websites of the Internet (dvk)618
minification, tooling, lightning-css, html-minifier, caching, metrics
Lazy Loading Images in HTML (sim)617
html, lazy-loading
A Guide to Image Optimization on Jamstack Sites (daw/sma)616
guides, images, compression, optimization, tech-stacks, jamstack
Improving React Interaction Times by 4×615
react, optimization
Early Learnings for Early Hints at Shopify (sia/per)614
videos, case-studies, shopify, hints
Client-Side Routing Without the JavaScript (rya/thi)613
javascript, frameworks
6 Steps to Improve HTML Images for Users and Developers (aus)612
html, images, responsive-design
HTML and CSS Features, Tips for a 10× Faster Page Loading Speed611
html, css, tips-and-tricks
Is Turbopack Really 10× Faster Than Vite? (eva)610
tooling, bundling, turbopack, vite
CSS Runtime Performance609
slides, css
A Beginner’s Guide to Chrome Tracing (nol)608
guides, browsers, google, chrome, tracing
Conditionally Adaptive CSS—Browser Behavior That Might Improve Your Performance (pep)607
css, responsive-design
Performance (rvi/htt)606
web-almanac, studies, research, metrics, web-vitals
How We Improved React Loading Times by 70% With Next.js605
react, nextjs, case-studies
Which Serverless Edge Platform Has the Fastest Git Deployments? (den)604
serverless, edge-computing, git, deploying
CDN (htt)603
web-almanac, studies, research, metrics, content-delivery, tooling
Speeding Up Async Snippets (css)602
javascript, asynchronicity
How to Animate CSS Box Shadows and Optimize Performance601
how-tos, css, animations, shadows
Sustainable Web Development Strategies Within an Organization (mic/sma)600
sustainability, optimization
SVG Sprites: Old-School, Modern, Unknown, and Forgotten (pep)599
svg, images, sprites
How to Optimize Resource Loading With the “fetchpriority” Attribute (mat/deb)598
how-tos, html, optimization
Optimize Long Tasks (mal)597
javascript, optimization
GIFs Without the .gif: The Most Performant Image and Video Options Right Now (oll/css)596
multimedia, images, gif, html
Performance Budgets: The Easiest Way to a Faster Site (fox/cal)595
performance-budgets
Five Data-Loading Patterns to Boost Web Performance (sma)594
Page Weight (htt)593
web-almanac, studies, research, metrics
Element Timing: One True Metric to Rule Them All? (spe)592
time, apis, metrics
Will Serving Real HTML Content Make a Website Faster? Let’s Experiment!591
studies, research, html
How to Substantially Slow Down Your Node.js Server590
how-tos, nodejs
Total Blocking Time: A Short and Sweet Guide for Happier Users (ben/cal)589
javascript
Your Next.js Bundle Will Thank You588
nextjs, bundling
How to Improve Largest Contentful Paint for Faster Load Times (fox/cal)587
how-tos, web-vitals, optimization
Critical CSS? Not So Fast! (css)586
css, critical-path
Disabled JavaScript Turns Off Native Lazy Loading (ste)585
javascript, html, lazy-loading
Why Your Website Should Be Under 14 kB in Size584
protocols
Measure What You Impact, Not What You Influence (css)583
metrics, optimization
Optimize Data Fetching582
data-fetching
Can Browsers Optimize the Loading of Third-Party Resources? (add)581
browsers, embed-code
Tip: Use “fetchpriority=high” to Load Your LCP Hero Image Sooner (add)580
html, web-vitals
(Re-)Introducing Gatsby, a Reactive Site Generator579
gatsby, react, reactivity, site-generators, introductions
How and Why We Removed jQuery From GOV.UK578
jquery, maintainability
Core Web Vitals Tools to Boost Your Web Performance Scores (sma)577
web-vitals, tooling
Making a Website Under 1 kB576
minimalism, html
Which Generator Builds Markdown the Fastest? (zac)575
site-generators, markdown, comparisons
500 ms to 1.7 ms in React: A Journey and a Checklist574
react
Fix Web Performance for the Long-Term (sia)573
testing, processes
Priority Hints—What Your Browser Doesn’t Know (Yet)572
hints
Powerful Image Optimization Tools (lou/sma)571
link-lists, images, compression, tooling
Can SVG Symbols Affect Web Performance?570
svg, images
Avoiding “<img>” Layout Shifts: “aspect-ratio” vs. “width” and “height” Attributes (jaf)569
web-vitals, comparisons, html, attributes, aspect-ratio, css
Frontend Web Performance: The Essentials568
fundamentals, javascript
Faster WordPress Rendering With 3 Lines of Configuration (sto)567
wordpress, css, http, configuration
A CLS Punishment for Progressive Enhancement? (bel/pic)566
web-vitals, progressive-enhancement
Image Guard (j9t)565
packages, npm, images, compression, jpeg, png, gif, webp, avif
Everything You Need to Know About Web Performance (in 5 Minutes)564
web-vitals, compression
Style Scoping Versus Shadow DOM: Which Is Fastest? (nol)563
selectors, scope, dom, shadow-dom, comparisons, metrics
How to Remove 99% of JavaScript From Main Thread (wea)562
videos, how-tos, javascript
What We’ve Learned From One Year of Real User Monitoring Data on GOV.UK561
monitoring, metrics
Measuring the Performance of Typefaces for Users II (sma)560
typography, fonts
Measuring the Performance of Typefaces for Users (sma)559
typography, fonts
Don’t Sink Your Website With Third Parties (sma)558
embed-code, dependencies
Two Lines of CSS That Boosts 7× Rendering Performance557
css, rendering
Conditionally Loading CSS or Any Resource Using Media Queries (ami)556
html, media-queries
Rethinking Server-Timing as a Critical Monitoring Tool (sma)555
time, http, metrics, monitoring
Don’t Fight the Browser Preload Scanner (mal)554
browsers, html, parsing
How to Use Google CrUX to Analyze and Compare the Performance of JS Frameworks (sma)553
how-tos, google, metrics, javascript, frameworks
A Management Maturity Model for Performance (sli)552
Performance Game Changer: Browser Back/Forward Cache (tun/sma)551
browsers, caching, web-vitals
Get to Know Your Browser’s Performance Profiler550
browsers, tooling, profiling
Understanding the Performance Impact of Anti-Flicker Snippets (spe)549
web-vitals
Is Measuring Speed a Useful Metric for Design Systems? (amy+)548
videos, metrics, design-systems
Faster Initialization of Instances With New Class Features (joy)547
browsers, javascript, javascript-engines, v8
How to Improve Core Web Vitals (8 Ways)546
how-tos, web-vitals
The Ultimate Guide to Optimizing JavaScript for Quick Page Loads (ste/bui)545
guides, javascript, optimization
Core Web Vitals: Finding Common Ground Between SEOs and Developers (moz)544
web-vitals, seo, metrics
How to Optimize Your LCP (with Visuals) (ste)543
how-tos, web-vitals, optimization
Optimising Largest Contentful Paint (css)542
web-vitals
Picture Perfect Images With the Modern “<img>” Element (add)541
images, html, web-vitals
Speed Needs Design, or: You Can’t Delight Users You’ve Annoyed540
design, user-experience
The Web Is for Everyone: Our Vision for the Evolution of the Web (moz)539
web, outlooks, privacy, security, accessibility, user-experience
Optimising Core Web Vitals on SPAs (sim)538
web-vitals, single-page-apps, optimization
Improving Your User Experience to Reduce Bounce Rates (uxm)537
user-experience, usability, seo
Performance Tests on Common JavaScript Array Methods (hac)536
testing, javascript, arrays
Optimizing SVG Patterns to Their Smallest Size (css)535
svg, images
The Impact That High Quality Mark-Up Can Have on Accessibility, Performance, and Discoverability534
videos, html, accessibility
Making the World’s Fastest Website, and Other Mistakes533
mistakes
The Weirdly Obscure Art of Streamed HTML532
html, streaming
Ten Years of Page Bloat: What Have We Learned? (spe)531
web-vitals, user-experience
7 Ways to Achieve a Faster Core Web Vitals Score (hac)530
web-vitals
Performance Signals for Customizing Website UX (tun/sma)529
user-experience, web-vitals, customization
A New Speed Milestone for Chrome528
browsers, google, chrome
Should Frontend Devs Care About Performance?527
Top 2021 CSS Frameworks Report: The CSS File Sizes (cit)526
studies, research, frameworks, css
How to Make MPAs That Are as Fast as SPAs (cfe)525
how-tos, multi-page-apps, single-page-apps
Improving a CDN’s Cache Hit Ratio (erw)524
content-delivery, caching
Minimizing Google Fonts by Only Loading It for Certain Characters (ami)523
typography, google, fonts, minimalism
Core Web Vitals: What Next? (moz)522
web-vitals, seo
The Difference Between Brotli and Gzip Compression Algorithms to Speed Up Your Site521
compression, brotli, gzip
This Is Why Your Node.js Application Is Slow520
nodejs
Reducing the Web’s Carbon Footprint: Optimizing Social Media Embeds (mic/sma)519
social-media, embed-code, sustainability
Improving JavaScript Bundle Performance With Code-Splitting (cod/sma)518
javascript, bundling, code-splitting, optimization
Speed Matters, but It Isn’t Everything517
user-experience, metrics
Caching Header Best Practices (sim)516
caching, http, http-headers, best-practices
Big Images, Blazingly Fast515
images, quality
Optimize Your PNGs With Oxipng and pre-commit (ada)514
images, png, compression, tooling
How to Avoid Layout Shifts Caused by Web Fonts (sim)513
how-tos, user-experience, fonts
Website Performance and the Planet512
sustainability, caching
Memory Leaks: The Forgotten Side of Web Performance (nol)511
memory
Improving WordPress Performance: An Open Letter (erw)510
open-letters, wordpress, css, javascript
A Unified Theory of Web Performance (sli/per)509
Exposing Mid-Resource LCP Values (per)508
web-vitals
Page Visibility: If a Tree Falls in the Forest… (pau/per)507
web-vitals, user-experience
Using Diagnostic Metrics (per)506
metrics
Practical Tips for Load-Testing Web Applications (per)505
testing, tips-and-tricks, web-apps
The Business Case for Performance (per)504
economics
Faster Websites by Using Less HTML (j9t)503
cross-posts, html, optimization, minimalism
Redirect Liquidation (tim/per)502
optimization, redirecting
Frontend Web Performance: The Essentials501
fundamentals, rendering
Web Performance, Core Web Vitals, and Vanity Metrics (per)500
web-vitals, metrics
Hands On With the New Responsiveness Metrics (per)499
responsive-design, metrics
Explain Like I’m Five: Web Performance Optimization (sto/per)498
optimization
Performance Implications of JavaScript Errors (per)497
javascript, errors
Defer Non-Critical Resources (per)496
html
Caching: Understanding the Scope (per)495
caching
Test Your Product on a Crappy Laptop (eri/css)494
testing, usability
HTTP Compression (per)493
http, protocols, compression
Have Core Web Vitals Made the Web Faster? (tun/per)492
web-vitals
Plugging Memory Leaks in Your App (sto/per)491
memory
Request for a General Theory of Web Performance (per)490
Page Weight (htt)489
web-almanac, studies, research, metrics
Smashing Podcast Episode 44 With Chris Ferdinandi: Is the Web Dead? (cfe+/sma)488
podcasts, interviews, web-platform, standards, tooling, developer-experience
7 Ways to Improve Node.js Performance at Scale (app)487
nodejs, optimization
How JavaScript Engines Achieve Great Performance486
javascript, javascript-engines
Improving the Performance of Wix Websites (Case Study) (sma)485
monitoring, culture, case-studies
Designing Sustainable Websites (ger)484
sustainability, software-design
Performance (sia/htt)483
web-almanac, studies, research, metrics, user-experience
Get Your “Head” Straight (css/btc)482
videos, html
Why IndexedDB Is Slow and What to Use Instead481
databases, indexeddb, javascript
Your CSS Is an Interface (eri)480
css
Using Web Workers to Boost Third-Party Script Performance (log)479
web-workers, javascript
Why Your Website Should Not Use Dithered Images478
images, dithering, compression
Chrome DevTools: Record and Playback Your User Journeys477
dev-tools, user-experience, browsers, google, chrome
Everything You Have to Know About Core Web Vitals (fox/cal)476
web-vitals
How to Implement Memoization in React to Improve Performance475
how-tos, react, memoization, optimization
Best Practices on Embedding Third-Party Web Widgets474
embed-code, best-practices
Web Performance Metrics Cheatsheet (ire)473
metrics, cheat-sheets
Building an Effective Image Component472
components, javascript
New HTTP Standards for Caching on the Modern Web471
http, protocols, caching, standards
How I Made Google’s Data Grid Scroll 10× Faster With One Line of CSS470
css
Optimizing Resource Loading With the Fetch Priority API (add+)469
data-fetching, apis, optimization
My Challenge to the Web Performance Community (phi)468
jsPerf—Online JavaScript Performance Benchmark467
websites, javascript
Using Modern Image Formats: AVIF and WebP (add/sma)466
images, avif, webp, jpeg, png, comparisons, compression
Faster React Apps With Memoization465
react, memoization
ct.css—Let’s Take a Look Inside Your “<head>” (css)464
css, debugging
Small Bundles, Fast Pages: What to Do With Too Much JavaScript (cal)463
javascript, bundling
Optimizing Images on the Web462
images, cloudflare
Vanilla JS Is a Web Performance Decision (cfe)461
javascript
Blowing Up HTML Size With Responsive Images (deb)460
html, images, responsive-design
Designing for Long Waits and Interruptions: Mitigating Breaks in Workflow in Complex Application Design (nng)459
user-experience, complexity
Writing High-Performance JavaScript (cfe)458
javascript
What Are the Web Performance Metrics That Actually Matter? (cfe)457
metrics
Lighthouse Scores Do Not Affect Google Search/SEO (erw)456
lighthouse, google, search, seo
HTTP/3: Performance Improvements (pro/sma)455
http, protocols
Does Shadow DOM Improve Style Performance? (nol)454
dom, shadow-dom, rendering
Big O, Code Efficiency Analysis453
algorithms
“<Lazy>” Rendering in Vue to Improve Performance452
vuejs, client-side-rendering, optimization
A Performance-Focused Workflow Based on Google Tools451
web-vitals, tooling, google
How We Reduced Next.js Page Size by 3.5× and Achieved a 98 Lighthouse Score450
nextjs, lighthouse, google, case-studies
CSS Architecture and Performance in Micro Frontends449
css, architecture, micro-frontends
Learnings From a WebPageTest Session on CSS-Tricks (chr/css)448
webpagetest
A Beginner’s Guide to Lighthouse447
guides, lighthouse, google, web-vitals
How to Eliminate Render-Blocking Resources: A Deep Dive (sia)446
how-tos, rendering
What Is Tree Shaking? (cfe)445
javascript, concepts, tree-shaking
The Performance Effects of Too Much Lazy-Loading (rvi)444
web-vitals, lazy-loading
Performance Design: The Illusion of Speed443
user-experience
Resource Inlining in JavaScript Frameworks (mge)442
javascript, frameworks, web-vitals
Making the Web—Faster441
web, developer-experience, principles
Half the Size of Images by Optimising for High Density Displays (jaf)440
html, images
Serving Sharp Images to High Density Screens (jaf)439
images
What Can the HTTP Archive Tell Us About Largest Contentful Paint? (pau)438
Using AVIF to Compress Images on Your Site437
images, avif, compression
Best Practices for Fonts (tun)436
fonts, best-practices
How to Fix Cumulative Layout Shift (CLS) Issues (tun/sma)435
how-tos, web-vitals
CSS for Web Vitals (una)434
css, web-vitals
Elasticsearch Boolean Query Performance (ast)433
tooling, search
Tree-Shaking: A Reference Guide (ati/sma)432
guides, optimization, javascript, tree-shaking
Reducing HTML Payload With Next.js (Case Study) (sma)431
nextjs, html, case-studies
An Introduction to Performance Budgets430
introductions, performance-budgets, metrics
The Lazy-Loading Property Pattern in JavaScript (nza)429
javascript, software-design-patterns, lazy-loading
9 Principles of Good Web Design428
design, principles, simplicity, navigation, content, layout, mobile
Bypassing Cookie Consent Banners in Lighthouse and WebPageTest (and)427
consent-management, cookies, lighthouse, google, webpagetest, testing
The 5-Hour CDN (fly)426
content-delivery
Measuring Web Performance in Mobile Safari (css)425
testing, mobile, browsers, apple, safari
What About Ember? (tka)424
emberjs
Front-End Performance 2021: Assets Optimizations (vit/sma)423
checklists, link-lists, compression, images
Front-End Performance 2021: Build Optimizations (vit/sma)422
checklists, link-lists, building
Front-End Performance 2021: Delivery Optimizations (vit/sma)421
checklists, link-lists
Testing Performance (kel)420
testing
HTML and CSS Techniques to Reduce Your JavaScript (per)419
html, css, javascript
Continuous Performance Analysis With Lighthouse CI and GitHub Actions (css)418
lighthouse, google, github-actions
Optimizing Image Depth (mey/css)417
images, quality, optimization
Page Weight (htt)416
web-almanac, studies, research, metrics
Time to Say Goodbye to Google Fonts: Cache Performance415
google, fonts, caching
Ruthlessly Eliminating Layout Shift on netlify.com (zac)414
netlify, web-vitals, optimization
Best Practices for Inclusive Textual Websites413
security, accessibility, best-practices
Measuring Core Web Vitals With Sentry (fon/css)412
web-vitals, tooling
Warp: Improved JS Performance in Firefox 83 (jan/moz)411
firefox, mozilla, browsers, javascript, spidermonkey, javascript-engines
The What, Why, and How of Using a Skeleton Loading Screen (tre)410
placeholders, react
Core Web Vitals: A Guide to Google’s Web Performance Metrics (cra)409
guides, google, web-vitals
Signed Exchanges (SXGs) (twi)408
authentication, signed-exchanges, web-packaging
How to Create High-Performance CSS Animations (rac)407
how-tos, css, animations
Reducing the Site Speed Impact of Third-Party Tags406
embed-code
Enforcing Performance Budgets With Webpack (css)405
performance-budgets, webpack
AVIF Has Landed (jaf)404
images, avif, quality, jpeg, webp, svg, png, comparisons
Loading Third-Party JavaScript (add)403
javascript
Performance Is an Issue of Equity (clo)402
accessibility
Lazy Loading Images in Svelte (css)401
images, lazy-loading, svelte
Methods of Improving and Optimizing Performance in React Apps (sma)400
react, optimization
We Need More Inclusive Web Performance Metrics (sco)399
metrics, dei
How I Used Brotli to Get Even Smaller CSS and JavaScript Files at CDN Scale (css)398
compression, brotli
5 Projects to Help You Master Modern CSS (cra)397
css, print, forms
Core Web Vitals (chr/css)396
google, web-vitals, metrics
On Fixed Elements and Backgrounds (hui)395
css, backgrounds, positioning, scrolling
Speed Up Google Fonts (css)394
google, fonts
The Need for Speed, 23 Years Later (nng)393
user-experience, history
Maybe You Don’t Need That SPA392
single-page-apps, javascript, react, marko
prerender.js (chr/css)391
libraries
Introducing Web Vitals: Essential Metrics for a Healthy Site390
introductions, web-vitals, metrics, google
Real-World Effectiveness of Brotli (css)389
compression, brotli, comparisons
The Cost of JavaScript Frameworks (tka)388
javascript, frameworks, metrics, jquery, vuejs, angular, react
Start Render: The Web Performance Metric That Heralds the End of the Blank Page387
metrics, web-vitals
Performance Tips: Minifying HTML, CSS, and JS386
videos, html, css, javascript, minification, tips-and-tricks
Setting Height and Width on Images Is Important Again (tun/sma)385
html, images, web-vitals
Improving Perceived Performance With the CSS “font-display” Property (the)384
css, fonts
Encrypting DNS Query Bad for Performance? (erw)383
dns, http, encryption, security
Page Builders Might Not Be a Good Idea (cit)382
maintainability, consistency, quality
Do This to Improve Image Loading on Your Website (fon/css)381
images, html
Google Tag Manager vs. Page Speed: The Impact and How to Improve380
google, tag-management, analytics, optimization
The Web in 2020: Extensibility and Interoperability (una/css)379
web-platform, extensibility, interoperability, houdini, variable-fonts, custom-properties, logical-properties, web-components, media-queries
Should You Self-Host Google Fonts? (tun)378
fonts, google, self-hosting
Improving Site Performance With Webpack Tree Shaking377
optimization, webpack, tree-shaking
Performance Budgets, Pragmatically (css)376
performance-budgets
Putting Devs Before Users: How Frameworks Destroyed Web Performance375
frameworks, developer-experience
An HTML Optimizer’s Config for HTML Minifier (j9t)374
html, html-minifier, minification, optimization, configuration, minimalism
How Do You Remove Unused CSS From a Site? (chr/css)373
css, tooling
Speed Up Your Website With WebP (sma)372
optimization, webp, images
A Guide to Optimizing Images for Mobile (sma)371
guides, images, optimization, mobile
On Writing Better Markup (j9t)370
html, quality, maintainability, terminology
Workflow Considerations for Using an Image Management Service (chr/css)369
images, tooling, content-delivery
Recipes for Performance Testing Single Page Applications in Webpagetest (pha/css)368
testing, single-page-apps, tooling, webpagetest
Some HTML Is “Optional” (chr/css)367
html, standards
Faster Image Loading With Embedded Image Previews (sma)366
images, lazy-loading, techniques, javascript
Other Ways to SPAs (chr/css)365
single-page-apps, tooling
Lazy Load Embedded YouTube Videos (chr/css)364
youtube, lazy-loading, embed-code
Optional HTML: Everything You Need to Know (j9t)363
html, minimalism
Accessibility and Web Performance Are Not Features, They’re the Baseline (fon/css)362
accessibility, amp, google, user-experience
Handling Unused CSS in Sass to Improve Performance (sma)361
css, sass, optimization
What CMS to Use for Optimale TTFB (and Site Speed?) (erw)360
content-management, metrics, wp-engine, automattic
I Used the Web for a Day on a 50 MB Budget (sma)359
mobile
How Google Pagespeed Works: Improve Your Score and Search Engine Ranking (ben/css)358
google, tooling, lighthouse, seo
Browsers Are Pretty Good at Loading Pages, It Turns Out357
javascript, rendering, browsers
The Simplest Way to Load CSS Asynchronously (sco)356
css, asynchronicity
Shifting the Performance Burden (sco)355
Optimizing Google Fonts Performance (sma)354
google, fonts, optimization
How to Increase Your Page Size by 1,500% With Webpack and Vue (bur/css)353
webpack, vuejs
The Problem With Web Development Checklists, or: The Frontend Checklist, Revised (j9t)352
checklists, html, accessibility, seo, social-media
Responsible JavaScript (mal/ali)351
javascript, tree-shaking, code-splitting, embed-code, transpiling, tooling
Image Optimization in WordPress (sma)350
wordpress, images, optimization
Self-Host Your Static Assets (css)349
self-hosting, caching
Characteristics of a Strong Performance Culture (tka)348
culture, principles
Understanding Image Compression: Tooling and Context (j9t)347
images, compression, tooling
The Scoville Scale of Web Font Loading Opinions (zac/btc)346
videos, fonts
Browser Resource Hints: “preload”, “prefetch”, and “preconnect” (mat/deb)345
hints, html, http-headers, http, preloading
Optimizing Performance With Resource Hints (dre/sma)344
hints, optimization
The Serif Tax (chr/css)343
fonts, ttf
Improving Perceived Performance With the Link “rel=preconnect” HTTP Header (and)342
http, http-headers, hints
“Cache-Control” for Civilians (css)341
caching, http
How to Avoid DOM Blocking in JavaScript (cra)340
how-tos, dom, javascript
Rendering on the Web (add+)339
server-side-rendering, client-side-rendering, rendering, hydration, seo
8 Reasons Why You’re Doing SEO Wrong (erw)338
seo
HTML and Performance: Leave Out Optional Tags and Quotes (j9t)337
html
The Ethics of Web Performance (tka)336
ethics, accessibility
The Elements of UI Engineering (dan)335
user-experience, consistency, navigation, prioritization, accessibility, internationalization, resilience
Static vs. Server Rendering334
rendering, comparisons, react
Speed Up Next-Page Navigations With Prefetching (add)333
hints, html, http-headers, http, webpack
Keeping Sass Simple and Speedy on Eleventy (phi)332
sass, eleventy
On Visions for Performance, or: Performance Optimization Is a Process (j9t)331
optimization, outlooks, processes
Tips to Help You Write Faster MySQL Queries330
mysql, databases, tips-and-tricks
Front-End Developers Have to Manage the Loading Experience (chr/css)329
user-experience
Performance Rule #1: Do What You Need to Do—But Not More (j9t)328
simplicity
PageSpeed Insights, Now Powered by Lighthouse (che+)327
tooling, google, lighthouse
Improve Animated GIF Performance With HTML5 Video (sma)326
images, gif, multimedia
Performance Budgets 101325
introductions, performance-budgets, metrics
Reduce JavaScript Payloads With Code Splitting (mal)324
javascript, code-splitting
A Netflix Web Performance Case Study (add)323
netflix, case-studies
How to Configure Lighthouse for Balanced Quality Websites (j9t)322
how-tos, google, lighthouse, configuration, quality
A Guide to Caching in WordPress321
guides, wordpress, caching, plugins
A Minimal JavaScript Setup (css)320
javascript, conventions, naming, scope, maintainability, examples
Chrome’s Noscript Intervention (tka)319
chrome, google, browsers, javascript, mobile
20 Tips for Optimizing CSS Performance (cra)318
css, optimization, tips-and-tricks
Variable Fonts: What They Are, and How to Use Them317
how-tos, fonts, variable-fonts
Browser Painting and Considerations for Web Performance (css)316
browsers, browser-engines, painting, rendering
Slow Websites (geo/css)315
performance-budgets
The Cost of JavaScript in 2018 (add)314
javascript, code-splitting, lazy-loading, performance-budgets, bundling
HTTP/2: The Difference Between HTTP/1.1, Benefits, and How to Use It313
protocols, http, comparisons
Delivering WordPress in 7 KB (css)312
wordpress, themes
HTTP/2: Background, Performance Benefits, and Implementations311
protocols, http
Improving Performance Perception: On-Demand Image Resizing310
optimization, images, resizing, html
Tips for Writing Better Performing PHP Code309
php, tips-and-tricks
How I Dropped 250 KB of Dead CSS Weight With PurgeCSS (sar)308
css, purgecss
The Four Big Ways Jetpack Helps With Image Performance (css)307
wordpress, plugins, images
Here’s the Thing About “Unused CSS” Tools (chr/css)306
css, quality, tooling
7 Performance Tips for Jank-Free JavaScript Animations305
javascript, animations, tips-and-tricks
Making Your Website Faster and Safer With Cloudflare304
caching, security, cloudflare
How Do You Know Your Website Is a Success? (sma)303
product-management, strategies, metrics, user-experience, content, microcontent, navigation, testing
Page Transitions for Everyone (css)302
design, user-experience, animations, transitions, caching
Introducing Last Painted Hero (spe)301
introductions
How Fast Is AMP Really? (tka)300
amp, google, metrics
Three Techniques for Performant Custom Font Usage (oll/css)299
fonts, techniques, flash-of-x
AMP News (chr/css)298
amp, google, community
Website Performance—Does Your Hosting Plan Matter?297
hosting
Why Fast Matters (css/btc)296
videos, economics
Finding Dead CSS (css)295
css, maintenance
How to Optimize CSS and JS for Faster Sites294
how-tos, css, javascript, minification, optimization
SYN Packet Handling in the Wild293
tcp, protocols, network
Performance of CSS Selectors Is Still Irrelevant (j9t)292
css, selectors
Progressive Web Apps: A Crash Course291
crash-courses, web-apps, progressive-web-apps, lighthouse, google
Optimizing CSS: Tweaking Animation Performance With DevTools290
css, animations, optimization, dev-tools, browsers, firefox, mozilla
On Big Picture Thinking in Web Development (j9t)289
user-experience, maintainability, consistency, accessibility, outlooks
How to Optimize SQL Queries for Faster Sites288
how-tos, sql, mysql, databases, caching, optimization
Understanding the “Vary” Header (sma)287
http, http-headers, caching
The Front-End Checklist (the)286
websites, checklists, html, css, javascript, images, accessibility, seo
The State of the Web (fox)285
web
Using the Paint Timing API (mal/css)284
apis, time, painting, rendering, javascript
(Now More Than Ever) You Might Not Need jQuery (oll/css)283
jquery, javascript, ajax, comparisons, examples
Three Reasons Why You Should Care About Google Lighthouse (fox/cal)282
lighthouse, google
What Is the Future of Front End Web Development? (chr/css)281
outlooks, user-experience, javascript, documentation, native, web, urls, css, preprocessors, html, building, tooling
What We Talk About When We Talk About Web Performance (btc)280
videos
Let the Content Delivery Network Optimize Your Images (jon/sma)279
content-delivery, images, optimization
Optimizing Web Fonts for Performance: The State of the Art278
fonts, optimization
Brotli and Static Compression (mal/css)277
compression, brotli, gzip, comparisons
What Are Performance Budgets and Why You Should Use One276
performance-budgets
A Comprehensive Guide to HTTP/2 Server Push (mal/sma)275
guides, http, protocols, servers
Guetzli, Google’s New JPEG Encoder (tel)274
images, jpeg, compression, tooling
AMP and the Web (tka)273
amp, google, web-platform, web
Considering How We Use HTTP/2 (mal/ali)272
optimization, http, protocols
Using HTTP/2 Responsibly: Adapting for Users (mal/ali)271
http, protocols, support, servers
11 Tips to Optimize JavaScript and Improve Website Loading and Rendering Speeds270
javascript, optimization, minification, compression, caching
The Web, Worldwide (tka)269
websites, metrics
A Checklist for Website Reviews (hcr)268
checklists, browsers, seo, accessibility, security
Performant Parallaxing (aer)267
scrolling, css, effects, parallax, positioning
Performance: Shame, Hope, Nuance, and Interesting Problems (bka)266
The Joy of Optimizing (una/btc)265
videos, images, optimization
Web Packaging Format264
web-packaging
Next Generation Server Compression With Brotli (mal/sma)263
compression, brotli, gzip, comparisons
When Is the Right Time to Think About Web Performance? (fon/css)262
processes
High Performance SVGs (sar/css)261
svg, images, tooling, optimization
The Performance Benefits of “rel=noopener” (jaf)260
html, links, security
Ways You Need to Tell the Browser How to Optimize (chr/css)259
browsers, css, optimization
Accessibility and Performance (mar)258
accessibility, javascript, optimization
Service Workers and PWAs: It’s About Reliable Performance, Not “Offline” (sli)257
web-apps, progressive-web-apps, web-workers, javascript, reliability
6 SEO Trends to Watch for in 2016256
trends, seo, content, marketing, mobile, social-media
How to Optimize Mobile Performance (sma)255
how-tos, mobile, optimization, performance-budgets, content-management, caching, testing
CPP: A Standardized Alternative to AMP (tka)254
amp, google, policies
Critical Metric: Critical Resources253
metrics, css, javascript
Lazy-Loading Images: How Not to Really Annoy Your Users252
images, lazy-loading, jquery
Why You Should Choose Your Own HTTPS (hel)251
http, content-delivery, tooling, cloudflare
10 Web Predictions for 2016 (cra)250
web, outlooks, security, site-generators, browsers, css, mobile, webassembly, seo
The Problem With Progressive Enhancement249
progressive-enhancement, javascript, resilience
Critical Web Fonts (zac)248
fonts, css, flash-of-x, critical-path, metrics
The Cost of Frameworks Recap (chr/css)247
frameworks
JavaScript Frameworks and Mobile Performance246
javascript, frameworks, mobile
Loading Web Fonts With the Web Font Loader (fon/css)245
fonts, flash-of-x, user-experience
Design + Performance (zem/btc)244
videos, design, user-experience
HTTP/2: The Pros, the Cons, and What You Need to Know243
protocols, http
Performance Budgets in Action (spe)242
performance-budgets
AMP and Incentives (tka)241
amp, google, web
Using Web Fonts the Best Way (in 2015) (hel)240
fonts
Introducing RAIL: A User-Centric Model for Performance (pau/sma)239
introductions, metrics, user-experience
Factors Affecting Website Performance238
network, browsers, memory, servers, images, multimedia
Preloading Images in Parallel With Promises (kit)237
javascript, promises, images, preloading
Delivering Responsibly (sco/btc)236
videos, usability, accessibility, sustainability
10 Common Mistakes Web Developers Make235
mistakes, html, css, javascript, career
5 Easy Performance Tweaks for Node.js Express (cra)234
nodejs, express, optimization, compression
Strategies for Cache-Busting CSS (chr/css)233
css, caching, tooling, strategies
Understanding Critical CSS (sma)232
css, critical-path
Mastering Image Optimization in WordPress231
wordpress, images, optimization
React + Performance = ? (aer)230
react, metrics
Page Bloat Update: The Average Web Page Is More Than 2 MB in Size (tam)229
metrics, comparisons
Performance Tools (fon/css)228
tooling, content-delivery, testing, dev-tools, images, css, javascript, optimization, link-lists
Choosing Performance (tka)227
facebook+meta
Advanced Performance Audits With DevTools (pau)226
auditing, browsers, dev-tools
Tour of a Performant and Responsive CSS Only Site (css)225
css, parallax, effects, case-studies
Planning for Performance (sco/ali)224
Performance Budget Metrics (tka)223
performance-budgets, metrics
Progress Indicators Make a Slow System Less Insufferable (nng)222
progress-indicators, user-experience, design
The Perception of Performance (lou)221
user-experience
Image Optimization Services (gri/clo)220
images, optimization, link-lists
JS Parse and Execution Time (tka)219
javascript, parsing, metrics
How a New HTML Element Will Make the Web Faster (ars)218
html, images, responsive-design
What I’d Tell My Younger Self About Learning Development as a Web Designer217
learning, programming, javascript, databases, servers, preprocessors, version-control, security, career
Minimising Font Downloads (jaf)216
fonts, css, optimization, support, browsers
Faster YouTube Embeds With JavaScript215
embed-code, youtube, javascript
Introduction to the Resource Timing API214
introductions, time, apis, javascript
Authoring Critical Above-the-Fold CSS (css)213
css, sass, asynchronicity
Optimizing WordPress Performance With P3212
wordpress, optimization, plugins
Pixels Are Expensive (aer)211
rendering, painting
Speed Up Your WordPress Site210
wordpress, tooling
How to Speed Up WordPress (sma)209
how-tos, wordpress
Cache Invalidation Strategies With Varnish Cache (per/sma)208
caching, tooling
WordPress Performance Improvements That Can Go Wrong (sma)207
wordpress, plugins
Grunt and Gulp Tasks for Performance Optimization206
yeoman, grunt, gulp, tooling, optimization
Controlling Heavy Weight Websites205
user-experience, case-studies
Nine Things to Expect From HTTP/2 (mno)204
http, protocols, network
Web Performance Tricks—Beyond the Basics203
tips-and-tricks, html, css, optimization, link-lists
Packaging on the Web (jen+/tag)202
web-packaging
The Complete Guide to Reducing Page Weight (cra)201
guides, compression, caching, content-delivery, minification
Responsive HTML5 Apps: Write Once, Run Anywhere? Where Is Anywhere? (wir)200
html, web-apps, responsive-design, multimedia
Avoiding the 300 ms Click Delay, Accessibly (tka)199
touch, events, accessibility
Flexbox Layout Isn’t Slow (pau)198
css, flexbox, layout
Performance Matters (ali)197
w3c
SEO Strategies for Designers196
seo, strategies, urls, metadata
Sustainable Web Design (ali)195
sustainability
Webpage Performance (geo)194
compression, images, minification, caching, content-delivery
Image Compression for Web Developers193
images, compression, link-lists
Domain Sharding Revisited192
domains, http, protocols
WordPress Fragment Caching Revisited (css)191
wordpress, caching, php
Progressive Enhancement Is Faster (jaf/sma)190
progressive-enhancement
Images Slowing Down Your Site? Try This One Weird Trick! (aer)189
images, javascript
Solving Rendering Performance Puzzles (jaf)188
svg, javascript, rendering
Does Flexbox Have a Performance Problem? (chr/css)187
css, flexbox, layout
On Mobile, Data URIs Are 6× Slower Than Source Linking (New Research)186
mobile, data-urls
When the UI Is Too Fast (nng)185
usability
Say “Yes” to JavaScript (mit)184
javascript, privacy
Why We Need Responsive Images (tka)183
images, responsive-design, metrics
Creating a Performance Culture182
culture
HTML5’s “Performance Issue” Rubbished (cra)181
html