Open Bug 1656844 Opened 4 years ago Updated 2 years ago

CSS rotation animation for embedded SVG on https://www.tim.pl uses 50% on main process

Categories

(Core :: Graphics, defect)

79 Branch
defect

Tracking

()

REOPENED
Tracking Status
firefox79 --- affected
firefox80 --- affected
firefox81 --- affected

People

(Reporter: lukasz.bronicz, Unassigned, NeedInfo)

References

(Blocks 1 open bug)

Details

(Keywords: power)

Attachments

(3 files)

Attached file memory-report.json.gz (deleted) —

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:79.0) Gecko/20100101 Firefox/79.0

Steps to reproduce:

  1. Open any website (f.e. https://www.tim.pl or https://www.allegro.pl);
  2. Open Task Manager;
  3. Reload page (Ctrl + R);

Actual results:

  1. When page is reloading, CPU usage raises up to even 60% for only one page opened in Firefox, much more than "slower" Chrome with couple websites opened;

Expected results:

  1. CPU usage should be stable - in reproduce we use only one page to reload, when there is more websites opened, Firefox could use even more CPU power.

Hi,
Thanks for the details. I was able to reproduce on windows10 pro, on the following versions

release 79.0
beta, 80.0b4 (64-bit)
nightly 81.0a1 (2020-08-07) (64-bit)

I can reproduce with https://www.allegro.pl/ but not with https://www.tim.pl/
Can you attach your about:support information?

I will move this over to a component so developers can take a look over it. If is not the correct component please feel free to change it to an appropriate one.

Thanks for the report.

Best regards, Clara.

Status: UNCONFIRMED → NEW
Component: Untriaged → Performance
Ever confirmed: true
Flags: needinfo?(lukasz.bronicz)
Product: Firefox → Core

lucasz: Could you also capture a performance profile the next time you see this? https://developer.mozilla.org/en-US/docs/Mozilla/Performance/Reporting_a_Performance_Problem

Reporter, could you please reopen this once you provide a performance profile?
Or Clara, can you provide a performance profile?

Status: NEW → RESOLVED
Closed: 4 years ago
Flags: needinfo?(clara.guerrero)
Resolution: --- → INCOMPLETE

Hi,

My apologies for the delay Kim and Olli.
Let me know if you need further assistance.
Clara

Flags: needinfo?(kmoir)
Flags: needinfo?(clara.guerrero)
Flags: needinfo?(bugs)

I tried again and can still reproduce in nightly version 83.0a1 (2020-09-22) (64-bit), both https://www.allegro.pl/ and https://www.tim.pl/ websites.

Best,
Clara

Attached file about:support (deleted) —
Hi, sorry for delay, just yesterday I saw the newest message. about:support

And performance profile:

https://share.firefox.dev/3mMDgmO

I noticed another weird thing - in the newest Firefox build CPU didn't raises up to 60% (max 40-50% on my PC, still quite high when you realize, that this is for just one website), but when I refresh the page, CPU usage is quite stable 30% (after initial 40-50%) for a minute or two (just 6 processes, Chrome with 42 processes go 5-6% CPU usage after a couple of seconds).

Flags: needinfo?(lukasz.bronicz)
Flags: needinfo?(kmoir)

Reopening since the reporter filed new info (6 months ago).

Status: RESOLVED → REOPENED
Resolution: INCOMPLETE → ---

(In reply to lukasz.bronicz from comment #7)

And performance profile:

https://share.firefox.dev/3mMDgmO

Lukasz, sorry that no-one checked this profile. Given that it is already 6 months old, would you mind to create a new one with a most recent version of Firefox? Maybe even Beta or Nightly? Thanks a lot.

Flags: needinfo?(bugs) → needinfo?(lukasz.bronicz)

(In reply to Henrik Skupin (:whimboo) [⌚️UTC+1] from comment #9)

(In reply to lukasz.bronicz from comment #7)

And performance profile:

https://share.firefox.dev/3mMDgmO

Lukasz, sorry that no-one checked this profile. Given that it is already 6 months old, would you mind to create a new one with a most recent version of Firefox? Maybe even Beta or Nightly? Thanks a lot.

Sure thing :)

Firefox Nightly: https://share.firefox.dev/3sCvfn1
Firefox Beta: I had some problems with profiler, if you need this badly I can check that and try to profile it anyway.

FYI: since I created this ticket IMO CPU is used much better, there is no 1-2 minutes freezes at tim.pl or allegro.pl that I saw earlier.

Flags: needinfo?(lukasz.bronicz)

While there is quite a bit of Javascript execution in that profile I can also see a good amount of CPU spend in GFX. As such I checked that page myself and it looks like the embedded SVG (tim_cat_fotoanim) including it's rotation CSS animation is causing the high load on the main process mainly for the WRRenderbackend and Renderer threads.

Turning this animation off via DevTools the CPU load drops from ~40% to just 6%. As such I'm going to move this bug into the graphics component. Maybe it's similar to other CSS animation related issues like bug 1700284?

Blocks: power-usage
Component: Performance → Graphics
Flags: needinfo?(jmuizelaar)
Keywords: power
Summary: Extended CPU usage by version 79 → CSS rotation animation for embedded SVG on https://www.tim.pl uses 50% on main process

I captured profiles on a recent build of https://www.tim.pl/ https://share.firefox.dev/3uvhSbF and https://www.allegro.pl/ https://share.firefox.dev/3rinIeq

They both use plenty of CSS animations and look like nice test cases for the more detailed animation markers I landed in bug 1757202.

On https://www.allegro.pl/, the animation that repeats infinitely is a loading throbber with a transform: rotate animation in a lazily loaded div at the bottom of the page. If I scroll down all the way, the animation stops: https://share.firefox.dev/37dLOA1

It looks like the off-screen animation is already mostly not running, the only waste I see in the profile is that we keep having refresh driver ticks at 60Hz, but on the compositor side not much seems to be happening (the animation is not sampled).

You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: