title: How to synchronize multiple Backbone.js fetches?
body: <p>I’m a bit new to Backbone.js, but am already impressed by everything it can do for me, and am trying to learn the patterns and best practices now.</p>
  
  <p>I have two collections:</p>
  
  <pre><code>var CollA = Backbone.Collection.extend({
      model: ModelA,
      url: '/urlA'
  });
  
  var CollB = Backbone.Collection.extend({
      model: ModelB,
      url: '/urlB'
  });
  
  var collA = new CollA;
  var collB = new CollB;
  </code></pre>
  
  <p>When loading my app, I need to fetch both of these collections from the server, and run some bootstrap code when it’s guaranteed that both fetches have completed.</p>
  
  <p>Here’s how I did it for now:</p>
  
  <pre><code>collA.fetch({success: function() {
      collB.fetch({success: function() {
          // run the needed code here.
      }});
  }});
  </code></pre>
  
  <p>This works, the needed code is guaranteed to run only after both fetches complete successfully. It is clearly inefficient though, because the fetches run serially, one after another.</p>
  
  <p>What would be a better pattern to do this, to run the fetches in parallel and then run some code once both fetches have completed successfully?</p>