Is it normal for polymer's iron-list element to load a bunch of unused/hidden list items, even though it is actually only passed a much smaller number of array items to its items
attribute?
I have an iron-list that is currently passed an array 4 items long, but is provided screen real-estate for a much longer list if needed. Yet, when I inspect the rendered iron-list element in Chrome, within its 'items' div is 4 visible items and 16 hidden items. I'm thinking this might have something to do with preparing for scrolling/paging of the list? If so, is there a way to prevent the iron-list from doing all of the work of readying item templates that are not needed for smaller arrays?
I'm noticing a similar occurrence elsewhere in my app, where an iron-list is provided an array with length of 1. This is really problematic in that case, as the item template for this list contains a more complex custom element, which is then 'readied' 20 times instead of once. This really has a huge impact on the app's load time/performance.
Hoping there is a simple solution here, and I don't have to reconsider my use of iron-list in this app. Perhaps I'm doing something incorrectly. Thanks!
It does appear that someone has raised this issue on GitHub as well: https://github.com/PolymerElements/iron-list/issues/55
It is actually preferable to use dom-repeat templates for known fixed-length array of items, particularly shorter length array of items. Therefore, iron-list was being mis-used in my example above (at least for its intended purpose that is). Refer to related GitHub issue and recommendation: