title: KnockoutJS, batch update observableArray?
body: <p>I have following scenario:</p>
  
  <p>A list of items represented by observableArray, besides the content/title etc. I would like to make each of them collapsible in view.</p>
  
  <p>Now the problem becomes if I should store this state as each item's observable: <strong>if so how do I implement a trigger that toggle all items open/close efficiently</strong> - ie. minimize the dom update.</p>
  
  <p><strong>ko.utils.arrayForEach</strong> seems like the way to go, does it trigger view refresh only at the end of loop? is there a better way?</p>
  
  <pre><code>ko.utils.arrayForEach(this.items(), function(item) {
      ...
      item.close(true);
      ...
  });
  </code></pre>
  
  <p><strong>EDIT</strong>: this is what's happening in the DOM (inside the knockout foreach loop)</p>
  
  <pre><code>&lt;div class="item"&gt;
      &lt;!-- ko 'if': !close() --&gt;
      &lt;div class="article" data-bind="html: article"&gt;&lt;/div&gt;
      &lt;!-- /ko --&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>So basically I can click a button somewhere on this page, which run ko.utils.arrayForEach that toggle all items. It works, I just don't know if it's the best way (eg. only trigger dom update once instead of for each item).</p>