This is part of the description that you can find on Turbolinks github project Turbolinks it is being included by default in Rails 4 and it is easy to see why, it would greatly increase the speed of your app, especially in big project with tonnes of js and css. Here is a small guide of stuff to consider when we use it.
On turbolinks the ready event of the document only triggers ones, on the initial page load, so every code that listens for that event will only triggered ones.
Instead, turbolinks gives you a range of events to deal with the lifecycle of the page:
page:fetch starting to fetch the target page. page:load fetched page is being retrieved fresh from the server. page:restore fetched page is being retrieved from the 10-slot client-side cache. page:change page has changed to the newly fetched version.
Instead of only bind your events on document ready you will must to set it to page:load event too:
ready = -> $('#link').click -> $(this).parent('form').submit() $(document).ready(ready) $(document).on('page:load', ready)
Or you can use jQuery Turbolinks a gem that automates this behaviour.
Another approach is change the way of listen the events, instead of selecting elements and listening the event we can listen to the document's event and check if the element that caused the event it is the one that we want to listen.
$(document).on 'click', '#link', -> $(this).parent('form').submit()
Either way, I think is a small price to pay for the speed you would get in exchange.
All internal links within a page automatically Turbolinks enabled. If you would like certain containers and links to not be enabled, add data-no-turbolink to the element.
<div data-no-turbolink> ... </div>
Turbolinks is designed to work with any browser that fully supports pushState and all the related APIs.
- Safari 6.0+
- Chrome 5.0+
- Firefox 4.0+
By Pablo Monfort
Check out our News page: