[Javascript] Имеет ли смысл использовать Require.js с Angular.js?


Answers

Чтобы повторить то, что, на мой взгляд, вопрос OP:

Если я создаю приложение, главным образом, в Angular 1.x и (неявно) делая это в эпоху Grunt / Gulp / Broccoli и Bower / NPM, и у меня может быть пара дополнительных зависимостей в библиотеке, требуется ли добавить ясные, конкретные ценность за пределами того, что я получаю, используя Angular без Требований?

Или, по-другому:

«Требуется ли ванильная угловая потребность? Требуется ли эффективно управлять базовым Угловым компонентом-загрузкой, если у меня есть другие способы обработки базовой загрузки скриптов? »

И я считаю, что основной ответ на этот вопрос: «Если только у вас нет чего-то еще, и / или вы не можете использовать новые, более современные инструменты».

Давайте сначала будем понятны: RequireJS - отличный инструмент, который разрешил некоторые очень важные проблемы и начал нас по пути, к которому мы стремимся, к более масштабируемым, более профессиональным приложениям Javascript. Важно отметить, что впервые люди столкнулись с концепцией модуляции и выхода из глобального масштаба. Итак, если вы собираетесь создавать приложение Javascript, которое нужно масштабировать, тогда требуются и шаблон AMD - неплохие инструменты для этого.

Но есть ли что-то особенное в отношении Angular, что делает требование / AMD особенно подходящим? Нет. На самом деле, Angular предоставляет вам собственную модель модуляции и инкапсуляции, что во многих отношениях делает излишними основные функции модуляции AMD. И, интегрируя Угловые модули в шаблон AMD, невозможно, но это немного ... лаконично. Вы определенно будете тратить время на то, чтобы эти два шаблона были хорошо интегрированы.

Для некоторых перспектив из самой команды Angular, this от Брайана Форда, автора Angular Batarang и теперь является членом группы Angular Core:

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

Итак, по самому конкретному вопросу AngularJS: Angular и Require / AMD являются ортогональными и местами перекрывающимися. Вы можете использовать их вместе, но нет причин, специально связанных с природой / узорами самого Углового.

Но как насчет базового управления внутренними и внешними зависимостями для масштабируемых приложений Javascript? Не требует ли для меня что-то действительно важное для меня?

Я рекомендую проверить Bower и NPM, и особенно NPM. Я не пытаюсь начать святую войну о сравнительных преимуществах этих инструментов. Я просто хочу сказать: есть другие способы скинуть этот кот, и эти способы могут быть даже лучше, чем AMD / Требовать. (У них, безусловно, гораздо более популярный импульс в конце 2015 года, особенно NPM, в сочетании с модулями ES6 или CommonJS. См. Соответствующий вопрос SO ).

А как насчет ленивой загрузки?

Обратите внимание, что ленивая загрузка и ленивая загрузка различны. Ложная загрузка Angular не означает, что вы вытаскиваете их прямо с сервера. В приложении в стиле йомен с автоматизацией javascript вы объединяете и пресекаете весь shebang вместе в один файл. Они присутствуют, но не исполняются / не создаются, пока не понадобятся. Усовершенствования скорости и пропускной способности, которые вы получаете от этого, значительно превосходят любые предполагаемые улучшения от ленивой загрузки определенного 20-линейного контроллера. Фактически, потеря времени в сети и затраты на передачу для этого контроллера будут на порядок больше, чем размер самого контроллера.

Но скажем, вам действительно нужна ленивая загрузка, возможно, для редко используемых частей вашего приложения, таких как интерфейс администратора. Это очень законный случай. Требовать может действительно сделать это для вас. Но есть also many other , potentially more flexible options которые выполняют одно и то же. И Angular 2.0, по-видимому, позаботится об этом для нас, встроенных в router . ( Details ).

Но как насчет во время разработки моего локального dev boxen?

Как я могу загрузить все мои десятки / сотни загружаемых файлов сценариев без необходимости их вручную привязывать к index.html?

Взгляните на подгенераторы в генераторном генераторе Йомана или на шаблонах автоматизации, выполненных в generator-gulp-angular или в стандартной автоматизации Webpack для React. Они предоставляют вам чистый, масштабируемый способ: автоматически прикреплять файлы к моменту, когда компоненты находятся под защитой, или просто автоматически захватить их автоматически, если они присутствуют в определенных папках / соответствуют определенным шаблонам глобуса. Вам больше не нужно думать о загрузке вашего скрипта сразу после того, как у вас есть последние варианты.

