pushStateを使うとAjaxを使ったWebアプリケーションにも一意のURLを設けられるようになります。また、既に別な画面を表示しているユーザはAjaxでデータの転送量を減らし、最初の表示時はHTMLをレンダリングすると言った仕組みにもできます。 そんなpushStateやURLごとのルーティングを容易に実装できるようにしてくれるライブラリがkazitori.jsです。外部ライブラリ非依存なのでjQueryなど他のライブラリと組み合わせて使うこともできます。

サンプルのコードです。

class Router extends Kazitori
  beforeAnytime:["testBefore"]
  befores:
    '/<int:id>':['testShow']
  routes :
    '/':'index'
    '/</int:id><int:id>':'show'
    '/<string:username>/<int:id>':'post'

  index:()->
    # console.log "index"
    $('.currentPage').empty().append "this page is index"

  show:(id)->
    # console.log id
    $('.currentPage').empty().append "this page is test" + id

  post:(username, id)->
    $('.currentPage').empty().append username + "post " + id

  ###
    some before handlers
  ###
  testBefore:()->
    console.log "before!"
  testShow:()->
    console.log "before show"


$(()->
  window.App = new Router({root:'/'})
  $('.test').on "click", (event)->
    event.preventDefault()
    target = event.currentTarget.pathname
    #url を変更
    window.App.change(target)
)

デモアプリです。

pushStateを使って操作できます。

管理ページに入りました。

ルーティングの仕組みはBackbone.jsに似ていますね。さらにbefore filterのような仕組みはRails的に使えます。URL設計が複雑になっても見通しの良いルーティングが実現できるようになっています。 なおIEはpushStateに対応していないブラウザは#(ハッシュ)で処理されるようになっています。URLを変更する時に window.App.change(target) でできるのがいい感じです。 Backbone.jsのルーティングは分かりやすいですが、他の機能は使いたくないというケースはあると思いますので、そんな時にkazitori.jsを使ってみるのは面白そうです。 kazitori.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。 js で URL を動的に変更できる pushState をイイカンジにさばいてくれる kazitori.js を作った | デブ ハゲ kazitori.js Example glassesfactory/kazitori.js</int:id></string:username></int:id>