allcake添加turbolinks
August 25, 2014
Turbolinks使站内跳转更快，原理是Turbolinks监听了页面内的链接，跳转页面用ajax请求并替换body内容，不用重新解析已加载的静态资源, 同时通过pushState修改地址栏地址。
####有多快？
看你的网站有多少静态资源，越多提升越大。
有依赖吗?
没有。
属性
- data-turbolinks-track 检查服务器端静态文件是否已修改，如有重载页面
- data-no-turbolink 关闭元素Turbolinks访问
- data-turbolinks-eval 设置为false的时候，直接访问的页面时才会执行，通过Turbolinks访问则不会执行
事件
使用Turbolinks，站内跳转没有重新刷新整个页面，因而 DOMContentLoaded和jQuery.ready()会失效。
请求页面，加入了以下事件：
- page:before-change 点击链接
- page:fetch 客户端开始ajax请求新页面
- page:receive 服务器端已接受ajax请求
- page:before-unload 客户端准备渲染新页面
- page:change 客户端已切换到新页面
- page:load 客户端处理完成
默认，Turbolinks会缓存10个单位的资源， 你也可以自行设置。
// View the current cache size
Turbolinks.pagesCached();
// Set the cache size
Turbolinks.pagesCached(20);####手动触发Turbolinks跳转：
//js
Turbolinks.visit(path)
//rails
redirect_via_turbolinks_to兼容性
- Safari 6.0+
- IE10+
- 最新版Chrome和Firefox
使用
初次使用，还没遇到大坑，页面浏览体验提升了很多。
# Turbolinks makes following links in your web application faster. Read more: https://github.com/rails/turbolinks
gem 'turbolinks'
# incase turbolinks do not call document’s ready event.
# Usage: //= require jquery.turbolinks
gem 'jquery-turbolinks'
# Usage: //= require google-analytics-turbolinks
gem 'google-analytics-turbolinks'
# Usage: //= require turbolinks.redirect
gem 'turbolinks-redirect'//= require jquery
//= require jquery.turbolinks
//= require jquery_ujs
//= require turbolinks
//= require google-analytics-turbolinks
//= require turbolinks.redirect
//= require_directory .
Turbolinks.enableProgressBar();
Turbolinks.enableTransitionCache(); <%= stylesheet_link_tag 'application', media: "all", "data-turbolinks-track" => true %>
<%= javascript_include_tag 'application', "data-turbolinks-track" => true %>更多阅读
jQuery, Turbolinks and Asset Pipeline
Faster page loads with Turbolinks