Лучшая практика для ленивой загрузки в JavaScript

Question

Каков наилучший способ динамически загружать содержимое HTML и вводить его на страницу (когда HTML содержит как теги <script src="..." />, так и вызовы функций для этих скриптов)?

Рассмотрим этот подход (для простоты я буду рассматривать JQuery):

<script> 
$.ajax({ 
    url: 'http://...', 
    success: function(html) { 
     $("body").append(html); 
    } 
}); 
</script> 

Давайте предположим, что возвращаемый HTML содержит что-то, как например:

<script src="some_script.js"></script> 
<script> 
some_function(); // function defined in some_script.js 
</script> 

Поскольку some_function() определен в some_script.js он будет доступен только после того, как some_script.js будет загружен, но (как правило) он будет выполнен до того, как будет загружен файл some_script.js (что приведет к ошибке).

Очевидно, что есть некоторые решения для преодоления этой проблемы, но какова наилучшая практика в этом случае? Должны ли использоваться библиотеки, такие как RequireJS?

Пример, приведенный выше, является результатом использования шаблона, который я использую: у меня есть компонент, который я буду загружать только тогда, когда он будет использоваться (в этот момент я делаю вызов Ajax для извлечения как HTML, так и необходимых скриптов). Тем не менее, может случиться так, что требуется множество сценариев, и их легче записать в виде набора тегов в HTML-шаблоне, а не загружать их через JavaScript (это также предпочтительнее, поскольку URL-адрес сценария может быть сгенерирован внутри приложения, поэтому простой JS сценарий может не знать абсолютный URL-адрес сценария).

Answer 1

На самом деле Safari и Internet Explorer (и, скорее всего, другие) не будут исполнять <script>, которые вводятся через Ajax в качестве меры безопасности.

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