Hacker News new | ask | show | jobs
by hknd 2762 days ago
Cool that you open-source a book - it looks like it contains a solid amount of information. Well done!

What I'm missing (couldn't find it on the first glance) is a topic about the performance implications of animations. Most devs don't consider which css properties trigger a layout->paint->composite re-render, which has massive influence on browser performance.

There are soooo many shitty animations/transitions in the web, just because people don't know that animations can slow down a whole site.

Imho people should read something like the web dev one pager on animation performance (1), which explains (more or less) how to build high-performance animations.

There is also this free udacity course (2) which explains everything a web developer needs to know. It's not hard nor magic, and you just have to hear it once to remember it for whenever it becomes necessary.

1: https://developers.google.com/web/fundamentals/design-and-ux... 2: https://eu.udacity.com/course/browser-rendering-optimization...

3 comments

It's especially bad with the CSS frameworks that people slap on their sites.

Various Material UI implementations are notorious here because they have fancy animations everywhere.

^ this!

I've seen so many jquery libraries used on sites to get a quick fancy animation, but then it used something like: setTimeout(() => { element.height += 2; }, 50)

Which literally brings a 60+fps page to <5fps on a high-end machine.

Yes, I totally agree! Performance is something I will consider touching on. I wanted to keep it fairly intro-level but the topic would sit well alongside accessibility.

Thanks for the feedback!