I looked at how React DOM updates inline styles and learnt why it is more complicated than you might expect.

React DOM sets individual style properties by directly assigning values:

element.style[name] = value

github.com/facebook/react… React DOM also diffs styles between updates to decide exactly which properties to change. This doesn't seem necessary; it could overwrite the style property every update:

element.setAttribute('style', str)

or

element.style.cssText = str

github.com/facebook/react…

A brief analysis and comparison of the CSS for Twitter's PWA vs Twitter's legacy desktop website. The difference is dramatic and I'll touch on some reasons why. Legacy site *downloads* ~630 KB CSS per theme and writing direction.

6,769 rules
9,252 selectors
16.7k declarations
3,370 unique declarations
44 media queries
36 unique colors
50 unique background colors
46 unique font sizes
39 unique z-indices

cssstats.com/stats?url=http…

I'm often asked "how do I improve my technical skills as a software engineer?" Amusing because mine are mediocre. But, it's the same way you get better at anything else. Here are some concrete examples I've seen help… 1. Learn by unlearning. Be curious, humble, open-minded. Be prepared to let go of what you think you already know. Don't jump to conclusions. Don't trust your assumptions. Don't be afraid to begin again.