17 thoughts on “Google I/O 2012 – Jank Busters: Building Performant Web Apps

  1. I understand Google has the challenge of supporting just a ton of different devices … but i have to say … ran into "janky" performance issues on a new 2014 android device and found i needed to remove box-shadows to fix scrolling issues …. did you ever make ANY progress with these issues? I mean honestly, i love what google is doing, but it is impossible not to notice that the iphone / ios performance FAR surpasses the android platform. That same page with box-shadows and a ton of other styles just works on the iphone … nice and smooth … these issues with styles and even image sizes, even retina images … they just aren't really an issue on the iphone …. whats up google? Any luck?

  2. Why does running JavaScript still block the UI thread in Chrome for PCs? If processor-intensive JavaScript runs in a certain tab, and I try to scroll at the same time in desktop Chrome, it's either laggy or it doesn't scroll at all. On Android Chrome, however, this doesn't happen. How come?

  3. @dsego84 it is not true. now chromium's hidden technology is 3 times more elaborate and complicated than safari's. I think safari team feels that they can not overcome chromium anymore.

  4. Chromium is intended for developers and has a lot of unreleased features because they're still in production but they help developers. Things like convert CSS to SASS and revisioning.

  5. It's because they already retrieved the layout calculation. Note the code at 13:08. Line 57 says if heavy scroll which is what he toggles on his demo. This forces line 58 to run, which retrieves the scrollTop from the body, forcing a calculation of the DOM, but line 54 shows that he already asked for this.

    When he toggles off heavyScroll rather than use line 58 it uses 60 in the else statement. Here it makes use of the cachedScrollTop thereby not forcing yet another recalculation.

  6. sorry i don't get what happened around 14:40 that made the event less delay. was the scrolltop cached?

  7. This is a very good talk: your explanations and recommendations and demos are clear, you handle the questions well and frankly. Thanks.

  8. setAnimationFrame seems frame locked at 30Hz on Firefox. So, it turns out … setTimeout is a drop-in replacement for setAnimationFrame, for me, on Firefox. 🙂

  9. Worth noting that although jQuery says it works with requestAnimationFrame, it actually does not (look at the source!)

    good talk

  10. Very Very Good Talk. I continue to find numerous ways of speeding and smoothing my web apps, and this talk showed me some new ones I had never heard of!

Leave a Reply

Your email address will not be published. Required fields are marked *