Hacker News Reader

For what it's worth, one CSS line lags the HELL out of my laptop on the site. It's backdrop-filter: blur(0.1875rem) for modals, like the youtube video popup

View on HN

I'm a front-end dev and I refuse to apply this effect for this reason. Even on high end laptops it uses way too much power and starts blasting the fans.

Does anyone know why the blur effect always takes so much power? Is there not a way to use the GPU, or is the problem something else entirely?

You can tell CSS to use GPU by adding `transform: translate3d(0, 0, 0);`

Explanation of slow CSS filter performance is in this video: https://www.youtube.com/watch?v=oie6KqSPPlE

Reply on news.ycombinator.com