New article about type-safe polymorphism in React ⚛️ Addressing a long-standing performance issue within `@​types/react` in the process, this took quite some time to write. Let your peers know about getting the ‘as’ prop right 🔁 kripod.dev/blog/behind-the-a…

🦋 @​kripod​.dev

Congrats to the team @Rollstack (YC W23) on the $11M Series A! Rollstack automates your data-driven slide decks and documents using AI. rollstack.com/articles/rolls…

More design systems should use utilities over style components. 🚫 <Box as="section" bg="red-400"> <Text font="body-xl"> <HeadlessButton as={Box} bg="blue-400" /> ✅ <section className="bg-red-400"> <span className="font-body-xl"> <HeadlessButton className="bg-blue-400" /> This might look slightly longer, but gives you flexibility to apply styles to any component or element, with no need for polymorphism (which might not even be supported on every component). You can also create utility functions that apply multiple properties, and give you autocomplete, type checking, and design system constraints: <ul className={stack({density: 'spacious'})}> Separating reusable styles and reusable behavior (e.g. headless components) makes it super flexible to apply the design system anywhere you need to. This makes it extensible to new use cases with much less complexity.

Happy to announce that I’m starting @Rollstack as a Senior Software Engineer next week 🎉

I’m excited to publish juvo, a balanced design system built around the @evilmartians Harmony color palette. Especially proud about how `TextBoxGroupProvider` turned out for attaching addons on top of inputs. github.com/kripod/juvo

Who knew that a post about HTML paragraphs—or, more accurately, paragraphs in HTML—could be so entertaining. You may (and probably will) learn a fun new thing or two. Fun but also practical. Strongly recommend read 👇

Or use this CSS: ``` .log { scroll-snap-type: y proximity; align-content: end; } .log::after { display: block; content: ""; scroll-snap-align: end; } ``` “… remains snapped to the bottom …unless the user has scrolled away from that edge” — drafts.csswg.org/css-scroll-…

📝 I set off to find the best way to make video with transparency work on the web. Over 10 bug reports later, it turns out it's better to handle the transparency manually with WebGL. Here's how: jakearchibald.com/2024/video…

Here it is! Patterns for Memory Efficient DOM Manipulation in Modern Vanilla JavaScript frontendmasters.com/blog/pat…

24px? 44px ? Wait, 48dp on Android, hu? What is the size of an accessible button exactly? Well, it depends (haha). @ericwbailey clarifies a lot of miss conceptions around the minimum WCAG-conformant interactive element size.

🚀 New in-depth article! A complete guide on how, when, and why you should make your components composable. I put a lot of effort into this one, it even contains an interactive component API design wizard! dio.la/article/the-everythin…

“Being a developer is an inherently creative profession” — @hey_amandam gets it 💯 @jsconfbp We all need the space to embrace our childlike curiosity.

Temporal is here to save the day for the web – amazing overview by @NicoloRibaudo presenting new JS features @jsconfbp ✨

🌶️ take: Next.js 15 is what v14 pursued to be And I’m happy for them to fix all the major pain points emerging with the app router 🎊

Or just think about `useState` as an instance variable with a getter and an optional setter returned as a tuple.

it'd be so cool if someone could make compiler theory content more accessible by taking apart the react compiler this is the first time i've seen traditional compiler optimisations implemented in an accessible language

My "as few deps as possible" monorepo setup

First, there was React Router Then came Reach Router Merged into React Router From which Remix was born Turning into React Router again 😄