title: Have an ObservableCollection update the UI as elements get added in
body: <p>I'm writing a silverlight app and I'm trying trying to improve the loading time.</p>
  
  <p>When my page loads, I first initialize my ObservableCollection:</p>
  
  <pre><code>        this.MyItems = new ObservableCollection&lt;Item&gt;();
  </code></pre>
  
  <p>My UI is a ListBox which I bind to an ObservableCollection through code. In MainPage_Loaded:</p>
  
  <pre><code>        MyList.ItemsSource = App.ViewModel.MyItems;
  </code></pre>
  
  <p>Now I bind the UI to my model. I expect this to be efficient as the collection is empty, and the rest of the UI can continue to load (not sure if my assumption is correct).</p>
  
  <pre><code>        DataContext = App.ViewModel;
  </code></pre>
  
  <p>Now I want to add items to my collection:</p>
  
  <pre><code>        for (int i = 0; i &lt; number_of_items; i++)
          {
              this.MyItems.Add(myItems[i]); // myItems is a List&lt;Item&gt; already populated
              Thread.Sleep(20);
          }
  </code></pre>
  
  <p>My goal was to let the thread sleep so that it would have time to render the UI for each list box item. Also, I expected my UI to display one item at a time.</p>
  
  <p>The result is that the ListBox elements appear altogether at once. If I set a Sleep of 1 second, the ListBox gets populated after 1 second times the number of elements.</p>
  
  <p>What's the good way of optimizing this operation? If it's futile, I may also just bind my ListBox to a fully populated ObservableCollection. Thanks!</p>