title: Are there best practices/patterns for synchronizing local and remote data in SPA (html5 single page applications)?
body: <p>I'm writing a simple "todo - helloworld" with jqueryMobile + knockout + breeze + WebAPI
  to learn about SPAs (Single Page Application) in a mobile context (unreliable internet connection)</p>
  
  <p>To enable offline usage the WebApp will leverage</p>
  
  <ul>
  <li>Application Cache</li>
  <li>Localstorage</li>
  </ul>
  
  <p>The App should use whenever possible remote database for loading and saving data, but should be able to seamlessly switch to localstorage when offline and synchronize local/remote changes when back online.</p>
  
  <p>Now back to the question:
  the App will use Breeze's EntityManager for managing data (local cache and remote sync)</p>
  
  <ul>
  <li>"remoteDb"</li>
  </ul>
  
  <p>To mitigate inconsistency/concurrency problems I would use 2 localstorage Keys:</p>
  
  <ul>
  <li>"localDb" for a local copy of the remote database (list of todos)</li>
  <li>"localPendingChanges" for changes the App wasn't able to submit to the remote database</li>
  </ul>
  
  <p>so the flow would more or less be (pseudocode):</p>
  
  <pre><code>LoadData
    if(online)
      load remoteDb
      save localDb                   // save a local copy of the fresh loaded remotDb
      if(localPendingChanges)
        load localPendingChanges     // we are merging in the Breeze entityManager remote data with localPendingChanges
        Savedata                     // we are online and we have pending changes, so we should sync everything back to the remoteDb as soon as possible
    if(offline)
      load localDb
      if(localPendingChanges)
        load localPendingChanges     // we are merging in the Breeze entityManager local data with localPendingChanges
  
  SaveData
    if(online)
      save remoteDb
      clear localPendingChanges      // until we are online there is no need to keep localPendingChanges
      LoadData                       // we are loading data from remoteDb to update our localDb to the latest version
    if(offline)
      save localPendingChanges       // we are saving only the changes to localstorage
  </code></pre>
  
  <p>What do you think about this approach? Is it a mess? Is it ok?
  What about concurrency problems in a multi user scenario?</p>