pjaxって #TechLunch

pjaxって #TechLunch

pjaxって
2013/09/18 (水) @ Livesense TechLunch
発表者:春日 太志

E60aa4f80303f3f386898546ddb3686a?s=128

Livesense Inc.

April 21, 2014
Tweet

Transcript

  1. pjaxってどうなの? 社内では悪い噂しか聞かないけど...

  2. pjaxってなんなの? 使ったことないけど...

  3. push state + ajax ブラウザ履歴操作 + 非同期通信

  4. 一時期 #! が議論されていた Ajax サイトをクロールするため

  5. ajax 周りは library が よろしくやってくれるとして

  6. None
  7. ←戻る window.history.back() window.history.go(-1) window.history.go(-2)

  8. 進む→ window.history.forward() window.history.go(1) window.history.go(2)

  9. 履歴数 window.history.length // 5だったら -4 〜 4 まで go() に指定できる

  10. 履歴に追加してURL更新 window.history.pushState({}, ‘title’, ‘/path’) // 第1引数は window.history.state や window.onpopstate の

    イベントハンドラで取得できるオブジェクト。上限640KB。それ以 上は session storage や local storage を使用するのが推奨さ れる。なお、popstate イベントは「戻る」「進む」で発生。 // 第2引数はページタイトルを指定できる予定で今は無視される // 第3引数はURLパスで、別ドメイン指定や https 画面からの http 指定などは security error が発生。指定しない場合は現在 のURLパスになる。
  11. None
  12. 履歴に残さずURL更新 window.history.replaceState({}, ‘title’, ‘/path’) // 引数は pushState() と同じ。 // 履歴に残らないので「戻る」「進む」できない画面になる

  13. ブラウザ対応状況