Thanks for looking into that. On Mon, Jul 27, 2015 at 12:11 PM Emmanuel Garcia <[email protected]> wrote:
> I have confirmed this issue. It seems like a regression in chrome that can > be reproduced in a non-retina display screen by just adding *overflow: > auto. *Here's an example: http://jsbin.com/midoga/edit?html,output . I > will keep you posted as we find out more. > > > > On Monday, July 27, 2015 at 9:09:33 AM UTC-7, [email protected] wrote: > >> So all sites that use polymer drawers will have slow scroll perf because >> the main content section always repaints? >> >> On Saturday, July 25, 2015 at 7:21:57 AM UTC-7, Aleem Mawani wrote: >> > Non-retina macbook air 13" >>> >>> On Sat, Jul 25, 2015 at 7:21 AM Eric Bidelman <[email protected]> wrote: >>> >> Are you on a retina machine? If not what kind? If you're on a Mac that's >>>> likely the difference. Chrome has a different rendering path on retina vs. >>>> non-retina screens. >>>> >>>> On Fri, Jul 24, 2015, 8:21 PM <[email protected]> wrote: >>>> >>>>> Hmmm. Attached video showing repaints. and screenshot of me being on >>>>> chrome 44 >>>>> >>>>> On Friday, July 24, 2015 at 5:09:32 PM UTC-7, Frankie Fu wrote: >>>>> >>>>>> I tried your minimal example and when I scrolled the content I >>>>>> didn't see the repaint on the entire content that you mentioned. I >>>>>> was testing the latest paper-drawer-panel on Chrome 44. >>>>>> >>>>> On Fri, Jul 24, 2015 at 3:10 PM, Aleem Mawani <[email protected]> >>>>>> wrote: >>>>>> >>>>> Thanks for the clue - looking at the dev tools, you're correct that >>>>>>> the bad scrolling perf is coming from excessive paints. Turning on "show >>>>>>> paint rectangles" I was able to narrow it down to the >>>>>>> paper-drawer-panel's >>>>>>> main content that was creating the issue. Here is a mimal example that >>>>>>> shows that the main content pain will repaint its entire contents during >>>>>>> scrolling. Seems like an issue with the paper-drawer-panel? >>>>>>> >>>>>>> <!DOCTYPE html> >>>>>>> <html> >>>>>>> <head> >>>>>>> <script >>>>>>> src="/bower_components/webcomponentsjs/webcomponents-lite.min.js"></script> >>>>>>> >>>>>>> <link rel="import" >>>>>>> href="/bower_components/paper-drawer-panel/paper-drawer-panel.html"> >>>>>>> >>>>>>> <style> >>>>>>> .maincontent { >>>>>>> background: #cf9a9a; >>>>>>> overflow: auto; >>>>>>> } >>>>>>> >>>>>>> .sidebar { >>>>>>> background: white; >>>>>>> } >>>>>>> </style> >>>>>>> </head> >>>>>>> <body> >>>>>>> <paper-drawer-panel> >>>>>>> <div class="sidebar" drawer> >>>>>>> </div> >>>>>>> >>>>>>> <div class="maincontent" main > >>>>>>> <div style="height:4000px"></div> >>>>>>> </div> >>>>>>> >>>>>>> </paper-drawer-panel> >>>>>>> >>>>>>> </body> >>>>>>> </html> >>>>>>> >>>>>>> If you load that you'll see that the maincontent div will always >>>>>>> repaint in its entirety. >>>>>>> >>>>>> On Fri, Jul 24, 2015 at 2:30 PM Eric Bidelman <[email protected]> >>>>>>> wrote: >>>>>>> >>>>>> Scrolling issues usually means poort interactions with css selectors >>>>>>>> and style recalcs are causing large paints. That would be my guess. >>>>>>>> That >>>>>>>> doesn't have to do with templating or data binding but it's hard to say >>>>>>>> without seeing your app or knowing more about the code. >>>>>>>> >>>>>>>> Another thing to try is use <template is="dom-if"> to only stamp >>>>>>>> initial DOM that you need. I've seen people create apps with 5000-7000 >>>>>>>> DOM >>>>>>>> nodes on page load. There's never a good idea for any app. >>>>>>>> >>>>>>>> On Fri, Jul 24, 2015 at 4:22 PM Aleem Mawani <[email protected]> >>>>>>>> wrote: >>>>>>>> >>>>>>> Thanks for those. >>>>>>>>> >>>>>>>>> Are there any polymer specific perf issues we should be aware of >>>>>>>>> with respect to data binding or templating? If there are perf issues >>>>>>>>> in >>>>>>>>> this area, would they be relatively easy to spot in the devtools? >>>>>>>>> >>>>>>>>> On Fri, Jul 24, 2015 at 2:20 PM Eric Bidelman <[email protected]> >>>>>>>>> wrote: >>>>>>>>> >>>>>>>> As with any web app, the Devtools Timeline is your best friend when >>>>>>>>>> it comes to anything related to jank (rendering, scrolling, paint >>>>>>>>>> issues): >>>>>>>>>> https://developer.chrome.com/devtools/docs/timeline >>>>>>>>>> >>>>>>>>>> The usual suspects are large paints on scrolling or doing extra >>>>>>>>>> work (layout, etc). Be sure to turn on "Show paint" rects to see >>>>>>>>>> where your >>>>>>>>>> time is being spent: >>>>>>>>>> https://developer.chrome.com/devtools/docs/rendering-settings >>>>>>>>>> >>>>>>>>>> There's also a ton of great content at http://jankfree.org/ to >>>>>>>>>> learn more. >>>>>>>>>> >>>>>>>>>> >>>>>>>>>> On Fri, Jul 24, 2015 at 3:33 PM <[email protected]> wrote: >>>>>>>>>> >>>>>>>>>>> I'm writing a Polymer based app and at some point the UI has >>>>>>>>>>> gotten really slow to render and really slow to scroll. >>>>>>>>>>> >>>>>>>>>>> Does anyone know of any resources or tips on the best way to get >>>>>>>>>>> started debugging polymer performance issues? >>>>>>>>>>> >>>>>>>>>>> Follow Polymer on Google+: plus.google.com/107187849809354688692 >>>>>>>>>>> --- >>>>>>>>>>> >>>>>>>>>> You received this message because you are subscribed to the >>>>>>>>>>> Google Groups "Polymer" group. >>>>>>>>>>> >>>>>>>>>> To unsubscribe from this group and stop receiving emails from it, >>>>>>>>>>> send an email to [email protected]. >>>>>>>>>> >>>>>>>>>> >>>>>>>>>>> To view this discussion on the web visit >>>>>>>>>>> https://groups.google.com/d/msgid/polymer-dev/74af7c92-213c-4bf1-b3fd-30e3f895ee1e%40googlegroups.com >>>>>>>>>>> <https://groups.google.com/d/msgid/polymer-dev/74af7c92-213c-4bf1-b3fd-30e3f895ee1e%40googlegroups.com?utm_medium=email&utm_source=footer> >>>>>>>>>>> . >>>>>>>>>>> For more options, visit https://groups.google.com/d/optout. >>>>>>>>>>> >>>>>>>>>> Follow Polymer on Google+: plus.google.com/107187849809354688692 >>>>>>> --- >>>>>>> You received this message because you are subscribed to the Google >>>>>>> Groups "Polymer" group. >>>>>>> >>>>>> To unsubscribe from this group and stop receiving emails from it, >>>>>>> send an email to [email protected]. >>>>>>> >>>>>> To view this discussion on the web visit >>>>>>> https://groups.google.com/d/msgid/polymer-dev/CADBYpym5hR8p3oKuxEj3Zb_RuGTQ7i4GksNjKkvhGCi-kBXaGg%40mail.gmail.com >>>>>>> <https://groups.google.com/d/msgid/polymer-dev/CADBYpym5hR8p3oKuxEj3Zb_RuGTQ7i4GksNjKkvhGCi-kBXaGg%40mail.gmail.com?utm_medium=email&utm_source=footer> >>>>>>> . >>>>>>> >>>>>>> For more options, visit https://groups.google.com/d/optout. >>>>>>> >>>>>> Follow Polymer on Google+: plus.google.com/107187849809354688692 --- You received this message because you are subscribed to the Google Groups "Polymer" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/CADBYpyn3ax30QVJXjM8it4Ghohxi4qsZwc2duZ5p_CQLzJCd0g%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
