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/CADBYpym8Csmhkf2_gAwkoUZpaHnbGdiEpzgwE34Kaacj2Dg1tw%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
