locked
WinJS List view rendering slow in Surface RT

    Question

  • Hi,

    I have a list view that has 48 items to be shown. Each item represents data in table format (10 * 10 cells).

    Currently the items is divided into cells using divs. So there are quite a lot of nested divs. Initially I used table but the performance then was also very slow.

    The problem is that the list view takes a lot of time to render the items.

    I also have a functionality to scroll to certain items (under some conditions). Because the render is so slow, users see a flicker (when the scroll finally happens).

    In Surface RT, it has the worst performance. Any idea what can improve the performance ?

    I removed the List view and went with plain HTML div with data bind. The issue is still there, because I have binding

    - Girija

    Tuesday, January 15, 2013 2:13 AM

Answers

  • The ListView has some parameters that let you customize the page threshold (how many pages are loaded into memory besides the one currently in view) and also the number of items per page, you could tweak those values and see if that improves the performance.

    Performance depends also on the content of the item, showing a 10x10 table in each div when they are filled with images or when they are filled with text are two different scenarios.

    If you want to tweak performance I would recommend reading pages 205+ of Microsoft Press free Ebook Programming Windows 8 Apps with HTML/CSS and JS which discusses the use of Renderers instead of HTML templates. Renderers can really improve the performance of a Listview,  depending on the content there are different renderer patterns that might help you, on page 225 there is a list and a few pages later examples of each of them.

    PD: There are also MSDN Examples for optimizing performance on a ListView

    • Marked as answer by Girija Beuria Tuesday, March 19, 2013 9:49 PM
    Tuesday, January 15, 2013 3:14 AM
  • Hi,

    Since my requirement was more or less static UI, we have removed list view and gone for plain dynamic HTML.

    What I have seen is that if you have a complex layout (having table) for list view items , the performance is generally slow. If layout for listview item is simple, list view renders fast.

    - Girija

    • Marked as answer by Girija Beuria Tuesday, March 19, 2013 9:49 PM
    Tuesday, March 19, 2013 9:49 PM

All replies

  • The ListView has some parameters that let you customize the page threshold (how many pages are loaded into memory besides the one currently in view) and also the number of items per page, you could tweak those values and see if that improves the performance.

    Performance depends also on the content of the item, showing a 10x10 table in each div when they are filled with images or when they are filled with text are two different scenarios.

    If you want to tweak performance I would recommend reading pages 205+ of Microsoft Press free Ebook Programming Windows 8 Apps with HTML/CSS and JS which discusses the use of Renderers instead of HTML templates. Renderers can really improve the performance of a Listview,  depending on the content there are different renderer patterns that might help you, on page 225 there is a list and a few pages later examples of each of them.

    PD: There are also MSDN Examples for optimizing performance on a ListView

    • Marked as answer by Girija Beuria Tuesday, March 19, 2013 9:49 PM
    Tuesday, January 15, 2013 3:14 AM
  • Hi Ealsur,

    Thanks for the response. In the 10*10 div I only bind these properties(InnerText, background color and font color). It is not slow on my laptop but when I move to surface it is very slow.

    I have tried both templating functions and static HTML templates, both give me same result.

    - Girija

    Tuesday, January 15, 2013 5:26 AM
  • Does the Surface show less items than your laptop? How many items on-screen does it show? Maybe its a matter of how many items are visible at the same time, probably Surface has less resources than your laptop and you don't notice the performance loss on it.
    Tuesday, January 15, 2013 12:01 PM
  • Hi,

    Since my requirement was more or less static UI, we have removed list view and gone for plain dynamic HTML.

    What I have seen is that if you have a complex layout (having table) for list view items , the performance is generally slow. If layout for listview item is simple, list view renders fast.

    - Girija

    • Marked as answer by Girija Beuria Tuesday, March 19, 2013 9:49 PM
    Tuesday, March 19, 2013 9:49 PM