Настройката defer на моя polyfill и други скриптове ще гарантира ли, че са заредени по ред?

Използвам polyfill.io за polyfill Promise и fetch за по-стари клиенти. На техния уебсайт те препоръчват да използвате програма за зареждане на скриптове или тяхното обратно извикване, за да сте сигурни, че скриптът е зареден напълно преди да стартирате съвременния код:

Препоръчваме използването на атрибутите async и defer на тагове, които се зареждат от услугата polyfill, но зареждането от нас по неблокиращ начин означава, че не можете да знаете със сигурност дали собственият ви код ще се изпълни преди или след като polyfill-ите са направени Зареждане.

За да се уверите, че полифилите са налице, преди да опитате да изпълните свой собствен код, можете да прикачите манипулатор при зареждане към https://cdn.polyfill.io скриптов маркер, използвайте по-сложен инструмент за зареждане на скриптове или просто използвайте нашия аргумент за обратно извикване, за да оцените глобално обратно извикване, когато полифилите са заредени:

Не трябва ли обаче настройката defer и на двата скрипта вече да гарантира, че те се зареждат асинхронно, но все пак в реда, в който се появяват в документа (освен ако браузърът не поддържа отлагане)?

<script src="https://cdn.polyfill.io/v2/polyfill.min.js" defer></script>
<script src="modernscript.js" defer></script>

person Community    schedule 30.10.2017    source източник


Отговори (1)


Според MDN документация defer атрибут просто дефинира момент от времето за зареждане на страницата, когато ще се извърши зареждането на скрипта.

От документацията, която сте цитирали, може да се види:

За да сте сигурни, че polyfills са налице, преди да опитате да изпълните свой собствен код, можете да прикачите манипулатор при зареждане към https://cdn.polyfill.io таг на скрипта

Тъй като (както е посочено в коментарите към този отговор) не може да се види ясно дали defer скрипта ще бъдат изпълнени (1, 2) и като се вземат предвид възможните разлики в реализацията на браузъра - може да не е най-добрата идея да разчитате на такова поведение.

Така че по-добрият начин би бил или:

  1. да използвате някакъв инструмент за зареждане на скриптове (RequireJS например)
  2. за добавяне на предложения onload манипулатор към първия <script> таг и създаване на динамичен <script> таг за зареждане на вашия код вътре в този манипулатор
  3. за да обедините кода си заедно с Promise polyfill (ръчно или чрез пакетиране като webpack) и да го заредите като един пакет.

АКТУАЛИЗАЦИЯ: Както посочи @PeterHerdenborg в коментар - Документът на MDN вече ясно посочва, че:

Скриптовете с атрибута defer ще се изпълняват в реда, в който се показват в документа.

person Flying    schedule 30.10.2017
comment
Е, ако погледнете този отговор: stackoverflow.com/a/32413657/5918874, хората изглежда вярват, че отлагането гарантира изпълнение поръчка. Също тук: sitepoint.com/non-blocking-async-defer. Позовах се на документите на polyfill.io точно защото те заявяват обратното (но те също говорят за отлагане, комбинирано с async, което е различно). И документите на mozilla не казват нищо за това. Което е странно. - person ; 30.10.2017
comment
Виждам, че това вероятно е моя грешка: нормалният процес на зареждане на скриптове блокира операцията, async скриптовете се зареждат асинхронно, defer скриптовете изглежда определят различен момент във времето, когато ще започнат да се зареждат. polyfill.io docs предлага да добавите и async и defer атрибути, затова те предлагат да добавите onload манипулатор. Ще премахна отговора си, за да избегна объркване. - person Flying; 30.10.2017
comment
Реших да актуализирам отговора, за да включва информация от коментари. Тъй като в спецификациите няма ясна дефиниция на поведението - може би е по-добре да избягвате да разчитате на такъв тип натоварване и вместо това да обмислите други алтернативи. - person Flying; 30.10.2017
comment
Хм да Може би трябва да поискаме разяснение в документите на mdn. Не знам дали това е възможно някъде? - person ; 30.10.2017
comment
Може да се направи чрез Bugzilla, има Other -› Mozilla Developer Network продукт за търсене на грешки/попълване на формуляри - person Flying; 30.10.2017
comment
Документите на MDN, свързани в този отговор, сега гласят Scripts with the defer attribute will execute in the order in which they appear in the document. - person Peter Herdenborg; 19.01.2021
comment
@PeterHerdenborg благодаря ви, актуализирах отговора - person Flying; 19.01.2021