Closed Bug 611963 Opened 9 years ago Closed 8 years ago

border-radius makes ff4 slow, unresponsive, high CPU


(Core :: Graphics, defect, major)

Windows XP
Not set





(Reporter: spiros_ioannou, Unassigned)




(Keywords: regression)

User-Agent:       Mozilla/5.0 (Windows NT 5.1; rv:2.0b8pre) Gecko/20101112 Firefox/4.0b8pre
Build Identifier: Mozilla/5.0 (Windows NT 5.1; rv:2.0b8pre) Gecko/20101112 Firefox/4.0b8pre

Tested with recent nightly. Viewing this page makes ff4 unresponsive and cpu raises when trying to scroll and on page load. This doesn't happen with the same page and ff 3.6 (with -moz-border-radius in this case)
The test page contains an isolated part from a dynamic system, converted to static pages, with javascript and most css removed. When removing the last line in the css (border-radius: 15px 15px 15px 15px;) the page becomes responsive again

Reproducible: Always

Steps to Reproduce:
1.Load the page in the URL. It takes a lot of time.
2.try to scroll. CPU gets very high, the page is unusable.

I'm marking this as major since it prevents pages with border-radius to work.
Product: Firefox → Core
QA Contact: general → general
Version: unspecified → Trunk
Spiros, does turning off accelerated layers make this page fast, by any chance?
blocking2.0: --- → ?
Component: General → Graphics
Keywords: regression
QA Contact: general → thebes
Please renom if & when this bug gets confirmed.
blocking2.0: ? → ---
(In reply to comment #1)
> Spiros, does turning off accelerated layers make this page fast, by any chance?

I changed (with today's nightly) layers.accelerate-all to false, and layers.accelerate-none to true, restarted and retried. No change at all.
it is not so difficult to confirm, just click the link and scroll
It works just fine for me on Windows 7 with Direct2D. But indeed when using GDI it's quite slow. I remember roc telling me about some stuff we do for border-radius that can make it quite slow. I'm guessing it's something fillrate bound which is why it doesn't show with Direct2D.

Looping in roc.
I'm pretty sure this is another case of clipping to border-radius being slow due to applying a mask for every paint operation.
The page doesn't seem to use overflow: hidden, so I'm a little confused as to why Firefox 3.6 is fast but mozilla-central is slow.
The element with border-radius is overflow:auto.
cairo 1.10 speeds this up significantly. (Not saying we shouldn't do the pushgroup thing, I'm working on that.)
Ever confirmed: true
tested with today's nightly, still exists.
I do not see this improvement, my cpu is amd athlon X2 4200+ and graphics card is 9800GT.

Scrolling the test page with the mouse (dragging the scrollbar to the bottom) takes about 5 seconds to complete (it should be instant), while the scrollbar stops at 2-3 positions to recalculate something. I'd say this is something to be fixed for the release.
This is much improved for me in the latest nightly.
yes it is improved indeed. It takes about 2.5-3 seconds to scroll to bottom, it's almost double speed than before. It is not fixed yet though.
So I did some testing using this bookmarklet to measure scroll speed.
I'm using Linux.

On repeated trials on
FF4 current nightly
Chrome stable (9.0.597.84)
~510ms (a text file, should scroll fast, a baseline)
FF4 current nightly
Chrome stable (9.0.597.84)

I also tried removing the border radius on and I got about the same numbers (and we don't use any rounded rect clips on the page as expected).

Do you find the page to be slow in relation to other browsers or slow in relation to other pages in Firefox? Do you use smooth scrolling?
Slow in relation to FF3 and other browsers. The difference is huge. Initial rendering doesn't seem slower, scrolling does.
I changed PC lately and, I tested your script with today's nightly and chrome 9.0.597.107:

chrome: 490-500
ff4: 562-660
resolution is 1680x1050, browsers fullscreen. 
Reducing the browser size, reduces FF4 times closer to chrome's one. Chrome takes the same time to scroll, regardless of window size, which makes me believe that the 500ms are due to some javascript time limit in loops.

The problem is I no longer have access to a slow PC, my new PC is very fast (i7/2600). In my old PC the page was too slow, down to unusable. Completely unusable, probably due to the high CPU usage. This doesn't seem to be fixed, since cpu usage is still high while scrolling, although the result is negligeble in my fast cpu.
Tested again in my work's pc (Intel E6850/Vista)

Chrome: ~560ms
FF4: ~1200ms
FF3: ~700ms

So FF4 much slower than FF3, and this is far worse in slower PCs.
For this comparison, I added -moz-border-radius as well to the stylesheet.
Testing on a Windows 7 machine, with hardware acceleration disabled, scrolling the testcase is horribly slow on Firefox 4b9, somewhat improved (but still not great) on Firefox 4 release, and smooth on Firefox 8. CPU usage improves significantly from Firefox 4b9 to Firefox 4, and improves some more from Firefox 4 to Firefox 8.

With hardware acceleration enabled, scrolling is somewhat slow on Firefox 4b9, and smooth in Firefox 4 release and Firefox 8. CPU usage stays about the same.
Closed: 8 years ago
Resolution: --- → WORKSFORME
You need to log in before you can comment on or make changes to this bug.