Life is about deciding who we are: Join us and decide to be for environmental protection, free education and generous social security, human rights and international law, and, of course, action against oppression and violence (starting with helping the people of occupied Palestine 🇵🇸)! Hide

Frontend Dogma

“performance” News Archive (2)

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