A rather geeky/technical weblog, est. 2001, by Bramus
React.memo()
Dan Abramov shares 2 techniques to try before resorting to optimize with React.memo() In this post, I want to share two different techniques. They’re surprisingly basic, which is why people rarely realize they improve rendering performance. These techniques are complementary to what you already know! They don’t replace memo or useMemo, but they’re often good …
At first sight the new visual identity for the San Francisco Symphony (pictured below, on the right) looks a bit off … Those letters sure look a bit oddly sized, no? Turns out there’s a dynamic drive behind them: Leveraging new creative technology including variable font design, our new visual language (of which the logo …
Continue reading “SYMPHOSIZER – Playing with SF Symphony’s new Visual Identity”
RIP. If you’re into this kind of things, be sure to check the rest of the Sample Breakdown videos. Some nice gems in there! Related: Recently I made a WebHID-powered Daft Punk Sound Board for you to play with!
@scroll-timeline (Part 1)
Your work is done when it looks so simple that the consumer thinks they could have done it, which means they won’t appreciate how hard you worked. — David Perell Via @VisualizeValue
::spelling-error and ::grammar-error pseudo-elements
Part of the CSS Pseudo-Elements Level 4 Specification are ways to style spelling and grammar errors. By default spelling errors — words you have mistyped — get a red dotted underline, thanks to the ::spelling-error pseudo-class selector you can tweak that. Grammar errors — such as a missing capital letter at the beginning of a …
Relive the whole Mars 2020 Entry Descent Landing in your browser, in 3D, powered by Three.JS/WebGL 🤯 Here’s a few pointers to use: Use the ⏪ ⏩ at the bottom to speed up / slow down the animation Scroll over the pane on the left to jump between phases of the landing You can click …
Nice demo by Jhey in which he created a Pure CSS Stopwatch: See the Pen Pure CSS Working Stopwatch 😎 (@property) by Jhey (@jh3y) on CodePen. It uses a clever combination of CSS Animations, CSS Counters, and @property: Each digit gets its own CSS Animation with its own timing. Inside each animation the value of …
Photo by Alex on Unsplash Late 2019 Brad Frost already pondered about The Great Divide and introduced the terms “front of the frontend” and “back of the frontend”. In a new post he gives the easily-shareable overview that lists the differences between both. A succinct way I’ve framed the split is that a front-of-the-front-end developer …
Continue reading “front-of-the-front-end / back-of-the-front-end”
Putting libraries like GSAP and Framer Motion and React Spring aside, Josh W. Comeau digs into the transition property — “the CSS motion workhorse” as he calls it — and easing functions. I especially like the sandbox at the very end of the post that lets you play the various easing functions and framerate An …