Posts Rails 4 Turbolinks
Post
Cancel

Rails 4 Turbolinks


What is it?

	gem 'turbolinks'

“This is a gem that works similar to pjax, but instead of worrying about what element on the page to replace, and tailoring the server-side response to fit, we replace the entire body. This means that you get the bulk of the speed benefits from pjax (no recompiling of the JavaScript or CSS) without having to tailor the server-side response. It just works.”

PJAX

Uses AJAX and PushState to deliver a faster browsing experience by only loading and updating parts of the page HTML each page load. PushState makes it possible to add real permalinks, page titles, and a working back button so that your visitors won’t be able to tell the difference between PJAX page load and ordinary full page loads.

Tutorial

Using the gem

Gemfile:

	gem 'turbolinks'

Add this line on app/assets/javascripts/application.js:

	//= require turbolinks

app/views/layouts/application.html.erb:

<%= stylesheet_link_tag    "application", media: "all", "data-turbolinks-track" => true %>
<%= javascript_include_tag "application", "data-turbolinks-track" => true %>

If you wont use Turbolink in some link, you can manually exclude:

<a href="/examples" data-no-turbolink>Examples</a>

“With Turbolinks pages will change without a full reload, so you can’t rely on DOMContentLoaded or jQuery.ready() to trigger your code. Instead Turbolinks fires events on document to provide hooks into the lifecycle of the page.” Runtime Dependencies coffee-rails, but if you want use javascript.You can manually download and compile the turbolinks.js.coffee to JavaScript.

ready = ->

  ...your coffeescript goes here...

$(document).ready(ready)
$(document).on('page:load', ready)
var ready;
ready = function() {

  ...your javascript goes here...

};

$(document).ready(ready);
$(document).on('page:load', ready);

Turbolinks Project

Railscasts Turbolinks


Updated May 12, 2020 2020-05-13T06:35:06+08:00
This post is licensed under CC BY 4.0