CSS3 PIE Forums
http://css3pie.com/forum/

Terrible performance issues with IE8 scroll
http://css3pie.com/forum/viewtopic.php?f=3&t=860
Page 1 of 1

Author:  tabman [ Mon May 02, 2011 10:50 am ]
Post subject:  Terrible performance issues with IE8 scroll

Was banging my head against the wall for a bit with this, thought I would post in case anyone else has the same issue.

A page with 60+ elements all with PIE radius, shadow and gradient. No noticeable performance hit in IE7 and IE9 (even without -pie-lazy-init) but IE8 would hang for 3-4 seconds every time the scroll bar was used (CPU usage would spike). lazy-init didn't improve things. After reading the documentation properly (which I should have done in the first place) I noticed that IE8 has -pie-poll enabled by default. After setting this to false on these elements the page performs as it should.

Code:
.repeaterContainer
{
            background-color:#EDEDED;
            border:2px solid #666666;
            line-height:1.3em;
            margin:10px auto;
            padding:10px;
            position:relative;
            width:290px;
            border-radius:10px;
            -moz-border-radius:10px;
            -webkit-border-radius:10px;
            -moz-box-shadow:0 0 5px #888888;
            -webkit-box-shadow:0 0 5px #888888;
            box-shadow: #888888 0 0 5px;
            background: linear-gradient(#ededed, #acbbc6);
            background: -webkit-gradient(linear, 0 0, 0 bottom, from(#ededed), to(#acbbc6));
            background: -moz-linear-gradient(#ededed, #acbbc6);
            -pie-background: linear-gradient(#ededed, #acbbc6);
            behavior: url('../PIE.htc');
            -pie-poll:false;
}
           

Author:  mjcorn [ Thu May 05, 2011 2:18 pm ]
Post subject:  Re: Terrible performance issues with IE8 scroll

I had this same issue but when I disabled polling the elements that had PIE applied to them just didn't scroll. I assume this is the problem that polling was introduced to fix but I only have 7 or 8 elements with PIE on them. So for now I have left it on but the scrolling performance is really slow and has me considering going back to background images.

Author:  CSS_JS [ Wed Feb 01, 2012 9:32 am ]
Post subject:  Re: Terrible performance issues with IE8 scroll

To improve PIE's performance in IE8 and IE9 I have succesfully added -pie-poll: false; to non-changing elements, but polling can't be disabled for changing elements in IE8 and IE9 because than they aren't rendered correctly when they (should) change.

On pages with lots of changing PIE attached elements the performance in IE8 and IE9 goes down and CPU usage goes up.

A solution could be to use -pie-poll: false; and then manually poll through Javascript when an element changes (like when a popup or tab is loaded and displayed with Javascript).

Is (something like) this possible through Javascript or on another way?

So could there be a Javascript function to call which lets PIE manually query a specified (-pie-poll: false;) PIE attached element's layout once (and only once), and if the layout has changed adjust the rendering (without starting to query the element's layout several times a second)?
The Javascript function should work like setting a -pie-poll: false; PIE attached element to -pie-poll: true; for 250ms (one heartbeat cycle) and then back to -pie-poll: false; again.

That would considerably increase scrolling performance and reduce IE's CPU usage compared to the current continues querying of every -pie-poll: true; PIE attached element's layout several times a second in IE8 and IE9.

Author:  jason [ Wed Feb 01, 2012 10:57 pm ]
Post subject:  Re: Terrible performance issues with IE8 scroll

If you are fortunate enough to know in your JS code when an element is changing, you can manually force an update on an element by triggering an onmove or onresize event. See http://snippets.webaware.com.au/snippet ... -elements/ for an example.

Author:  CSS_JS [ Tue Feb 14, 2012 4:11 am ]
Post subject:  Re: Terrible performance issues with IE8 scroll

jason wrote:
If you are fortunate enough to know in your JS code when an element is changing, you can manually force an update on an element by triggering an onmove or onresize event. See http://snippets.webaware.com.au/snippet ... -elements/ for an example.
Thank you. I've turned polling off (-pie-poll: false;) to reduce the CPU load and implemented the JS solution.

During testing I noticed an onmove event doesn't do anything in IE9 (in contrast to IE8 no linear-gradient gets drawn after an onmove event), so now I'm using onresize (which works fine in both IE8 and IE9):

if (window.PIE) {document.getElementById('...').fireEvent('onresize')}

Author:  baklazanek [ Wed Jun 26, 2013 9:14 am ]
Post subject:  Re: Terrible performance issues with IE8 scroll

CSS_JS wrote:
jason wrote:
If you are fortunate enough to know in your JS code when an element is changing, you can manually force an update on an element by triggering an onmove or onresize event. See http://snippets.webaware.com.au/snippet ... -elements/ for an example.
Thank you. I've turned polling off (-pie-poll: false;) to reduce the CPU load and implemented the JS solution.

During testing I noticed an onmove event doesn't do anything in IE9 (in contrast to IE8 no linear-gradient gets drawn after an onmove event), so now I'm using onresize (which works fine in both IE8 and IE9):

if (window.PIE) {document.getElementById('...').fireEvent('onresize')}



any progress?

Page 1 of 1 All times are UTC - 7 hours [ DST ]
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
http://www.phpbb.com/