Каков наилучший способ включить Javascript? - PullRequest
Новая
       12

Каков наилучший способ включить Javascript?

7 голосов
/ 30 января 2011

Многие крупные игроки рекомендуют немного разные приемы. В основном на размещение новых <script>.

Google Anayltics : 

(function() {
  var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
  ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
  var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

Facebook : 

(function() {
  var e = document.createElement('script'); e.async = true;
  e.src = document.location.protocol +
    '//connect.facebook.net/en_US/all.js';
  document.getElementById('fb-root').appendChild(e);
}());:

Disqus 

(function() {
    var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
    dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();

(опубликуйте другие, и я добавлю их)

Есть ли какая-то рифма или причина для этих выборов, или это вообще не имеет значения?

Ответы [ 3 ]

3 голосов
/ 30 января 2011

Это все по сути один и тот же подход по духу. Идея состоит в том, чтобы отложить сценарии, чтобы они не блокировали друг друга и не завершили документ.

Обычной практикой является загрузка дополнительных внешних ресурсов после содержимого вашего сайта. При этом вы хотите а) предотвратить блокировку события onload, чтобы ваша страница была быстрее завершена, и б) параллельно загружать ресурсы, что и делается выше.

Стив Соудерс утверждает, что «прогрессивное улучшение» является наиболее важной концепцией для производительности сайта сегодня. Эта концепция предполагает, что вы доставляете базовую страницу как можно быстрее, а затем доставляете дополнительный контент / услуги по мере необходимости, либо при событии загрузки, либо когда пользователь запрашивает его.

В настоящее время существуют фреймворки, которые помогают. Смотри http://headjs.com/

0 голосов
/ 30 января 2011

Есть несколько разных причин для этого ... во-первых, некоторые браузеры будут загружать динамически добавленные теги сценариев асинхронно.Во-вторых, скрипт может обрабатывать, когда целевая страница http или https, чтобы избежать ошибок содержимого.

Как упоминал Джо, head.js полезен ... s - разбиение домена ваших собственных скриптов.Для ваших собственных ресурсов сценариев лучше всего спроектировать свой сайт с минимальным количеством js в верхней части (html5shiv и tag / js tagging для css) ... тогда ваши js будут в старом добром стиле

0 голосов
/ 30 января 2011

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

...