🥇 Carregamento de página mais rápido com Turbolinks

A Rails lançou sua gem Turbolinks , que é um pequeno trecho de JavaScript que carrega suas páginas via AJAX. O resultado líquido é um aplicativo que parece mais ágil.

Aqui está um guia para as advertências da Turbolinks que obtive por experiência própria.

Ordem de carregamento

Você precisa ter esta ordem de carregamento abaixo:

jQuery
jQuery.turbolinks
… outros scripts vão aqui …
Turbolinks

O motivo de jQuery.turbolinks estar antes de todos os scripts é permitir que ele sequestre a $(function() { ... })chamada que seus outros scripts usarão.

Então, os turbolinks precisam estar no final porque tem que ser o último a instalar o manipulador de cliques, para não interferir em outros scripts.

Scripts na cabeça

Você pode colocar seus scripts no final da <body>tag. Se você estiver usando Turbolinks, mova-os de volta para <head>. A razão para isso é que o Turbolinks funciona trocando o <body>ao alterar as páginas e, ao fazer isso, executará novamente todos os seus scripts de terceiros (imagine o jQuery sendo reavaliado), o que pode não ser o que você deseja.

os scripts principais NÃO devem mudar

Sempre presuma que todas as páginas habilitadas para Turbolinks devem ter o <head>conteúdo. Se alguma página não se ajustar a esse padrão, refatore-a ou desative-a dos turbolinks ( <a href='...' data-no-turbolink>).

Carregando spinner

Você VAI precisar de um indicador de carregamento! Isso deve ser muito fácil de fazer:

$(document).on('page:fetch', function() {
  $(".loading-indicator").show();
});
$(document).on('page:change', function() {
  $(".loading-indicator").hide();
});

Todos os sites da Turbolinks precisarão disso, caso contrário, parecerá muito estranho clicar em um link e não fazer nada.

Integração do Google Analytics

Se você colocar o script do Google Analytics no seu <head>(como o Google recomenda), ele será acionado apenas uma vez e não será acionado novamente ao alterar as páginas através de Turbolinks.

Você precisa disparar manualmente o trackPageviewem cada carregamento de página:

<body>
   <script>_gaq.push(['_trackPageview']);</script>
   ...the rest of the body here...
</body>

… também, certifique-se de modificar o snippet do Analytics para não fazer isso '_trackPageview'automaticamente.

Algumas pessoas recomendam colocá-lo em um manipulador, o que eu acho uma solução muito ingênua que deve ser evitada, pois significa que os navegadores mais antigos não registram visitas ao Analytics.page:change

Usando turbolinks fora do Rails

Turbolinks são simplesmente duas coisas:

Um script JavaScript
Um pequeno shim do lado do servidor para usar como oX-XHR-RefererReferrer

Você pode usar o script JavaScript em seu projeto não Rails, apenas esteja ciente da advertência do Referrer.

integração jQuery

Primeiro de tudo, você provavelmente está usando jQuery. Confira jQuery.turbolinks , que sequestra todas as chamadas para carregar toda vez que a página é carregada por meio de Turbolinks.$(function() { ... })