2009-07-10 14 views
12

Zastanawiam się, czy możliwe jest ładowanie javascript w taki sposób, aby nie blokował on wrażenia użytkownika. Nie jestem pewien, jak osiągnąć to samo, ale szukam rozwiązania opartego na różnych przeglądarkach. Zastanawiam się, czy ktoś może mnie poprowadzić we właściwym kierunku. Umieszczenie js u dołu strony nie działa zbyt dobrze.Nie blokujący JavaScript

Dziękuję za poświęcony czas.

+0

Blargh, miałem naprawdę dobry link do tego, ale nie mogę go znaleźć – Greg

+0

Wyjaśnienie potrzebne: mówisz załadunku javascript zasoby plików jak w '

2

Sądzę, że można używać Workers, ale wydaje się, że jest on zaimplementowany w FF3.5, ale kilka innych.

Zobacz http://hacks.mozilla.org/2009/07/working-smarter-not-harder/

+0

Niewielkie wyszukiwanie Google na "onload Javascript" dostarcza wielu informacji na stronach takich jak http://onlinetools.org/articles/unobtrusivejavascript/chapter4.html. –

+0

Nie zapomnij o Gears! Ma również pracowników internetowych. –

+1

Tak? Byłem zbyt leniwy, aby o tym wspomnieć, ale jest w artykule wskazanym. –

2

Gdy strona się ładuje może pobierać tylko 2 plików JavaScript równolegle w tym samym czasie, więc próbuje utrzymując liczbę plików javascript w dół i ich wielkości w dół (z minifikacji, obsfucation i GZipping) pomoże w ładowaniu.

Korzystanie z wywołań zwrotnych w javascriptu pomoże również w sytuacji, gdy elementy nie będą blokowane podczas działania javascript.

Przykładem w jQuery byłoby

$('#id').click(function(){ 
    $.post('url',data,function(callbackdata){//do something 
     }); 

}); 
3

Cytowanie this answer:

żądań zasobów JavaScript są rzeczywiście blokuje, ale istnieją sposoby wokół tego (słownie: DOM wstrzykuje tagów skryptu w nagłówku i żądania AJAX ), które bez zobaczenia strony mogą być właśnie tym, co się tutaj dzieje.

Łącznie z wielu kopii tego samego JS zasobu jest bardzo złe, ale nie koniecznie krytyczny i jest typowy większych witryn, które mogłyby być naliczeniu z pracy oddzielnych zespołów, lub po prostu stary zły kodowania, planowanie lub konserwacja.

Jeśli chodzi o zalecenie Yahoo do umieszczanie skryptów w dolnej części ciała , poprawia percieved odpowiedzi razy, a może poprawić faktycznego załadunku razy w stopniu (bo wszyscy dotychczasowe zasoby mogą async po pierwsze), ale nigdy nie będzie tak skuteczny, jak żądania nie blokujące ( ) (choć mają one wysoką barierę techniczną).

Możesz zajrzeć do wpisu na blogu YUI o numerze Non-Blocking Javascript.

0

Deferring execution of JavaScript może być naprawdę dobrym rozwiązaniem, jeśli masz trochę kodu JavaScript, który nie jest krytyczny do natychmiastowego załadowania.

+0

jest to np. Tylko –

+1

Nie, jest obsługiwane przez wszystkie popularne przeglądarki: http://www.webkit.org/blog/1395/running-scripts-in-webkit/ http: //hacks.mozilla .org/2009/06/defer / – mikl

1

setTimeout z małym opóźnieniem pozwoli ci na kontynuację sterowania, podczas planowania innej funkcji do wykonania później. Jest to szczególnie przydatne, aby zapobiec blokowaniu lub nieumyślnemu blokowaniu interfejsu przez udane wykonanie innej funkcji.

Uważam, że bardzo przydatne jest zapobieganie zakłócaniu zdarzeń JavaScript przez błędy javascript. Na przykład, aby zainstalować obsługi złożyć na formularzu:

$('#form').submit(function() { 
    setTimeout(function() { 
    // Submit handler function, i.e. do an ajax submission of the form 
    $.ajax(...etc...); 
    }, 1); 
    // Return false before the handler executes, ensuring the form won't manually submit 
    // in the event of a js error in the handler 
    return false; 
}); 
-1

Zapraszamy do obejrzenia tej jQuery plugin (http://code.google.com/p/funky-jq-plugins/wiki/nonblocking).

Ma na celu wykorzystanie liczników czasu do emulowania środowiska wielowątkowego, w którym wątek interfejsu użytkownika nie jest zamrożony przez wymagające operacje, takie jak iteracja na długich listach. Bardzo fajne rzeczy ... Napisałem go :)

ciao teraz

Powiązane problemy