Нижняя линия?

Требовать - отличный инструмент для определенных вещей. Но, по возможности, пойдите с зерном и по возможности разложите свои проблемы. Пусть Angular беспокоится о собственной модели модуляции Angular и рассмотрит возможность использования модулей ES6 или CommonJS в качестве общей модели модуляции. Пусть современные средства автоматизации беспокоятся о загрузке скриптов и управлении зависимостями. И позаботьтесь о асинхронной ленивой загрузке зернистым способом, а не путайте ее с двумя другими проблемами.

Тем не менее, если вы разрабатываете Angular apps, но не можете установить Node на своей машине, чтобы использовать Javascript средства автоматизации по какой-то причине, тогда Требование может быть хорошим альтернативным решением. И я видел действительно сложные настройки, где люди хотят динамически загружать угловые компоненты, каждый из которых объявляет свои собственные зависимости или что-то в этом роде. И хотя я, вероятно, попытаюсь решить эту проблему по-другому, я вижу достоинства этой идеи в этой конкретной ситуации.

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

(Обновляется многократно, чтобы идти в ногу с развивающейся сценой JS.)

Question

Я новичок в Angular.js и пытаюсь понять, как он отличается от Backbone.js ... Мы использовали для управления нашими зависимостями пакетов с Require.js при использовании Backbone. Имеет ли смысл делать то же самое с Angular.js?




Короткий ответ, это имеет смысл. Недавно это обсуждалось в ng-conf 2014. Вот разговор по этой теме:

http://www.youtube.com/watch?v=4yulGISBF8w




Как сказал @ganaraj, у AngularJS есть инъекция зависимостей в ее ядре. При создании приложений для семян игрушек с и без RequireJS я лично нашел, что RequireJS, вероятно, переборщил для большинства случаев использования.

Это не означает, что RequireJS не является полезным для его возможностей загрузки скриптов и сохранения вашей кодовой базы во время разработки. Объединение оптимизатора r.js ( https://github.com/jrburke/r.js ) с миндалем ( https://github.com/jrburke/almond ) может создать очень тонкий сценарий загрузки. Однако, поскольку его функции управления зависимостями не так важны с угловым основанием вашего приложения, вы также можете оценить решения загрузки сценариев на стороне клиента (HeadJS, LABjs, ...) или даже на стороне сервера (MVC4 Bundler, ...) для вашего конкретного приложения.




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

Угловой имеет встроенный механизм модуляции. Когда вы создаете свое приложение, первое, что вы сделаете, это

var app = angular.module("myApp");

а потом

app.directive(...);

app.controller(...);

app.service(...);

Если вы посмотрите на угловое семя, которое является аккуратным стартовым приложением для углового, они отделили директивы, службы, контроллеры и т. Д. В разные модули, а затем загрузили эти модули в зависимости от вашего основного приложения.

Что-то вроде :

var app = angular.module("myApp",["Directives","Controllers","Services"];

Угловые также ленивы загружают эти модули (в память) не их файлы сценариев.

В терминах ленивых файлов сценариев загрузки, если быть откровенным, если вы не пишете что-то чрезвычайно большое, это будет излишним, потому что по своей природе угловой характер уменьшает количество кода, который вы пишете. Типичное приложение, написанное в большинстве других фреймворков, может ожидать уменьшения примерно на 30-50% в LOC, если оно будет написано угловым.




Да, имеет смысл использовать requireJS с Angular, я провел несколько дней, чтобы проверить несколько технических решений.

Я сделал угловое семя с RequireJS на стороне сервера. Очень простой. Я использую нотацию SHIM для модуля AMD, а не для AMD, потому что, по-моему, очень сложно справиться с двумя разными системами впрыска Dependency.

Я использую grunt, а r.js для конкатенации файлов js на сервере зависит от файла конфигурации SHIM (зависимости). Поэтому я ссылаюсь только на один файл js в своем приложении.

Для получения дополнительной информации перейдите на мой github Angular Seed: https://github.com/matohawk/angular-seed-requirejs




Я думаю, что это зависит от сложности вашего проекта, так как угловой модуль очень модульный. Ваши контроллеры можно сопоставить, и вы можете просто импортировать эти классы JavaScript на странице index.html.

Но если ваш проект станет больше. Или вы ожидаете такого сценария, вы должны интегрировать углы с requirejs. В this статье вы можете увидеть демонстрационное приложение для такой интеграции.