Каковы преимущества использования AMD, например requirejs или commonjs модулей в javascript?

Я прочитал много статей о решениях AMD, таких как RequireJS или загрузчики модулей, которые следуют стилю CommonJS в Javascript.

Скажем, у меня есть приложение, разделенное на следующие части:

Определение приложения, которое полагается на фреймворк, который я использую
Модель 1, которая полагается на определение и структуру приложения
Модель 2, которая полагается на определение приложения, модель 1 и мою инфраструктуру

Я могу написать каждую часть как модуль RequireJS или обычный JS-модуль и разделить мой проект на то, сколько файлов я хочу, но каково преимущество записи каждой части в виде модуля или разделения их во многих файлах, а затем загрузить их в правильный порядок (чтобы избежать проблем с зависимостями), возможно, объединяет все файлы в большом, чтобы уменьшить HTTP-запросы (как это делает оптимизатор r.js)?

Ответ 1

По моему мнению, есть три довольно важные причины:

Вы можете создавать и повторно использовать модули, не загрязняя глобальное пространство имен. Чем больше загрязнено ваше глобальное пространство имен, тем больше вероятность столкновения функции/переменной. Это означает, что вы определяете функцию под названием "foo", а другой разработчик определяет функцию "foo" = одна из функций перезаписывается.

Вы можете структурировать свой код в отдельные папки и файлы, и requirejs будет загружать их асинхронно, когда это необходимо, поэтому все просто работает.

Вы можете создавать для производства. RequireJS поставляется со своим собственным инструментом сборки R.JS, который будет конкатцировать и угадывать ваши модули javascript в одном (или нескольких) пакетах. Это улучшит скорость вашей страницы, так как пользователю придется делать меньше вызовов script и загружать меньше контента (по мере того, как ваш JS будет очищен).

Вы можете посмотреть этот простой демонстрационный проект: https://c9.io/peeter-tomberg/requirejs (в cloud9ide).

Чтобы создать свои модули в одном приложении, вам нужно только установить пакет npm и выполнить команду: r.js -o build/build.properties.js

Если есть какие-либо вопросы, спросите прочь.

Edit:

В разработке все модули в отдельных файлах - это просто хороший способ структурирования и управления вашим кодом. Это также помогает вам в отладке (например, ошибка в строке "Module.js строка 17" вместо "scripts.js строка 5373" ).

Для производства вы должны использовать инструмент построения для concat и uglify javascript в один файл. Это ускорит загрузку страницы, поскольку вы делаете меньше запросов. Каждый запрос, который вы загружаете, замедляет вашу страницу. Чем медленнее ваша страница, тем меньше очков вам дает Google. Чем медленнее страница, тем более разочарованы ваши пользователи. Чем медленнее ваша страница, тем меньше продаж вы получите.

Если вы хотите больше узнать о производительности веб-страницы, посмотрите http://developer.yahoo.com/performance/rules.html