I'm building a todo-app from this tutorial and it's source code can be found here.
My understanding is that once you call Backbone.history.start(), the script will tell the browser to cache all the pages that you visit within the domain of the page. The state of each page is saved onto the cache and is mapped to the url that comes after the # sign. But how does this resolve when the script is calling a new app.TodoList() each time it's being ran? Doesn't this new collection replace the old one from the cache each time this script is ran? Is there something happening behind the code that tells the script to not run new app.TodoList() if it's on a page that the browser has already cached?
No, browser doesn't cache pages, or state of your app with the history. Only URLs are saved. You can then use the Router to listen to URL changes and update the state of your app. When you open a URL of your app, go back and forward, that will trigger corresponding route callbacks in your router, and you would use those callback functions tied to the routes to update the state of your app.