codeman38:

codeman38:

…OMG. I’ve been noticing that browsing my Tumblr dash in Firefox uses up around 1/3 of my CPU cycles, even with ad scripts blocked, but couldn’t figure out why.

After reading some developer tools documentation online, I managed to pinpoint that it was something involving CSS animations, but couldn’t find any obvious element that was animating on the page. So then I did a bit more debugging to see what animations were being reported by the document inspector.

It’s the mouseover animation on the Tumblr logo. Which, apparently, is coded in such a way that it keeps animating in the background even when the mouse is nowhere near it (!?!?!?!).

If you have the Stylish extension installed, here’s a userstyle to disable the logo animation:

@-moz-document domain(tumblr.com) {
    .logo .preload-container {
        animation: none !important;
    }
}

Edited to add: An even better version that enables the animation when moused over, but leaves the animation disabled when not:

@-moz-document domain(tumblr.com) {
    .logo .preload-container:not(:hover) {
        animation: none;
    }
}