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. Hide

Frontend Dogma

“performance” News Archive (2)

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