Sono abituato ad attaccare il mio JS nella parte inferiore dell'elemento del mio corpo (come per HTML5Boilerplate), ma dal TurboLinks, che sarà on by default in Rails 4, ricarica il corpo (e il titolo) su ogni richiesta, avrebbe senso per mettere il mio JS in testa d'ora in poi? Ci sono ancora guide decenti o buone pratiche su questo?Rails 4 + Turbolinks: JS nella testa o nella parte inferiore del corpo?
risposta
Anche precompilato application.js (come per la pipeline delle risorse) è attivo e in testa per impostazione predefinita. Il ragionamento è che anche se js è caricato prima del resto della pagina, poiché js è sempre lo stesso verrà caricato dalla cache dalla seconda richiesta in poi, quindi non c'è un motivo valido per servirlo nella parte inferiore del corpo più.
Se si utilizza Turbolinks 5, ora è possibile inserire i turbolinks nella parte inferiore del corpo (e seguire le best practice di sviluppo Web per il rendering di una pagina). Questo aiuta anche con SEO mai così poco. Basta aggiungere gli script per la parte inferiore del corpo e aggiungere
data-turbolinks-eval="false"
al tag script. Ciò impedirà ai turbolinks di valutare dopo il il caricamento iniziale della pagina. Ecco come si è fatto con l'javascript_include_tag
:
<%= javascript_include_tag 'application', 'data-turbolinks-eval' => 'false'%>
poi basta usare
$(document).on('turbolinks:load', function() { // code to be executed when use changes pages });
- 1. Ember renderizzata nella parte inferiore del DOM
- 2. Android - Schede nella parte inferiore dello schermo
- 3. Inserisci gli script nella parte inferiore
- 4. Javascript - testa, corpo o jQuery?
- 5. Fare un piè di pagina CSS o sedersi nella parte inferiore della finestra del browser o nella parte inferiore del contenuto
- 6. ScrollView aggiunge ampio spazio nella parte inferiore
- 7. Inserisci appbarLayout nella parte inferiore dello schermo
- 8. 2 righe, prima nella parte superiore e la seconda nella parte inferiore del genitore
- 9. Cacao: origine NSView x nella parte inferiore
- 10. meno 20 pixel nella parte superiore e inferiore del div
- 11. Highcharts: valore minimo dell'asse y nella parte inferiore del grafico
- 12. Tracciare il titolo nella parte inferiore del grafico utilizzando ggplot2
- 13. Elemento di ancoraggio nella parte inferiore del menu Ionico
- 14. legenda orizzontale nella parte inferiore del grafico in jqplot
- 15. JavaScript esterno - corpo o testa?
- 16. Android ScrollView e pulsanti nella parte inferiore dello schermo
- 17. Spostamento degli script del toolkit Ajax nella parte inferiore della pagina
- 18. Mantieni stdin line nella parte superiore o inferiore della schermata del terminale
- 19. div nella parte inferiore della finestra, non pagina
- 20. Aggiungi sfumatura sfumatura nella parte inferiore di uitableviewcell/uiimageview
- 21. Bootstrap 3 a discesa non funziona con Rails 4 & Turbolinks
- 22. Come si posiziona un'immagine nella parte inferiore di div?
- 23. Come visualizzare l'annuncio nella parte inferiore dello schermo senza sovrapposizione
- 24. Listview - Piè di pagina nella parte inferiore dello schermo
- 25. Posizione MBProgressHUD nella parte inferiore/superiore dello schermo
- 26. Schede nella parte superiore e inferiore dello schermo
- 27. UITableView, il footer resta nella parte inferiore dello schermo?
- 28. Come disattivare il messaggio di avviso nativo nella parte inferiore
- 29. Commenti di Facebook w/Rails 4 e Turbolinks
- 30. Aggiungi barra di avanzamento nella parte inferiore di un listview
grazie, che è abbastanza buono per me :) – stephenmurdoch
si memorizza nella cache il file, ma ancora bisogno di aspettare per caricare il js (se è caricata l'intera pagina), vero? Un attributo 'async' non fornirebbe i vantaggi dell'aggiunta al fondo senza essere ricaricato da Turbolinks? – michelpm
Con le risorse basate su pignoni normali delle rotaie, si avrà un file j compresso e limitato che di solito è memorizzato nella cache del browser. Il tempo di caricamento (come in "caricare il codice") è comunque una frazione del download totale + attesa + tempo di caricamento per js. In ogni caso, TL carica semplicemente l'intera pagina in background, quindi prende gli elementi (titolo, corpo ecc.) E li scambia nella pagina invece di quelli correnti. È un comportamento semplice, che può o non può portare a una maggiore velocità. In esempi del mondo reale, ho trovato le ruote dentate compilate con javascript in testa più che abbastanza. – rewritten