Tech does not just watch: Take action against Russia’s war on Ukraine 🇺🇦, and take action against Israel’s occupation, destruction, and ethnic cleansing of Palestine (history) 🇵🇸 Hide

Frontend Dogma

“performance” News Archive (2)

Entry (Sources) and Additional TopicsDate#
Priority Hints and Optimizing LCP (kev)626
web-vitals, optimization, hints
Performance Culture Through the Looking-Glass625
videos, culture
The RUM Archive and Benford’s Law (per)624
HTTP/3 Prioritization Demystified (pro/per)623
http, protocols
Signals: The Nitty-Gritty (web/per)622
javascript, signals
Bad Performance Is Bad Accessibility (bru)621
accessibility
The Performance Inequality Gap, 2023 (sli)620
javascript, metrics
Beating Latency on Scalemates.com (tim/per)619
optimization
Using Inline JavaScript Modules to Prevent CSS Blockage (sto/per)618
javascript, css
An HTML-First Mental Model (noa/per)617
html, dom
Get Off the Main Thread With an Inline Web Worker: An Example (sto/per)616
javascript, web-workers, examples
LCP(FE) (tim/per)615
web-vitals
Web Performance and Compression (per)614
compression
Optimize Interaction to Next Paint (mal+/dev)613
optimization, web-vitals
Accessibility: The Land That “Time to Interactive” Forgot (tin)612
videos, accessibility
Adding Complementary Performance Data to Your Site (mat)611
apis
Reduce Image Sizes by Removing Metadata (per)610
images, metadata, optimization
Fast Is Good, Instant Is Better (tun/per)609
caching
Prerender Pages in Chrome for Instant Page Navigations (tun/dev)608
browsers, google, chrome
7 Website Performance Metrics to Track for Better UX (cal)607
user-experience, metrics
Developing Faster JavaScript Apps: The Ultimate Guide to Web Workers (cra)606
guides, web-apps, web-workers, javascript
Speeding Up the JavaScript Ecosystem—One Library at a Time (mar)605
javascript, libraries
Lazy Loading Images in HTML (sim)604
html, lazy-loading
A Guide to Image Optimization on Jamstack Sites (daw/sma)603
guides, images, compression, optimization, tech-stacks, jamstack
Improving React Interaction Times by 4×602
react, optimization
Early Learnings for Early Hints at Shopify (sia)601
videos, case-studies, shopify, hints
Client-Side Routing Without the JavaScript (rya/thi)600
javascript, frameworks
6 Steps to Improve HTML Images for Users and Developers (aus)599
html, images, responsive-design
HTML and CSS Features, Tips for a 10× Faster Page Loading Speed598
html, css, tips-and-tricks
Is Turbopack Really 10× Faster Than Vite? (eva)597
tooling, bundling, turbopack, vite
CSS Runtime Performance596
slides, css
A Beginner’s Guide to Chrome Tracing (nol)595
guides, browsers, google, chrome, tracing
Conditionally Adaptive CSS—Browser Behavior That Might Improve Your Performance (pep)594
css, responsive-design
Performance (rvi/htt)593
web-almanac, studies, research, metrics, web-vitals
How We Improved React Loading Times by 70% With Next.js592
react, nextjs, case-studies
Which Serverless Edge Platform Has the Fastest Git Deployments? (den)591
serverless, edge-computing, git, deploying
CDN (htt)590
web-almanac, studies, research, metrics, content-delivery, tooling
How to Animate CSS Box Shadows and Optimize Performance589
how-tos, css, animations, shadows
Speeding Up Async Snippets (css)588
javascript, asynchronicity
Sustainable Web Development Strategies Within an Organization (mic/sma)587
sustainability, optimization
SVG Sprites: Old-School, Modern, Unknown, and Forgotten (pep)586
svg, images, sprites
How to Optimize Resource Loading With the “fetchpriority” Attribute (deb)585
how-tos, html, optimization
Optimize Long Tasks (mal/dev)584
javascript, optimization
GIFs Without the .gif: The Most Performant Image and Video Options Right Now (oll/css)583
multimedia, images, gif, html
Performance Budgets: The Easiest Way to a Faster Site (fox/cal)582
performance-budgets
Five Data-Loading Patterns to Boost Web Performance (sma)581
Page Weight (htt)580
web-almanac, studies, research, metrics
Element Timing: One True Metric to Rule Them All? (spe)579
time, apis, metrics
Will Serving Real HTML Content Make a Website Faster? Let’s Experiment!578
studies, research, html
How to Substantially Slow Down Your Node.js Server577
how-tos, nodejs
Total Blocking Time: A Short and Sweet Guide for Happier Users (ben/cal)576
javascript
Your Next.js Bundle Will Thank You575
nextjs, bundling
Critical CSS? Not So Fast! (css)574
css
How to Improve Largest Contentful Paint for Faster Load Times (fox/cal)573
how-tos, web-vitals, optimization
Disabled JavaScript Turns Off Native Lazy Loading (ste)572
javascript, html, lazy-loading
Why Your Website Should Be Under 14 kB in Size571
protocols
Measure What You Impact, Not What You Influence (css)570
metrics, optimization
Optimize Data Fetching569
data-fetching
Can Browsers Optimize the Loading of Third-Party Resources? (add/dev)568
browsers, embed-code
Tip: Use “fetchpriority=high” to Load Your LCP Hero Image Sooner (add)567
html, web-vitals
(Re-)Introducing Gatsby, a Reactive Site Generator566
gatsby, react, reactivity, site-generators, introductions
How and Why We Removed jQuery From GOV.UK565
jquery, maintainability
Core Web Vitals Tools to Boost Your Web Performance Scores (sma)564
web-vitals, tooling
Making a Website Under 1 kB563
minimalism, html
Which Generator Builds Markdown the Fastest? (zac)562
site-generators, markdown, comparisons
500 ms to 1.7 ms in React: A Journey and a Checklist561
react
Fix Web Performance for the Long-Term (sia)560
testing, processes
Priority Hints—What Your Browser Doesn’t Know (Yet)559
hints
Powerful Image Optimization Tools (lou/sma)558
link-lists, images, compression, tooling
Can SVG Symbols Affect Web Performance?557
svg, images
Avoiding “<img>” Layout Shifts: “aspect-ratio” vs. “width” and “height” Attributes (jaf)556
web-vitals, comparisons, html, attributes, aspect-ratio, css
Frontend Web Performance: The Essentials555
fundamentals, javascript
Faster WordPress Rendering With 3 Lines of Configuration (sto)554
wordpress, css, http, configuration
A CLS Punishment for Progressive Enhancement? (bel/pic)553
web-vitals, progressive-enhancement
Imagemin Guard (j9t)552
packages, npm, images, compression, jpeg, png, gif, webp, avif
Everything You Need to Know About Web Performance (in 5 Minutes)551
web-vitals, compression
Style Scoping Versus Shadow DOM: Which Is Fastest? (nol)550
selectors, scope, dom, shadow-dom, comparisons, metrics
How to Remove 99% of JavaScript From Main Thread (wea)549
videos, how-tos, javascript
What We’ve Learned From One Year of Real User Monitoring Data on GOV.UK548
monitoring, metrics
Measuring the Performance of Typefaces for Users II (sma)547
typography, fonts
Measuring the Performance of Typefaces for Users (sma)546
typography, fonts
Don’t Sink Your Website With Third Parties (sma)545
embed-code, dependencies
Two Lines of CSS That Boosts 7× Rendering Performance544
css, rendering
Conditionally Loading CSS or Any Resource Using Media Queries (ami)543
html, media-queries
Rethinking Server-Timing as a Critical Monitoring Tool (sma)542
time, http, metrics, monitoring
Don’t Fight the Browser Preload Scanner (mal/dev)541
browsers, html, parsing
How to Use Google CrUX to Analyze and Compare the Performance of JS Frameworks (sma)540
how-tos, google, metrics, javascript, frameworks
A Management Maturity Model for Performance (sli)539
Performance Game Changer: Browser Back/Forward Cache (tun/sma)538
browsers, caching, web-vitals
Get to Know Your Browser’s Performance Profiler537
browsers, tooling, profiling
Understanding the Performance Impact of Anti-Flicker Snippets (spe)536
web-vitals
Is Measuring Speed a Useful Metric for Design Systems? (amy+)535
videos, metrics, design-systems
Faster Initialization of Instances With New Class Features (joy)534
browsers, javascript, javascript-engines, v8
How to Improve Core Web Vitals (8 Ways)533
how-tos, web-vitals
The Ultimate Guide to Optimizing JavaScript for Quick Page Loads (ste/bui)532
guides, javascript, optimization
Core Web Vitals: Finding Common Ground Between SEOs and Developers (moz)531
web-vitals, seo, metrics
How to Optimize Your LCP (with Visuals) (ste)530
how-tos, web-vitals, optimization
Optimising Largest Contentful Paint (css)529
web-vitals
Picture Perfect Images With the Modern “<img>” Element (add)528
images, html, web-vitals
Speed Needs Design, or: You Can’t Delight Users You’ve Annoyed527
design, user-experience
The Web Is for Everyone: Our Vision for the Evolution of the Web (moz)526
web, outlooks, privacy, security, accessibility, user-experience
Optimising Core Web Vitals on SPAs (sim)525
web-vitals, single-page-apps, optimization
Improving Your User Experience to Reduce Bounce Rates (uxm)524
user-experience, usability, seo
Performance Tests on Common JavaScript Array Methods (hac)523
testing, javascript, arrays
Optimizing SVG Patterns to Their Smallest Size (css)522
svg, images
The Impact That High Quality Mark-Up Can Have on Accessibility, Performance, and Discoverability521
videos, html, accessibility
Making the World’s Fastest Website, and Other Mistakes520
mistakes
The Weirdly Obscure Art of Streamed HTML519
html, streaming
Ten Years of Page Bloat: What Have We Learned? (spe)518
web-vitals, user-experience
7 Ways to Achieve a Faster Core Web Vitals Score (hac)517
web-vitals
A New Speed Milestone for Chrome (dev)516
browsers, google, chrome
Performance Signals for Customizing Website UX (tun/sma)515
user-experience, web-vitals, customization
Should Frontend Devs Care About Performance?514
Top 2021 CSS Frameworks Report: The CSS File Sizes (cit)513
studies, research, frameworks, css
How to Make MPAs That Are as Fast as SPAs (cfe)512
how-tos, multi-page-apps, single-page-apps
Improving a CDN’s Cache Hit Ratio (erw)511
content-delivery, caching
Minimizing Google Fonts by Only Loading It for Certain Characters (ami)510
typography, google, fonts, minimalism
Core Web Vitals: What Next? (moz)509
web-vitals, seo
The Difference Between Brotli and Gzip Compression Algorithms to Speed Up Your Site508
compression, brotli, gzip
This Is Why Your Node.js Application Is Slow507
nodejs
Reducing the Web’s Carbon Footprint: Optimizing Social Media Embeds (mic/sma)506
social-media, embed-code, sustainability
Improving JavaScript Bundle Performance With Code-Splitting (cod/sma)505
javascript, bundling, code-splitting, optimization
Speed Matters, but It Isn’t Everything504
user-experience, metrics
Caching Header Best Practices (sim)503
caching, http, http-headers, best-practices
Big Images, Blazingly Fast502
images, quality
Optimize Your PNGs With Oxipng and pre-commit (ada)501
images, png, compression, tooling
How to Avoid Layout Shifts Caused by Web Fonts (sim)500
how-tos, user-experience, fonts
Website Performance and the Planet499
sustainability, caching
Memory Leaks: The Forgotten Side of Web Performance (nol)498
memory
Improving WordPress Performance: An Open Letter (erw)497
wordpress, css, javascript
A Unified Theory of Web Performance (sli/per)496
Exposing Mid-Resource LCP Values (per)495
web-vitals
Page Visibility: If a Tree Falls in the Forest… (pau/per)494
web-vitals, user-experience
Using Diagnostic Metrics (per)493
metrics
Practical Tips for Load-Testing Web Applications (per)492
testing, tips-and-tricks, web-apps
The Business Case for Performance (per)491
economics
Faster Websites by Using Less HTML (j9t)490
cross-posts, html, optimization, minimalism
Redirect Liquidation (tim/per)489
optimization, redirecting
Frontend Web Performance: The Essentials488
fundamentals, rendering
Web Performance, Core Web Vitals, and Vanity Metrics (per)487
web-vitals, metrics
Hands On With the New Responsiveness Metrics (per)486
responsive-design, metrics
Explain Like I’m Five: Web Performance Optimization (sto/per)485
optimization
Performance Implications of JavaScript Errors (per)484
javascript, errors
Defer Non-Critical Resources (per)483
html
Caching: Understanding the Scope (per)482
caching
Test Your Product on a Crappy Laptop (eri/css)481
testing, usability
HTTP Compression (per)480
http, protocols, compression
Have Core Web Vitals Made the Web Faster? (tun/per)479
web-vitals
Plugging Memory Leaks in Your App (sto/per)478
memory
Request for a General Theory of Web Performance (per)477
Page Weight (htt)476
web-almanac, studies, research, metrics
Smashing Podcast Episode 44 With Chris Ferdinandi: Is the Web Dead? (cfe+/sma)475
podcasts, interviews, web-platform, standards, tooling, developer-experience
7 Ways to Improve Node.js Performance at Scale (app)474
nodejs, optimization
How JavaScript Engines Achieve Great Performance473
javascript, javascript-engines
Improving the Performance of Wix Websites (Case Study) (sma)472
monitoring, culture, case-studies
Designing Sustainable Websites (ger)471
sustainability, software-design
Performance (sia/htt)470
web-almanac, studies, research, metrics, user-experience
Get Your “Head” Straight (css/btc)469
videos, html
Why IndexedDB Is Slow and What to Use Instead468
databases, indexeddb, javascript
Your CSS Is an Interface (eri)467
css
Using Web Workers to Boost Third-Party Script Performance (log)466
web-workers, javascript
Why Your Website Should Not Use Dithered Images465
images, dithering, compression
Chrome DevTools: Record and Playback Your User Journeys464
dev-tools, user-experience, browsers, google, chrome
Everything You Have to Know About Core Web Vitals (fox/cal)463
web-vitals
How to Implement Memoization in React to Improve Performance462
how-tos, react, memoization, optimization
Best Practices on Embedding Third-Party Web Widgets461
embed-code, best-practices
Building an Effective Image Component (dev)460
components, javascript
Web Performance Metrics Cheatsheet (ire)459
metrics, cheat-sheets
New HTTP Standards for Caching on the Modern Web458
http, protocols, caching, standards
Optimizing Resource Loading With the Fetch Priority API (add+/dev)457
data-fetching, apis, optimization
How I Made Google’s Data Grid Scroll 10× Faster With One Line of CSS456
css
My Challenge to the Web Performance Community (phi)455
jsPerf—Online JavaScript Performance Benchmark454
websites, javascript
Using Modern Image Formats: AVIF and WebP (add/sma)453
images, avif, webp, jpeg, png, comparisons, compression
Faster React Apps With Memoization452
react, memoization
ct.css—Let’s Take a Look Inside Your “<head>” (css)451
css, debugging
Small Bundles, Fast Pages: What to Do With Too Much JavaScript (cal)450
javascript, bundling
Optimizing Images on the Web (clo)449
images, cloudflare
Vanilla JS Is a Web Performance Decision (cfe)448
javascript
Blowing Up HTML Size With Responsive Images (deb)447
html, images, responsive-design
Designing for Long Waits and Interruptions: Mitigating Breaks in Workflow in Complex Application Design (nng)446
user-experience, complexity
Writing High-Performance JavaScript (cfe)445
javascript
What Are the Web Performance Metrics That Actually Matter? (cfe)444
metrics
Lighthouse Scores Do Not Affect Google Search/SEO (erw)443
lighthouse, google, search, seo
HTTP/3: Performance Improvements (pro/sma)442
http, protocols
Does Shadow DOM Improve Style Performance? (nol)441
dom, shadow-dom, rendering
Big O, Code Efficiency Analysis440
algorithms
“<Lazy>” Rendering in Vue to Improve Performance439
vuejs, client-side-rendering, optimization
A Performance-Focused Workflow Based on Google Tools (dev)438
web-vitals, tooling, google
How We Reduced Next.js Page Size by 3.5× and Achieved a 98 Lighthouse Score437
nextjs, lighthouse, google, case-studies
CSS Architecture and Performance in Micro Frontends436
css, architecture, micro-frontends
Learnings From a WebPageTest Session on CSS-Tricks (chr/css)435
webpagetest
A Beginner’s Guide to Lighthouse434
guides, lighthouse, google, web-vitals
How to Eliminate Render-Blocking Resources: A Deep Dive (sia)433
how-tos, rendering
The Performance Effects of Too Much Lazy-Loading (rvi/dev)432
web-vitals, lazy-loading
What Is Tree Shaking? (cfe)431
javascript, concepts, tree-shaking
Performance Design: The Illusion of Speed430
user-experience
Resource Inlining in JavaScript Frameworks (mge/dev)429
javascript, frameworks, web-vitals
Making the Web—Faster (rau)428
web, developer-experience, principles
Half the Size of Images by Optimising for High Density Displays (jaf)427
html, images
Serving Sharp Images to High Density Screens (jaf)426
images
Using AVIF to Compress Images on Your Site (dev)425
images, avif, compression
What Can the HTTP Archive Tell Us About Largest Contentful Paint? (pau)424
Best Practices for Fonts (tun/dev)423
fonts, best-practices
CSS for Web Vitals (una/dev)422
css, web-vitals
How to Fix Cumulative Layout Shift (CLS) Issues (tun/sma)421
how-tos, web-vitals
Elasticsearch Boolean Query Performance (ast)420
tooling, search
Tree-Shaking: A Reference Guide (ati/sma)419
guides, optimization, javascript, tree-shaking
Reducing HTML Payload With Next.js (Case Study) (sma)418
nextjs, html, case-studies
An Introduction to Performance Budgets417
introductions, performance-budgets, metrics
The Lazy-Loading Property Pattern in JavaScript (nza)416
javascript, software-design-patterns, lazy-loading
9 Principles of Good Web Design415
design, principles, simplicity, navigation, content, layout, mobile
Bypassing Cookie Consent Banners in Lighthouse and WebPageTest (and)414
consent-management, cookies, lighthouse, google, webpagetest, testing
The 5-Hour CDN (fly)413
content-delivery
Measuring Web Performance in Mobile Safari (css)412
testing, mobile, browsers, apple, safari
What About Ember? (tka)411
emberjs
Front-End Performance 2021: Assets Optimizations (vit/sma)410
checklists, link-lists, compression, images
Front-End Performance 2021: Build Optimizations (vit/sma)409
checklists, link-lists, building
Front-End Performance 2021: Delivery Optimizations (vit/sma)408
checklists, link-lists
Testing Performance (kel)407
testing
HTML and CSS Techniques to Reduce Your JavaScript (per)406
html, css, javascript
Continuous Performance Analysis With Lighthouse CI and GitHub Actions (css)405
lighthouse, google, github-actions
Optimizing Image Depth (mey/css)404
images, quality, optimization
Page Weight (htt)403
web-almanac, studies, research, metrics
Time to Say Goodbye to Google Fonts: Cache Performance402
google, fonts, caching
Best Practices for Inclusive Textual Websites401
security, accessibility, best-practices
Measuring Core Web Vitals With Sentry (fon/css)400
web-vitals, tooling
Warp: Improved JS Performance in Firefox 83 (jan/moz)399
firefox, mozilla, browsers, javascript, spidermonkey, javascript-engines
The What, Why, and How of Using a Skeleton Loading Screen (tre)398
placeholders, react
Core Web Vitals: A Guide to Google’s Web Performance Metrics (cra)397
guides, google, web-vitals
Signed Exchanges (SXGs) (twi/dev)396
authentication, signed-exchanges, web-packaging
How to Create High-Performance CSS Animations (rac/dev)395
how-tos, css, animations
Reducing the Site Speed Impact of Third-Party Tags394
embed-code
Enforcing Performance Budgets With Webpack (css)393
performance-budgets, webpack
AVIF Has Landed (jaf)392
images, avif, quality, jpeg, webp, svg, png, comparisons
Loading Third-Party JavaScript (add/dev)391
javascript
Performance Is an Issue of Equity (clo)390
accessibility
Lazy Loading Images in Svelte (css)389
images, lazy-loading, svelte
Methods of Improving and Optimizing Performance in React Apps (sma)388
react, optimization
We Need More Inclusive Web Performance Metrics (sco)387
metrics, dei
How I Used Brotli to Get Even Smaller CSS and JavaScript Files at CDN Scale (css)386
compression, brotli
5 Projects to Help You Master Modern CSS (cra)385
css, print, forms
Core Web Vitals (chr/css)384
google, web-vitals, metrics
On Fixed Elements and Backgrounds (hui)383
css, backgrounds, positioning, scrolling
Speed Up Google Fonts (css)382
google, fonts
The Need for Speed, 23 Years Later (nng)381
user-experience, history
Maybe You Don’t Need That SPA380
single-page-apps, javascript, react, marko
prerender.js (chr/css)379
libraries
Introducing Web Vitals: Essential Metrics for a Healthy Site (dev)378
introductions, web-vitals, metrics, google
Real-World Effectiveness of Brotli (css)377
compression, brotli, comparisons
The Cost of JavaScript Frameworks (tka)376
javascript, frameworks, metrics, jquery, vuejs, angular, react
Start Render: The Web Performance Metric That Heralds the End of the Blank Page375
metrics, web-vitals
Performance Tips: Minifying HTML, CSS, and JS374
videos, html, css, javascript, minification, tips-and-tricks
Setting Height and Width on Images Is Important Again (tun/sma)373
html, images, web-vitals
Improving Perceived Performance With the CSS “font-display” Property (the)372
css, fonts
Encrypting DNS Query Bad for Performance? (erw)371
dns, http, encryption, security
Page Builders Might Not Be a Good Idea (cit)370
maintainability, consistency, quality
Do This to Improve Image Loading on Your Website (fon/css)369
images, html
Google Tag Manager vs. Page Speed: The Impact and How to Improve368
google, tag-management, analytics, optimization
The Web in 2020: Extensibility and Interoperability (una/css)367
web-platform, extensibility, interoperability, houdini, variable-fonts, custom-properties, logical-properties, web-components, media-queries
Should You Self-Host Google Fonts? (tun)366
fonts, google, self-hosting
Improving Site Performance With Webpack Tree Shaking365
optimization, webpack, tree-shaking
Performance Budgets, Pragmatically (css)364
performance-budgets
Putting Devs Before Users: How Frameworks Destroyed Web Performance (uxd)363
frameworks, developer-experience
An HTML Optimizer’s Config for HTML Minifier (j9t)362
html, html-minifier, minification, optimization, configuration, minimalism
How Do You Remove Unused CSS From a Site? (chr/css)361
css, tooling
Speed Up Your Website With WebP (sma)360
optimization, webp, images
A Guide to Optimizing Images for Mobile (sma)359
guides, images, optimization, mobile
On Writing Better Markup (j9t)358
html, quality, maintainability, terminology
Workflow Considerations for Using an Image Management Service (chr/css)357
images, tooling, content-delivery
Recipes for Performance Testing Single Page Applications in Webpagetest (pha/css)356
testing, single-page-apps, tooling, webpagetest
Some HTML Is “Optional” (chr/css)355
html, standards
Faster Image Loading With Embedded Image Previews (sma)354
images, lazy-loading, techniques, javascript
Other Ways to SPAs (chr/css)353
single-page-apps, tooling
Lazy Load Embedded YouTube Videos (chr/css)352
youtube, lazy-loading, embed-code
Optional HTML: Everything You Need to Know (j9t)351
html, minimalism
Accessibility and Web Performance Are Not Features, They’re the Baseline (fon/css)350
accessibility, amp, google, user-experience
Handling Unused CSS in Sass to Improve Performance (sma)349
css, sass, optimization
What CMS to Use for Optimale TTFB (and Site Speed?) (erw)348
content-management, metrics, wp-engine, automattic
I Used the Web for a Day on a 50 MB Budget (sma)347
mobile
How Google Pagespeed Works: Improve Your Score and Search Engine Ranking (ben/css)346
google, tooling, lighthouse, seo
Browsers Are Pretty Good at Loading Pages, It Turns Out345
javascript, rendering, browsers
The Simplest Way to Load CSS Asynchronously (sco)344
css, asynchronicity
Shifting the Performance Burden (sco)343
Optimizing Google Fonts Performance (sma)342
google, fonts, optimization
How to Increase Your Page Size by 1,500% With Webpack and Vue (bur/css)341
webpack, vuejs
The Problem With Web Development Checklists, or: The Frontend Checklist, Revised (j9t)340
checklists, html, accessibility, seo, social-media
Responsible JavaScript (mal/ali)339
javascript, tree-shaking, code-splitting, embed-code, transpiling, tooling
Image Optimization in WordPress (sma)338
wordpress, images, optimization
Self-Host Your Static Assets (css)337
self-hosting, caching
Characteristics of a Strong Performance Culture (tka)336
culture, principles
Understanding Image Compression: Tooling and Context (j9t)335
images, compression, tooling
The Scoville Scale of Web Font Loading Opinions (zac/btc)334
videos, fonts
Browser Resource Hints: “preload”, “prefetch”, and “preconnect” (deb)333
hints, html, http-headers, http, preloading
Optimizing Performance With Resource Hints (dre/sma)332
hints, optimization
The Serif Tax (chr/css)331
fonts
Improving Perceived Performance With the Link “rel=preconnect” HTTP Header (and)330
http, http-headers, hints
“Cache-Control” for Civilians (css)329
caching, http
How to Avoid DOM Blocking in JavaScript (cra)328
how-tos, dom, javascript
Rendering on the Web (add+/dev)327
server-side-rendering, client-side-rendering, rendering, hydration, seo
8 Reasons Why You’re Doing SEO Wrong (erw)326
seo
HTML and Performance: Leave Out Optional Tags and Quotes (j9t)325
html
The Ethics of Web Performance (tka)324
ethics, accessibility
The Elements of UI Engineering (dan)323
user-experience, consistency, navigation, prioritization, accessibility, internationalization, resilience
Static vs. Server Rendering322
rendering, comparisons, react
Speed Up Next-Page Navigations With Prefetching (add)321
hints, html, http-headers, http, webpack
Keeping Sass Simple and Speedy on Eleventy (phi)320
sass, eleventy
On Visions for Performance, or: Performance Optimization Is a Process (j9t)319
optimization, outlooks, processes
Front-End Developers Have to Manage the Loading Experience (chr/css)318
user-experience
Performance Rule #1: Do What You Need to Do—But Not More (j9t)317
simplicity
PageSpeed Insights, Now Powered by Lighthouse (che+)316
tooling, google, lighthouse
Improve Animated GIF Performance With HTML5 Video (sma)315
images, gif, multimedia
Performance Budgets 101 (dev)314
introductions, performance-budgets, metrics
Reduce JavaScript Payloads With Code Splitting (mal/dev)313
javascript, code-splitting
A Netflix Web Performance Case Study (add/dev)312
netflix, case-studies
A Guide to Caching in WordPress311
guides, wordpress, caching, plugins
How to Configure Lighthouse for Balanced Quality Websites (j9t)310
how-tos, google, lighthouse, configuration, quality
A Minimal JavaScript Setup (css)309
javascript, conventions, naming, scope, maintainability, examples
Chrome’s Noscript Intervention (tka)308
chrome, google, browsers, javascript, mobile
20 Tips for Optimizing CSS Performance (cra)307
css, optimization, tips-and-tricks
Variable Fonts: What They Are, and How to Use Them306
how-tos, fonts, variable-fonts
Browser Painting and Considerations for Web Performance (css)305
browsers, browser-engines, painting, rendering
Slow Websites (geo/css)304
performance-budgets
The Cost of JavaScript in 2018 (add)303
javascript, code-splitting, lazy-loading, performance-budgets, bundling
HTTP/2: The Difference Between HTTP/1.1, Benefits, and How to Use It302
protocols, http, comparisons
Delivering WordPress in 7 KB (css)301
wordpress, themes
HTTP/2: Background, Performance Benefits, and Implementations300
protocols, http
Improving Performance Perception: On-Demand Image Resizing299
optimization, images, resizing, html
How I Dropped 250 KB of Dead CSS Weight With PurgeCSS (sar)298
css, purgecss
The Four Big Ways Jetpack Helps With Image Performance (css)297
wordpress, plugins, images
Here’s the Thing About “Unused CSS” Tools (chr/css)296
css, quality, tooling
7 Performance Tips for Jank-Free JavaScript Animations295
javascript, animations, tips-and-tricks
Making Your Website Faster and Safer With Cloudflare294
caching, security, cloudflare
How Do You Know Your Website Is a Success? (sma)293
product-management, strategies, metrics, user-experience, content, microcontent, navigation, testing
Page Transitions for Everyone (css)292
design, user-experience, animations, transitions, caching
Introducing Last Painted Hero (spe)291
introductions
How Fast Is AMP Really? (tka)290
amp, google, metrics
Three Techniques for Performant Custom Font Usage (oll/css)289
fonts, techniques, flash-of-x
AMP News (chr/css)288
amp, google, community
Why Fast Matters (css/btc)287
videos, economics
Finding Dead CSS (css)286
css, maintenance
How to Optimize CSS and JS for Faster Sites285
how-tos, css, javascript, minification, optimization
SYN Packet Handling in the Wild (clo)284
tcp, protocols, network
Performance of CSS Selectors Is Still Irrelevant (j9t)283
css, selectors
Progressive Web Apps: A Crash Course282
crash-courses, web-apps, progressive-web-apps, lighthouse, google
Optimizing CSS: Tweaking Animation Performance With DevTools281
css, animations, optimization, dev-tools, browsers, firefox, mozilla
On Big Picture Thinking in Web Development (j9t)280
user-experience, maintainability, consistency, accessibility, outlooks
How to Optimize SQL Queries for Faster Sites279
how-tos, sql, mysql, databases, caching, optimization
Understanding the “Vary” Header (sma)278
http, http-headers, caching
The Front-End Checklist (the)277
websites, checklists, html, css, javascript, images, accessibility, seo
The State of the Web (fox)276
web
Using the Paint Timing API (mal/css)275
apis, time, painting, rendering, javascript
(Now More Than Ever) You Might Not Need jQuery (oll/css)274
jquery, javascript, ajax, comparisons, examples
Three Reasons Why You Should Care About Google Lighthouse (fox/cal)273
lighthouse, google
What Is the Future of Front End Web Development? (chr/css)272
outlooks, user-experience, javascript, documentation, native, web, urls, css, preprocessors, html, building, tooling
What We Talk About When We Talk About Web Performance (btc)271
videos
Let the Content Delivery Network Optimize Your Images (jon/sma)270
content-delivery, images, optimization
Optimizing Web Fonts for Performance: The State of the Art269
fonts, optimization
Brotli and Static Compression (mal/css)268
compression, brotli, gzip, comparisons
A Comprehensive Guide to HTTP/2 Server Push (mal/sma)267
guides, http, protocols, servers
Guetzli, Google’s New JPEG Encoder (tel)266
images, jpeg, compression, tooling
AMP and the Web (tka)265
amp, google, web-platform, web
Considering How We Use HTTP/2 (mal/ali)264
optimization, http, protocols
Using HTTP/2 Responsibly: Adapting for Users (mal/ali)263
http, protocols, support, servers
11 Tips to Optimize JavaScript and Improve Website Loading and Rendering Speeds262
javascript, optimization, minification, compression, caching
The Web, Worldwide (tka)261
websites, metrics
A Checklist for Website Reviews (hcr)260
checklists, browsers, seo, accessibility, security
Performant Parallaxing (aer/dev)259
scrolling, css, effects, parallax, positioning
Performance: Shame, Hope, Nuance, and Interesting Problems (bka)258
The Joy of Optimizing (una/btc)257
videos, images, optimization
Web Packaging Format256
web-packaging
Next Generation Server Compression With Brotli (mal/sma)255
compression, brotli, gzip, comparisons
When Is the Right Time to Think About Web Performance? (fon/css)254
processes
High Performance SVGs (sar/css)253
svg, images, tooling, optimization
The Performance Benefits of “rel=noopener” (jaf)252
html, links, security
Ways You Need to Tell the Browser How to Optimize (chr/css)251
browsers, css, optimization
Accessibility and Performance (mar)250
accessibility, javascript, optimization
Service Workers and PWAs: It’s About Reliable Performance, Not “Offline” (sli)249
web-apps, progressive-web-apps, web-workers, javascript
6 SEO Trends to Watch for in 2016248
trends, seo, content, marketing, mobile, social-media
How to Optimize Mobile Performance (sma)247
how-tos, mobile, optimization, performance-budgets, content-management, caching, testing
CPP: A Standardized Alternative to AMP (tka)246
amp, google, policies
Critical Metric: Critical Resources245
metrics, css, javascript
Lazy-Loading Images: How Not to Really Annoy Your Users244
images, lazy-loading, jquery
10 Web Predictions for 2016 (cra)243
web, outlooks, security, site-generators, browsers, css, mobile, webassembly, seo
Why You Should Choose Your Own HTTPS (hel)242
http, content-delivery, tooling, cloudflare
The Problem With Progressive Enhancement241
progressive-enhancement, javascript, resilience
The Cost of Frameworks Recap (chr/css)240
frameworks
JavaScript Frameworks and Mobile Performance239
javascript, frameworks, mobile
Loading Web Fonts With the Web Font Loader (fon/css)238
fonts, flash-of-x, user-experience
Design + Performance (zem/btc)237
videos, design, user-experience
HTTP/2: The Pros, the Cons, and What You Need to Know236
protocols, http
Performance Budgets in Action (spe)235
performance-budgets
AMP and Incentives (tka)234
amp, google, web
Using Web Fonts the Best Way (in 2015) (hel)233
fonts
Introducing RAIL: A User-Centric Model for Performance (pau/sma)232
introductions, metrics, user-experience
Factors Affecting Website Performance231
network, browsers, memory, servers, images, multimedia
Preloading Images in Parallel With Promises (kit)230
javascript, promises, images, preloading
Delivering Responsibly (sco/btc)229
videos, usability, accessibility, sustainability
10 Common Mistakes Web Developers Make228
mistakes, html, css, javascript, career
5 Easy Performance Tweaks for Node.js Express (cra)227
nodejs, express, optimization, compression
Strategies for Cache-Busting CSS (chr/css)226
css, caching, tooling, strategies
Understanding Critical CSS (sma)225
css
Mastering Image Optimization in WordPress224
wordpress, images, optimization
React + Performance = ? (aer)223
react, metrics
Page Bloat Update: The Average Web Page Is More Than 2 MB in Size (tam)222
metrics, comparisons
Performance Tools (fon/css)221
tooling, content-delivery, testing, dev-tools, images, css, javascript, optimization, link-lists
Choosing Performance (tka)220
facebook+meta
Advanced Performance Audits With DevTools (pau)219
auditing, browsers, dev-tools
Tour of a Performant and Responsive CSS Only Site (css)218
css, parallax, effects, case-studies
Planning for Performance (sco/ali)217
Performance Budget Metrics (tka)216
performance-budgets, metrics
Progress Indicators Make a Slow System Less Insufferable (nng)215
progress-indicators, user-experience, design
The Perception of Performance (lou)214
user-experience
Image Optimization Services (gri/clo)213
images, optimization, link-lists
JS Parse and Execution Time (tka)212
javascript, parsing, metrics
How a New HTML Element Will Make the Web Faster (ars)211
html, images, responsive-design
Minimising Font Downloads (jaf)210
fonts, css, optimization, support, browsers
Faster YouTube Embeds With JavaScript209
embed-code, youtube, javascript
Introduction to the Resource Timing API208
introductions, time, apis, javascript
Authoring Critical Above-the-Fold CSS (css)207
css, sass, asynchronicity
Optimizing WordPress Performance With P3206
wordpress, optimization, plugins
Pixels Are Expensive (aer)205
rendering, painting
Speed Up Your WordPress Site204
wordpress, tooling
How to Speed Up WordPress (sma)203
how-tos, wordpress
Cache Invalidation Strategies With Varnish Cache (per/sma)202
caching, tooling
WordPress Performance Improvements That Can Go Wrong (sma)201
wordpress, plugins
Grunt and Gulp Tasks for Performance Optimization200
yeoman, grunt, gulp, tooling, optimization
Controlling Heavy Weight Websites199
user-experience, case-studies
Nine Things to Expect From HTTP/2 (mno)198
http, protocols, network
Web Performance Tricks—Beyond the Basics197
tips-and-tricks, html, css, optimization, link-lists
Packaging on the Web (jen+/tag)196
web-packaging
The Complete Guide to Reducing Page Weight (cra)195
guides, compression, caching, content-delivery, minification
Responsive HTML5 Apps: Write Once, Run Anywhere? Where Is Anywhere? (wir)194
html, web-apps, responsive-design, multimedia
Avoiding the 300 ms Click Delay, Accessibly (tka)193
touch, events, accessibility
Flexbox Layout Isn’t Slow (pau/dev)192
css, flexbox, layout
Performance Matters (ali)191
w3c
SEO Strategies for Designers190
seo, strategies, urls, metadata
Sustainable Web Design (ali)189
sustainability
Image Compression for Web Developers (dev)188
images, compression, link-lists
Webpage Performance (geo)187
compression, images, minification, caching, content-delivery
Domain Sharding Revisited186
domains, http, protocols
WordPress Fragment Caching Revisited (css)185
wordpress, caching, php
Progressive Enhancement Is Faster (jaf/sma)184
progressive-enhancement
Images Slowing Down Your Site? Try This One Weird Trick! (aer)183
images, javascript
Solving Rendering Performance Puzzles (jaf)182
svg, javascript, rendering
Does Flexbox Have a Performance Problem? (chr/css)181
css, flexbox, layout
On Mobile, Data URIs Are 6× Slower Than Source Linking (New Research)180
mobile, data-urls
When the UI Is Too Fast (nng)179
usability
Say “Yes” to JavaScript (mit)178
javascript, privacy
Why We Need Responsive Images (tka)177
images, responsive-design, metrics
Creating a Performance Culture176
culture
HTML5’s “Performance Issue” Rubbished (cra)175
html
No, HTML5 Does Not Have a Performance Issue (pba)174
html
Preventing the Performance Hit From Custom Fonts (chr/css)173
fonts, ajax, jquery, lazy-loading
jQuery: The Performance of DOM Caching172
jquery, dom, caching
Why Is Node.js So Much Faster? (sim)171
nodejs, javascript, asynchronicity
Web Technology: 5 Things to Watch in 2013 (sts/cne)170
browsers, standards, images
A Tale of Animation Performance (chr/css)169
css, animations
Scrolling Performance (aer/dev)168
scrolling
Why Moving Elements With “translate()” Is Better Than “pos:abs top/left” (pau)167
css, animations
The Perception of Speed166
user-experience, single-page-apps
Measuring Connection Speed in Browsers (ppk)165
network, browsers, mobile
Web Performance: When Millisecond Resolution Just Isn’t Enough (mic)164
javascript, apis, metrics
Cache Is King163
caching
Preferred Caching162
caching, web-apps, internet-explorer, microsoft, browsers
Octane: The JavaScript Benchmark Suite for the Modern Web (dev)161
javascript, testing, support, v8, tooling
Loading Half a Billion Rows Into MySQL160
mysql, databases
The Performance of localStorage Revisited (nza)159
browser-storage, javascript
In Defense of localStorage (nza)158
browser-storage, javascript
Building a High Performance Website157
metrics, processes, optimization
The Performance Golden Rule156
principles
Google Wants Faster TCP155
google, tcp, protocols
Use PHP Flush to Improve Site Loading Speed154
php, flushing
Reduce Your jQuery Script Loading Times153
jquery, embed-code
HTML5, CSS3, and DOM Performance (pau/goo)152
videos, html, css, dom
CSS3 vs. CSS: A Speed Benchmark (sma)151
css, comparisons, metrics
Evolution of Script Loading150
html, javascript, asynchronicity
Speed Up Your Website With PHP Buffer Flushing (cra)149
php, flushing
Performance Mythbusters (tka)148
optimization, myths
Improve JavaScript Performance147
javascript, optimization
Why We Don’t Have a Parent Selector (jus)146
css, selectors
The Need for Speed… Why Slow Page Load Times Matter (and)145
slides
High-Performance String Concatenation in JavaScript (cra)144
javascript, strings
WebPageTest.org and Page Speed143
webpagetest, google
Delay Loading the Print Stylesheet (bel)142
css, print, javascript
Website Response Times (nng)141
user-experience, usability, metrics
Frontend SPOF140
html, javascript, css, fonts
Efficiently Rendering CSS (chr/css)139
css, selectors, rendering
Performance Toolbelt: Page Speed (tka)138
tooling
Slow Kills (tel)137
google
9 Causes of Web Page Obesity (cra)136
embed-code, compression, optimization
Better JavaScript Minification (nza/ali)135
javascript, minification
Data URIs (chr/css)134
data-urls
Are You Loosing Traffic by Poor Website Performance? (cod/sma)133
traffic, techniques, tooling, link-lists
How Fast Is Your Site?132
google, tooling
Full Frontal ’09: Jake Archibald on Performance Optimisation (mic/aja)131
optimization, javascript, dom
Fast by Default and Web Performances (aja)130
images, sprites, javascript, css
Data URIs Explained (nza)129
data-urls, base64
“@ font-face” Is Cool… but Does It Scale? (oct/aja)128
css, fonts
JavaScript Gzip Compression in WordPress: What’s Possible and What Hurts (lyz/clo)127
php, javascript, compression, gzip, wordpress