How to show page loading between pages

Question

I am not sure if all Rails app behave the same or is it just within my app's setting. For my app when a page is loading (So the moment when a link is clicked until the content is responded from the server) there is no indication of page loading at all. In general website during the page load there would be a spinning wheel in the place of the favicon to show that the page is loading. I am using Rails 4.0.0 on Heroku.

Answer 1

From Turbolinks, something like?

$(document).on('page:fetch', function() {
  // show spinner
});

$(document).on('page:change', function() {
  // hide spinner
});

Update for Turbolinks 5

For Turbolinks 5:

$document.on('turbolinks:click', function() {
  // show spinner
});

$document.on('turbolinks:load', function() {
  // hide spinner
});

If you are using jQuery and your spinner is in the div.spinner, you can show and hide it with:

$(document).on("turbolinks:click", function(){
  $(".spinner").show();
});

$(document).on("turbolinks:load", function(){
  $(".spinner").hide();
});

Answer 2

Rails uses turbolinks by default.

Please take a look at turbolinks and how it works. It basically replace the body of the page instead of making a new request, that's why you don't see the loading indication in the browser.

If you want to see your page loading you can either disable turbolinks, removing it from application.js, or use a gem like this one: https://github.com/caarlos0/nprogress-rails to show the actual loading of the page.

I strongly suggest you to keep turbolinks and go with the second option I gave you.