HTML5 Developer Conference header
  • Sumit Amar
  • Tech Lead, Microsoft

Sumit Amar is a UI developer/architect and has worked on optimizing several Microsoft products for performance and usability including adCenter, Bing, Microsoft.com, Dynamics ERP, and Cloud TV etc. He has worked in Microsoft Redmond, Vancouver, Copenhagen, and Silicon Valley campuses.

He has an MBA in IT and Systems and is currently working on his dissertation for PhD in Computer Information Systems.

Sumit has spoken in Web 2.0 Expo, TechEd, TechReady, and other Microsoft internal conferences.

Session

  • Memory Management for Smooth Infinite-Scrolling
  • Time: Tuesday @ 11:40am | Room E-132

Using HTML5 APIs to render could provide a native-like experiences on mobile devices. However, implementing ""infinite scrolling"" could be a challenge on these devices including tablets when the content contains images, because of the RAM limitations. Soon as the content increases (more DOM elements are added), the experience starts to get jittery and flickery. Part of the reason also is the blocking of UI rendering thread when inertia/momentum scroll takes place on some platforms.


The experience can be kept jitter and flicker free if the DOM size is kept in check. This talk will present some best practices to manage allocation of memory when rendering items infinitely. Talk will cover exercises to keep the DOM as small as possible with respect to images. Specifically we'll discuss removing swiped-away images from the DOM but keeping their metadata i.e. URL etc. on client side serializable data structures (stack and hashtable), in order to be able to restore them in the future. Talk will cover mechanisms to restore images/content and adding it back to the DOM when the content scrolls into viewport. It will cover progressively adding back items in the case of normal smooth scroll (using a stack), as well as when a drag affect or fast momentum based scrolling takes place (using a hash table where keys would represent pixel ranges, and values will be the image URLs).


In addition to tips and tricks on fixing memory issues in smooth infinite scrolling, this talk will go over usage of memory profiler, and JS Profiler tools in the browsers (IE and Chrome).

Media

Slides (.ppt)
Sponsors

Interested in
being a sponsor?

Contact us at
cu@html5devconf.com

Newsletter Signup
Signup for our newsletter today!