Асинхронный синтаксис загрузки файла .js

Я заметил, что, по-видимому, существует несколько немного разных синтаксисов для загрузки js файлов асинхронно, и мне было интересно, есть ли разница между ними, или если они оба в значительной степени работают одинаково. Я предполагаю, что они работают одинаково, но просто хотели убедиться, что по какой-то причине один метод не лучше другого.:)

Метод One

(function() {
    var d=document,
    h=d.getElementsByTagName('head')[0],
    s=d.createElement('script');
    s.type='text/javascript';
    s.src='/js/myfile.js';
    h.appendChild(s);
})(); /* note ending parenthesis and curly brace */


Метод второй (см. это в коде Facebook)

(function() {
    var d=document,
    h=d.getElementsByTagName('head')[0],
    s=d.createElement('script');
    s.type='text/javascript';
    s.async=true;
    s.src='/js/myfile.js';
    h.appendChild(s);
}()); /* note ending parenthesis and curly brace */

ОТВЕТЫ

Ответ 1

Единственное отличие, которое я замечаю, это s.async=true; в методе Facebook.

Атрибутами async и defer являются логические атрибуты, указывающие, как должен выполняться script.

Существует три возможных режима, которые можно выбрать с помощью этих атрибутов. Если присутствует атрибут async, тогда script будет выполняться асинхронно, как только он будет доступен. Если атрибут async отсутствует, но присутствует атрибут defer, тогда script выполняется, когда страница завершила разбор. Если ни один из атрибутов не присутствует, то script извлекается и выполняется немедленно, прежде чем пользовательский агент продолжит анализ страницы.

Источник и дополнительное чтение: Whatwg.org HTML 5: script элемент

Что касается преимуществ, вы можете проверить, что Google должен был сказать в этом декабре:

Ответ 2

Я играл с этим и создал для этого библиотеку, которая включает в себя поддержку для запуска обратного вызова при загрузке script.

Sigma.async_script_load('http://example.com/underscore-min.js', '_', function() {
  _([1,2,3,2,3,1]).uniq();
});

https://github.com/ssoroka/sigma