Stoyan Stefanov
@stoyan.me
stoyan.me, PerfPlanet, "JavaScript Patterns", "React: Up & Running", YSlow, SmushIt. Formerly of Facebook, WebPageTest, Yahoo
perforomance.run() everybody! The latest API available to folks visiting for #perfnow
October 29, 2025 at 3:58 PM
perforomance.run() everybody! The latest API available to folks visiting for #perfnow
Ha! @11ty.dev folks have opened a Beverly Hills location /cc @zachleat.com
July 11, 2025 at 8:33 PM
Ha! @11ty.dev folks have opened a Beverly Hills location /cc @zachleat.com
Not the web-type of performance
June 16, 2025 at 11:19 PM
Not the web-type of performance
performance.now() conference by @ppkoch.bsky.social and friends is back again for another edition: perfnow.nl
2 days, single-track, 100% web performance geekout happening 30th and 31st of October in Amsterdam. First 9 speakers announced, tickets on sale now.
2 days, single-track, 100% web performance geekout happening 30th and 31st of October in Amsterdam. First 9 speakers announced, tickets on sale now.
May 26, 2025 at 10:33 PM
performance.now() conference by @ppkoch.bsky.social and friends is back again for another edition: perfnow.nl
2 days, single-track, 100% web performance geekout happening 30th and 31st of October in Amsterdam. First 9 speakers announced, tickets on sale now.
2 days, single-track, 100% web performance geekout happening 30th and 31st of October in Amsterdam. First 9 speakers announced, tickets on sale now.
highperformancewebfonts.com/read/pick-ch...
A quick JS snippet that adds a feature to fontdrop.info to hand pick characters for subsetting with Glyphhanger. You click around and get a command generated that looks like:
$ glyphhanger --format=woff2 --subset="font.otf" --whitelist="U+0025,U+0026...
A quick JS snippet that adds a feature to fontdrop.info to hand pick characters for subsetting with Glyphhanger. You click around and get a command generated that looks like:
$ glyphhanger --format=woff2 --subset="font.otf" --whitelist="U+0025,U+0026...
May 25, 2025 at 5:45 PM
highperformancewebfonts.com/read/pick-ch...
A quick JS snippet that adds a feature to fontdrop.info to hand pick characters for subsetting with Glyphhanger. You click around and get a command generated that looks like:
$ glyphhanger --format=woff2 --subset="font.otf" --whitelist="U+0025,U+0026...
A quick JS snippet that adds a feature to fontdrop.info to hand pick characters for subsetting with Glyphhanger. You click around and get a command generated that looks like:
$ glyphhanger --format=woff2 --subset="font.otf" --whitelist="U+0025,U+0026...
Font sizing intensifies
April 25, 2025 at 8:14 PM
Font sizing intensifies
Read in 2025 so far, in an attempt to work on my attention span
April 3, 2025 at 5:53 PM
Read in 2025 so far, in an attempt to work on my attention span
I need to make like a 100 slides for a class I'm taking and I found this little tool is perfect www.markdowntoolbox.com/tools/conver...
March 31, 2025 at 10:02 PM
I need to make like a 100 slides for a class I'm taking and I found this little tool is perfect www.markdowntoolbox.com/tools/conver...
I found one here (next to Firebug and something called "PageTest" :D ) calendar.perfplanet.com/2009/perform...
February 18, 2025 at 7:37 PM
I found one here (next to Firebug and something called "PageTest" :D ) calendar.perfplanet.com/2009/perform...
getting all "scientific" on linkedin's URL shortening logic. Seems like URLs > 26 characters are shortened in posts, but left alone in comments
February 14, 2025 at 7:03 PM
getting all "scientific" on linkedin's URL shortening logic. Seems like URLs > 26 characters are shortened in posts, but left alone in comments
Put this in your console:
setInterval = setTimeout = requestAnimationFrame = console.log
... end you might be stunned, nay, horrified by what's happening in your app, especially with third-party code
(inspired by @andydavies.me)
setInterval = setTimeout = requestAnimationFrame = console.log
... end you might be stunned, nay, horrified by what's happening in your app, especially with third-party code
(inspired by @andydavies.me)
February 11, 2025 at 8:43 PM
Put this in your console:
setInterval = setTimeout = requestAnimationFrame = console.log
... end you might be stunned, nay, horrified by what's happening in your app, especially with third-party code
(inspired by @andydavies.me)
setInterval = setTimeout = requestAnimationFrame = console.log
... end you might be stunned, nay, horrified by what's happening in your app, especially with third-party code
(inspired by @andydavies.me)
I hung out in the Chicago public library today and I found someone has checked out one of my books. I'm torn between being proud someone is reading or feeling guilty and responsible for the person reading a 9-year old book. I mean the second edition feels old, let alone the 1st
February 7, 2025 at 5:00 AM
I hung out in the Chicago public library today and I found someone has checked out one of my books. I'm torn between being proud someone is reading or feeling guilty and responsible for the person reading a 9-year old book. I mean the second edition feels old, let alone the 1st
"Which local fonts can I use?" writeup, official docs and a web app to gather field data so we can have an authoritative answer to this question now and in the future highperformancewebfonts.com/read/which-l...
February 6, 2025 at 5:49 AM
"Which local fonts can I use?" writeup, official docs and a web app to gather field data so we can have an authoritative answer to this question now and in the future highperformancewebfonts.com/read/which-l...
New blog post: "First timid steps in Rust" www.phpied.com/first-timid-...
1. Install Rust
2. A new project
3. Add dependencies to Cargo.toml
4. All ok so far?
5. Tweaks in src/main.rs
6. (Optional, VSCode only) install rust-analyzer
Rust in peace!
1. Install Rust
2. A new project
3. Add dependencies to Cargo.toml
4. All ok so far?
5. Tweaks in src/main.rs
6. (Optional, VSCode only) install rust-analyzer
Rust in peace!
February 1, 2025 at 8:06 PM
New blog post: "First timid steps in Rust" www.phpied.com/first-timid-...
1. Install Rust
2. A new project
3. Add dependencies to Cargo.toml
4. All ok so far?
5. Tweaks in src/main.rs
6. (Optional, VSCode only) install rust-analyzer
Rust in peace!
1. Install Rust
2. A new project
3. Add dependencies to Cargo.toml
4. All ok so far?
5. Tweaks in src/main.rs
6. (Optional, VSCode only) install rust-analyzer
Rust in peace!
I'm having troubles uploading a video. It's an MP4 encoded by Handbrake that seems to work in QuickTime, linkedIn, etc. I'm on Firefox @support.bsky.team
February 1, 2025 at 8:02 PM
I'm having troubles uploading a video. It's an MP4 encoded by Handbrake that seems to work in QuickTime, linkedIn, etc. I'm on Firefox @support.bsky.team
My attempt at clarifying what we mean when we say font, font-family, font-face, typeface, etc.
highperformancewebfonts.com/read/font-ja...
highperformancewebfonts.com/read/font-ja...
January 27, 2025 at 8:13 AM
My attempt at clarifying what we mean when we say font, font-family, font-face, typeface, etc.
highperformancewebfonts.com/read/font-ja...
highperformancewebfonts.com/read/font-ja...
Today's mini-post on fonts turned out not so mini. A look into the past and future of `-apple-system` and `BlinkMacSystemFont`: highperformancewebfonts.com/read/ditch-B...
January 25, 2025 at 8:37 AM
Today's mini-post on fonts turned out not so mini. A look into the past and future of `-apple-system` and `BlinkMacSystemFont`: highperformancewebfonts.com/read/ditch-B...
New mini-post, this time on extreme font subsetting highperformancewebfonts.com/read/extreme...
January 24, 2025 at 8:14 AM
New mini-post, this time on extreme font subsetting highperformancewebfonts.com/read/extreme...
There *is* a solution to 🧭 Safari's annoying insistence of adding its little triangle icon to <details><summary> and it's
summary::-webkit-details-marker {
display: none;
}
summary::-webkit-details-marker {
display: none;
}
January 23, 2025 at 8:39 AM
There *is* a solution to 🧭 Safari's annoying insistence of adding its little triangle icon to <details><summary> and it's
summary::-webkit-details-marker {
display: none;
}
summary::-webkit-details-marker {
display: none;
}
A quick note on the importance of adding `crossorigin` when -preloading fonts: highperformancewebfonts.com/read/on-the-...
Otherwise you get duplicate font downloads and the preload is unused
Otherwise you get duplicate font downloads and the preload is unused
January 23, 2025 at 8:23 AM
A quick note on the importance of adding `crossorigin` when -preloading fonts: highperformancewebfonts.com/read/on-the-...
Otherwise you get duplicate font downloads and the preload is unused
Otherwise you get duplicate font downloads and the preload is unused
Fafofal (Fabulous Font Fallbacks): now with buttons for bold and italics in the test area
highperformancewebfonts.com/tools/fafofal/
highperformancewebfonts.com/tools/fafofal/
January 21, 2025 at 6:00 AM
Fafofal (Fabulous Font Fallbacks): now with buttons for bold and italics in the test area
highperformancewebfonts.com/tools/fafofal/
highperformancewebfonts.com/tools/fafofal/
Ha, since when does Chrome do this? CTRL + Refresh gives you options
January 21, 2025 at 5:57 AM
Ha, since when does Chrome do this? CTRL + Refresh gives you options
"Menlo Regular" is a font - a specific instance of the Menlo typeface. When we say "Menlo" we may mean three different things: a typeface, a font collection (a .ttc file) or a font family. Confusion? Yes, please.
January 16, 2025 at 7:23 AM
"Menlo Regular" is a font - a specific instance of the Menlo typeface. When we say "Menlo" we may mean three different things: a typeface, a font collection (a .ttc file) or a font family. Confusion? Yes, please.
Friends concerned about me & family's safety in LA fire, here's a map. The red arrow points at where we live. Not too close to be affected. We can smell smoke and see little bits of ash in the air, but we're good otherwise.
The two yellow rectangles are "warning" next to the red "evacuation zone"
The two yellow rectangles are "warning" next to the red "evacuation zone"
January 10, 2025 at 6:57 PM
Friends concerned about me & family's safety in LA fire, here's a map. The red arrow points at where we live. Not too close to be affected. We can smell smoke and see little bits of ash in the air, but we're good otherwise.
The two yellow rectangles are "warning" next to the red "evacuation zone"
The two yellow rectangles are "warning" next to the red "evacuation zone"