I’ve a handful of excellent hyperlinks to articles about efficiency which can be burning a gap in my bookmarks folder, and wanna drop them right here to share.
From fonts to SVG: an icon migration strategy— Erwin Hofman notes that he was utilizing icon fonts out of sheer comfort, however that there are a great deal of causes to not use them. He supplies particulars on his new technique for utilizing icons, which relies on the <use> method. 5 years later, I’m nonetheless a giant fan of simply dunking the <svg> within the HTML the place you want them. It’s simply an HTML partial like another.
Next.js Performance: Making a Fast Framework Even Faster— Ben Schwarz says that Subsequent.js is already a fairly quick framework in that it does sensible issues that preserve even React powered pages snappy. However efficiency isn’t one thing that may be left totally to a framework. You must do work. Luckily, Subsequent.js has some fairly useful helpers for issues like dynamically (lazily) loading parts, deferring scripts, optimizing photographs, and extra.
Redirect Liquidation— Tim Vereecke covers a captivating method the place as an alternative of redirecting an outdated URL to a brand new URL, you let the outdated URL load, dynamically load the brand new content material, then historical past.replaceState the outdated URL with the brand new URL. It’s sooner, however simply don’t do it for bots.
Performant A/B Testing with Cloudflare Workers— Philip Walton covers how A/B testing is just a little trickier on static websites than server-backed websites, however you possibly can pull it off (performantly) due to Cloudflare Staff which might manipulate HTML earlier than it hits the browser, very similar to a Service Employee besides on the edge slightly than on the shopper. Save a cookie and you’ll preserve customers of their correct teams.
A Unified Theory of Web Performance— Alex Russell tries to reply Tanner Hodges’ name for truly defining net efficiency. It’s a kind of issues that appears apparent (prefer it’s clear when sure issues assist and damage net efficiency) however truly defining it’s tough. And never simply defining it when it comes to particular metrics (even that’s tough), however reply questions like: What are this self-discipline’s guiding ideas?What does it appear to be to follow net efficiency? How will we do it?
Unveiling the new WebPageTest UI— I completely love seeing WebPageTest’s design evolve and enhance. It’s a kind of merchandise that’s clearly a best-in-class software for efficiency practitioners, but had a prettttty gnarly design for lots of years. That is means higher. It’s like when Google Fonts lastly bought a redesign and the broad neighborhood let loose a collective exhale of appreciation.
Caching Header Best Practices— Simon Hearne’s dissertation on Cache headers. After I first began caring about net efficiency, this was, like, the foremost factor. When you incorrectly ship Cache headers, customers is perhaps re-downloading a file time and again unnecessarily once they don’t have to, which is concerning the worst factor attainable. I’m glad to see headers preserve getting consideration and re-imagined as the online evolves.