Fun-loving coder and speaker. I love #webdevelopment, #webcomponents, and #designsystems. Creator of the WC Toolkit. I work @zocdoc.
Joined August 2017
- Tweets 1,728
- Following 311
- Followers 398
- Likes 3,055
247 Photos and videos
How are teams organizing their #DesignTokens based on the W3C @DesignTokens spec? Are they in single file, split up by theme, category, tier, etc.?
#DesignSystems
2
1
72
I had an interesting conversation the other day. There was a desire to make only colors adjustable for light and dark modes. The problem with that is that more than just colors need to be adjusted in those modes, like shadows, font weights, letter spacing, etc.
#designsystems
1
64
Someone shared this with me and I'm incredibly stoked for the functional CSS future!
bram.us/2025/09/30/css-custo…
1
45
Burton Smith retweeted
Can HTML `<template>` elements improve performance while keeping content visible to bots and AI scrapers? This dev tested 4 approaches across 100,000 items and the results for AI discoverability are surprising.
{ author: @stuffbreaker }
dev.to/stuffbreaker/content-…
1
1
4
1,628
The idea popped into my head that maybe you could use the <template> element to create virtualized content while still making it available for AI agents and bots, so I decided to test it out.
#html #webcomponents #javascript #performance
dev.to/stuffbreaker/content-…
41
May 24
Women's clothing sizes are the dumbest, most nonsensical thing ever...
42
May 20
One of the pain points of my #WebComponents type parser was its inability to parse types from "node_modules". Now it will parse them, and if it can't, it logs a warning with the type name, declaration location, and reason it was skipped.
wc-toolkit.com/documentation…
1
53
May 11
60
1
38
Burton Smith retweeted
CSS's light-dark() now accepts images, making it simpler to define alternate values for a dark color scheme. Here's how it works:
3
17
140
19,758
Apr 14
If you're using the Custom JSDoc Tags plugin for your #WebComponents, you can now add them at the property level!
wc-toolkit.com/documentation…
36
🎙️ @stuffbreaker is speaking at #StirTrek2026!
"The 5 Fundamentals of UX Everyone Should Know"
📅 1 May 2026 11:30 AM
🎟️ events.humanitix.com/stir-tr…
We're really looking forward to having Burton at Stir Trek this year!
1
1
1
117
Mar 24
When I was at Microsoft, we were trying to find ways around some of the pain points of #WebComponents, so I did an exploration on what Declarative Custom Elements could potentially provide us.
#html #css #javascript
dev.to/stuffbreaker/how-decl…
63
Feb 12
Are teams using #TypeScript declaration maps to provide a better go-to-definition experience for developers? I've used source maps, but I don't think I've provided declaration maps.
#SoftwareEngineering #Programming
1
120
Feb 11
When you are in an #html file, and you want to go-to-definition for a custom element, what do you think the behavior should be? Should it go to:
- type definition
- JS file where the class is defined
- CEM entry
- something else
#webcomponents #javascript
1
1
79
I updated my article on reducing #WebComponent FOUC to include details on how to choose an appropriate timeout.
#html #css #javascript
dev.to/stuffbreaker/reducing…
1
1
3
96
I also created a demo site showcasing each of the solutions.
break-stuff.github.io/ce-fou…
38
Burton Smith retweeted
Flash of Unstyled Content (FOUC) can ruin a user's first impression.
Here is how to use the :defined pseudo-class and transition events to smooth out Web Component rendering.
{ author: @stuffbreaker }
dev.to/stuffbreaker/reducing…
3
6
2,074