Hacker News Reader

Comment by alwillis | Hacker News Reader

For layout/design, there’s open props [1].

I like the MDN for quick reference but the actual HTML spec is actually quite well written and has lots of useful examples [2].

[1]: https://open-props.style/

[2]: https://html.spec.whatwg.org/

View on HN

I don’t like Open Props on technical grounds: it’s pointlessly inefficient, largely an abuse of Custom Properties, to my mind, shipping a completely superfluous layer of indirection to every client, rather than flattening almost all of the properties at compile time as could and should be done. If you’re using something like Sass, you’d use variables for this sort of thing except where you do want to change values dynamically (e.g. different values in light/dark mode). Using Custom Properties for everything is just wasteful if you’re not going to have anything subsequently using the definitions themselves.

As an example, on their site, they’re sending about 68/12KB gzipped of styles. Some are already unused and could be removed by straightforward dead code removal. Inlining variables that are set only once and removing their definitions (which incidentally encompasses that dead code removal) reduces it to 40/8KB which will both transfer and evaluate faster. (A further 20% of the styles are also unused and possibly sanely removable.)

Number 1 lags when scrolling on a 2018 MacBook Pro. Not a good advertisement of a product.

Lags while scrolling on a 2021 MBP as well.

hmmm it's good in my 12+ year old laptop in firefox.

Fine on a 2015 Thinkpad running Firefox on Fedora.

A product is poorly-advertised indeed, but which product?

Yeah, I have to wonder if something else is going on with your machine/browser. Runs absolutely perfectly on my 2015 MacBook Pro.

I bet you don't use the Safari Browser. I checked again with Firefox on Mac and I didn't notice any performance issues.

[2] crashed Chrome 3 times. Mac Monterey.

Reply on news.ycombinator.com