One speaker at Fluent 2013 whose talk was particularly well received was Todd Kloots of Twitter who spoke about HTML5’s pushState API and demonstrated how it was used in Twitter’s Web-based interface.
Some key parts of Todd’s talk include:
- The opportunity Twitter saw in pushState [at 01:45]
- What you had to do with dynamic URLs before pushState [at 02:46]
- A summary of the pushState API [at 06:10]
- Gotchas and browser support [at 07:58]
- How pushState sped up navigation on Twitter.com without re-architecting [at 12:15]
- What Twitter had to do server-side to make progressive enhancement work [at 19:11]
- Final thoughts [at 31:37]
- Q&A [at 32:15]
Twitter coupled pushState with server-side rendering to increase the performance of their Web-based interface. Rather than have browsers jump to an entirely new page, new pages would be requested through Ajax requests, rendered straight into the existing DOM, and pushState would then manipulate the browser so that the browser’s history looked as if a totally clean page had been loaded.