Асинхронная загрузка функций JavaScript.

Я создаю структуру, в которой я объединил все файлы JavaScript в один файл (уменьшить).

Пример:

   function A() {} function B() {}

Через мини-файл я хочу загрузить функцию асинхронно и удалить из HTML, когда ее работа будет выполнена.

Пример: загрузить функцию A, когда это требуется, но не функцию B.

Я видел один фреймворк Require.js, но он асинхронно загружает файл JavaScript в зависимости от требований.

Есть ли какая-либо структура, которая загружает функции JavaScript по запросу, которые определены в том же файле js.


javascript performance commonjs requirejs
person Simply Innovative    schedule 02.10.2013    source источник
comment
Загрузка отдельных функций на самом деле является антиоптимизацией. Вы оптимизируете объем памяти и время компиляции (которые обычно не являются серьезными узкими местами), жертвуя сетевой нагрузкой (каждая функция заставляет браузер открывать другой сокет для сервера), что является основным узким местом для веб-приложений.   -  person slebetman    schedule 02.10.2013

Ответы (2)


arrow_upward
1
arrow_downward

Недостатком конкатенации является то, что вы получаете менее детальный контроль над тем, что вы включаете в данную загрузку страницы. Решение этой проблемы заключается в том, чтобы не создавать один объединенный файл, а создавать слои функциональности, которые можно включать более модульно. Таким образом, вам не нужен весь ваш JS на странице, которая может использовать только несколько определенных функций. На самом деле это также может быть выигрышем в скорости, поскольку наличие только одного файла JS может не использовать преимущества 6 одновременных подключений браузера. Более того, после полного внедрения SPDY один большой файл фактически будет менее производительным, чем более мелкие (поскольку соединения можно использовать повторно). Однако минификация по-прежнему будет иметь важное значение.

Все сказанное, кажется, вы просите что-то немного трудновыполнимое. Когда браузер загружает скрипт, он анализируется и немедленно выполняется. Тогда вы не сможете загрузить файл... загрузите только часть файла. Объединяя, вы ограничиваете себя этой большой полезной нагрузкой.

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

person Wyatt    schedule 02.10.2013
comment
У меня есть решение в вашем ответе, минимизируя все классы отдельно в разных файлах, я могу использовать для этого requirejs. Выполнение этого кода также будет минимизировано, и я могу загружать классы по запросу, используя require js. Большое спасибо, Вятт, за ваше предложение. - person Simply Innovative; 02.10.2013
comment
Да, минификация просто уменьшает количество байтов, отправляемых по сети, поэтому независимо от того, сколько у вас файлов, вы получите прирост скорости. Рад, что смог помочь. - person Wyatt; 02.10.2013

arrow_upward
0
arrow_downward

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

Лучше всего использовать Require.js или что-то подобное, если вы хотите иметь явные цепочки зависимостей.

person aaronfay    schedule 02.10.2013