Kilka sztuczek dla Railsów i gemu Turbolinks

Przechowywanie sesji jest dobrą praktyką, ale należy mieć na uwadze wycieki pamięci. Im więcej kodu jQuery zostanie użyte tym większe, będzie prawdopodobieństwo dwukrotnego wczytywania skryptów (albo braku ich wczytywania). Najbardziej powszechny błąd popełniany przez początkujących jest związany z użyciem $(document).ready(), który oczywiście nie jest wywoływany ponownie, ponieważ strona nie została ponownie odświeżona. Zamiast tego lepiej użyć funkcji $(document).on("page:load"); - ale to również nie rozwiązuje wszystkich problemów.

Gem na który zasłużyliśmy, ale nie ten, który potrzebujemy

Jeżeli dla przykładu chcielibyście wyłączyć "turbolinkowanie" dla określonego anchor'a wystarczy dodać do niego klasę data-no-turbolink. Jeżeli posiadacie więcej linków dla których "turbolinkowanie" powinno być wyłączone wystarczy umieścić je w div'ie z tą samą klasą i gotowe. Odwrotnie, jeżeli chcecie przekierować coś przez "turbolinkowanie" gem ten zawiera gotową metodę redirect_via_turbolinks_to, która zrobi to znacznie szybciej.

jQuery? Ależ oczywiście!

 Większość problemów z jQuery i Turbolinks może być rozwiązanych w prosty sposób dzięki gemowi jQuery.Turbolinks. Sprawia on, że funkcja $(document).ready()jest uruchamiana bez względu na to, czy strona została oświeżona, czy też przeładowana z użyciem Turbolinks.

Nie takie proste jak się wydaje

Czasami nawet jeśli użyliśmy już wszystkich sztuczek i w dalszym ciągu nie rozwiązały one wszystkich naszych problemów musimy pójść dalej. Swego czasu napotkałem problemy przy próbie połączenia Turblolinks z Addthis script - skrypt zwyczajnie nie chciał się ładować. Problem polegał na tym, że Addthis ustawiał pewne właściwości window, które nie były wyczyszczone - ze względu na wspomniane wcześniej utrzymywanie sesji. Nie chciałem wyłączać "turbolinkowania" tylko i wyłącznie w celu naprawy jednego małego szczegółu. Dlatego też musiałem znaleźć jakiś niekonwencjonalny sposób na rozwiązanie tego problemu. Zdołaliśmy wspólnie rozwiązać problem poprzez czyszczenie właściwości jedna po drugiej dzięki funkcji, którą napisaliśmy samemu. Poniżej zamieszczam kod tej funkcji:

addthisInit = function() {

  // Remove all global properties set by addthis, otherwise it won't reinitialize
  if(window.addthis) {
       window.addthis = null;
        window._adr = null;
        window._atc = null;
        window._atd = null;
        window._ate = null;
        window._atr = null;
        window._atw = null;
    window.addthis_share = null;
  }


  // Finally, load addthis
  $.getScript("http://s7.addthis.com/js/300/addthis_widget.js#async=1", function(){
    addthis.toolbox('.addthis_toolbox');
  });
    // addthis.init();

  // });
}
$(document).ready(addthisInit);

Następnie pozostało umieszczenie//=require addthis w pliku [layout].js. Mam nadzieję, że to drobne obejście, a także informacje na temat gemu Turbolinks same w sobie oszczędzą Wam czasu na rozwiązanie kilku problemów. Jak zawsze pytania i komentarze mile widziane :)

 

BinarApps

Opublikowaliśmy ten wpis dzięki uprzejmości zespołu z firmy BinarApps. Wpisy o Ruby znajdziecie także na ich blogu

binarapps.com/blog