[pushState] jquery.pjaxなクライアントとExpress4＋ECTなサーバサイドのWebアプリサンプル

jquery.pjaxとは、ブラウザ履歴をプログラムから操作できるHTML5のAPI「pushState」を便利に実装したjqueryプラグインです。ajaxを使ったWebアプリでは、画面遷移が発生しないのでサクサク動くというメリットがある反面、画面が変化してもURLが変わらないためにSEOで不利というのがデメリットでした。しかしHTML5のpushStateのお陰でそのデメリットもやっと解消されることになりました。jquery.pjaxを使えば、pushStateを簡単に使うことができます。
今回ご紹介するのは、jquery.pjax.js (クライアントサイド) と express4 (サーバサイド) を使ったpjaxなWebアプリの超簡単なサンプルです。

[HTML5] pushStateでajaxアプリでもブラウザ履歴を使ってみるサンプル

pushState はブラウザに履歴を追加するHTML5のAPIです。pushState を利用すれば、ajaxを多用しているページでもブラウザの「戻る」「進む」ボタンを使って自然な履歴操作を実現することができます。
以下は pushState を利用して擬似的な画面遷移を実現するサンプルアプリです。