Chapter 5. The History API: changing the game for MVC sites

 

This chapter covers

  • Understanding the basic operation of the History API
  • Integrating MVC with the HTML5 History API
  • Controlling history in a web application

Suppose you’re building a newsreader application for the web and want to incorporate a search feature for things like images, people, and places. You build a responsive HTML5 interface with a popup <div> that allows a user to cycle through multiple tabs refining the search. In the background you’re using Ajax and jQuery to ping the server for hit counts based on each updated criteria. What do you think will happen when the user cycles through three tabs adding criteria and then, out of force of habit, hits the Back button? Unless you’re using the jQuery.address plugin or something similar, the browser will load the previous web page and lose the search. The user will be annoyed.

Not anymore. Thanks to the HTML5 History API, the game has changed. Using the techniques we’ll illustrate in this chapter, you’ll learn to use ASP.NET MVC’s routing and partial view capabilities to build a site suitable for both old and new browsers. The site will work in the “normal” way in older browsers but it’ll be more responsive and consume less bandwidth in newer browsers, because pages will be accessible in two modes:

5.1. Building a History-ready MVC site

5.2. Using HTML5 History

5.3. Two more small steps ...

5.4. Summary

5.5. The complete JavaScript library