JavaScript na dole strony?

Question

Czytałem, że lepiej przechowywać wszystkie swoje pliki JavaScript na dole strony. Szablon szablonu kotła HTML5 wydaje się być zgodny: http://html5boilerplate.com/

I wydaje się być szeroko stosowany.

Moje pytanie brzmi: po pierwsze, czy ma to jakieś rzeczywiste podstawy? Zrobiłem testowanie w Firebug i wydaje się, że ma niewielki wpływ, ale czy to jest trywialne? Obrazy i inne źródła nie zaczynają ładować się, dopóki nie załadują się pliki CSS i pliki skryptów, ale przyklejenie ich na dole nie wydaje się w tym zbytnio różnić.

Answer 1

Jest to bardzo ważne z powodów związanych z najlepszymi praktykami.

Po załadowaniu skryptów do nagłówka, uniemożliwiają one pobieranie innych plików! Obejmuje to stylizację, a także zatrzyma pobieranie obrazów do czasu ukończenia skryptu.

Dzieje się tak, ponieważ pliki JavaScript ładują się synchronicznie.

Należy również pamiętać, że podczas wczytywania otrzymasz numer flash of unstyled content (FOUT), jeśli nie przeniesiesz swoich plików JavaScript na dół strony. Dzieje się tak dlatego, że Twój CSS nie zostanie pobrany, dopóki skrypt nie zakończy ładowania.

---

Oto fragment z Yahoo wydajności reguły 6.

Drugi problem spowodowany przez skrypty blokuje równoległe pobieranie. Specyfikacja HTTP/1.1 sugeruje, że przeglądarki pobierają nie więcej niż dwa komponenty równolegle na nazwę hosta. Jeśli wyświetlasz obrazy z wielu hostów, możesz pobrać więcej niż dwa pobrane równolegle. (Dostałem Internet Explorer, aby pobrać ponad 100 obrazów równolegle.) Podczas gdy skrypt jest pobierany, przeglądarka nie rozpocznie żadnych innych plików do pobrania, nawet na różnych nazwach hostów.

---

Referencje

http://developer.yahoo.com/performance/rules.html/

Szczególnie pamiętać rule 6.

Answer 2

Zasadniczo, gdy przeglądarka natrafi na znacznik <script>, przestaje ładować resztę dokumentu, aż do załadowania i wykonania tego <script>.

Answer 3

JavaScripts ładują się synchronicznie. Sparuj to z ogólnie większymi rozmiarami plików i masz opóźnione ładowanie treści z powodu synchronicznego ładowania JavaScript. Jeśli umieścisz JavaScript na dole strony, to wszystko inne zostanie wczytane jako pierwsze, a ładowanie JavaScriptem niczego nie zablokuje.

Answer 4

Niedawno przeprowadziliśmy tę debatę w biurze. Napisałem a lengthy post, gdzie przedstawiam swoją opinię na ten temat. Krótka odpowiedź brzmi, że to naprawdę zależy od tego, co robisz. W przypadku stron internetowych zorientowanych na treść najlepsze miejsce zajmuje najlepsze miejsce docelowe. Jednak gdy tworzy się aplikacje internetowe, w których najważniejsza jest funkcjonalność, umieszczenie u góry ma swoje zalety.