Czy przeglądarki wykonują załadowane skrypty w jednym wątku?

mogę napisać co następuje:Czy przeglądarki wykonują załadowane skrypty w jednym wątku?

<script src="file1.js" defer></script> 
<script src="file2.js" defer></script> 
<script src="file3.js" defer></script>

Co oznacza, pliki mogą być pobrane równolegle ale wykonywany tylko jeden po drugim. Mogę jednak dodać atrybut async, aby umożliwić wykonanie kodu przeglądarki w kolejności losowej.

<script src="file1.js" async></script> 
<script src="file2.js" async></script> 
<script src="file3.js" async></script>

Jeśli interesuje mnie zwiększenie wydajności, czy drugi blok może zostać wykonany szybciej? Jak widzę, jeśli przeglądarka wykonuje cały JavaScript w jednym wątku, całkowity czas wykonania dla 3 skryptów nie będzie różnił się od pierwszego bloku, tylko kolejność wykonania może być inna. Czy mam rację?

Źródło

2016-04-12 AngularInDepth.com

Chcesz coś jeszcze przetestować? –

Myślę, że czas będzie taki sam dla ogólnego wykonania w obu metodach, ale w 'async' możemy szybciej pokazać ważne dane, takie jak HTML. To jest całkowicie moja opinia. –

Jeśli interesuje mnie zwiększenie wydajności, czy drugi blok może zostać wykonany szybciej?

Skrypty zostaną pobrane i wykonane asynchronicznie, co oznacza skrócenie czasu ładowania strony.

Autor jednego z poniższych zestawów porównuje trzy metody uwzględnienia skryptu: wstrzyknięty skrypt, skrypt blokujący i skrypt z atrybutem async. Wynik:

    script execution onload 
----------------- ------------------ -------- 
    script-injected ~3.7s    ~3.7s 
    blocking script ~2.7s    ~2.7s 
    async attribute ~1.7s    ~2.7s

Jak widać, atrybut async zapewnia najlepszą wydajność. Jeśli kolejność wykonywania skryptów nie ma znaczenia, zdecydowanie powinieneś go użyć.

Co do tytułowego pytania:

przeglądarek wykonuj ładowane skrypty w jednym wątku?

Tak, ponieważ JavaScript jest jednowątkowy, ale nie ma znaczenia pod względem wydajności. Pobieranie skryptu zajmuje znacznie więcej czasu niż wykonanie go, więc powinieneś skupić się na optymalizacji części do pobrania.

Zrobiłem test. Stworzyłem prosty skrypt:

for (var i = 0; i < 1e8; i++);

umieścić ten sam skrypt na dwa pliki, test1.js i test2.js.Potem zrobiłem dwa pliki HTML, pierwszy bez async a drugi z:

test1.html:

<!DOCTYPE html> 
<script src="test1.js"></script> 
<script src="test2.js"></script>

test2.html:

<!DOCTYPE html> 
<script src="test1.js" async></script> 
<script src="test2.js" async></script>

potem otworzyłem te pliki HTML w przeglądarce i sprawdzone Timeline zakładki w Chrome DevTools:

test1.html:

test2.html:

Jak widać, w obu przypadkach skrypty nie są wykonywane asynchronicznie.

Zobacz także: Is JavaScript guaranteed to be single-threaded?.

Źródło

2016-04-12 07:21:42

dziękuję, ale pytania dotyczą konkretnie czasu wykonania. z tego, co widzę, na czas wykonania nie ma wpływu to, czy używam 'odroczenia' czy' asynchronicznego' czy też żadnego z nich. Czas ładowania jest rzeczywiście lepszy przy "async" –

_ bez asynchronizacji przeglądarka czekałaby na wykonanie pierwszego skryptu, a następnie wykonałaby drugi skrypt._ - co zrobi _with_ 'async' jeśli ma tylko jeden wątek wykonywać skrypty? :) to główny punkt mojego pytania. –

dziękuję, więc zasadniczo to dowodzi, że całkowity czas wykonania nie zmienia się wraz z wprowadzeniem atrybutu 'async' i jest równy sumie czasu wykonania każdego skryptu, prawda? –

Czy przeglądarki wykonują załadowane skrypty w jednym wątku?

Odpowiedz

Powiązane problemy