Proper use of bound collection observed by @each or @repeat elements

Bound collections

Bound collections are arrays or objects placed inside namespaces bound with DOM:

namespace Data {
  var listOfRecords = [];
  ...
} 

And markup:

<main model="Data">
  <ul>
    <li repeat="record in listOfRecords">
      ... repeatable bound item ...
    </li>
  </ul>

Note how  <li> elements are bound with items in Data.listOfRecords collection.

Proper updates of bound collections

In order +plus framework to work optimally bound data collections shall not be recreated but rather updated. 

While something like this:

Data.listOfRecords = fetchRecordset();

will work it may produce far from optimal results.

Instead you should update collections without recreating them. 

Correct examples: 

Data.listOfRecords.merge(fetchRecordset()); // merge array with new data
Or
Data.listOfRecords.splice(0,Data.listOfRecords.length,fetchRecordset()); // replace array data

WARNING

Ignoring this rule may lead to memory leak alike behavior in your application.