Каков наилучший способ импортировать модули / компоненты пользовательского интерфейса лениво - PullRequest
0 голосов
/ 23 мая 2019

В настоящее время я следую рекомендованному структурированному модулю, изложенному в Angular ngModule docs .

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

Большинство примеров, которые я видел, будут также импортировать все модули пользовательского интерфейса в общие модули. Так, например, если я использую Angular Material, я импортирую все общие модули пользовательского интерфейса здесь, т.е. MatInputModule, MatSelectModule, ...

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

Например. Если мой модуль аутентификации является единственным модулем, который использует MatCardModule, то лучше ли мне импортировать его только в модуль аутентификации, а не со всеми другими моими импортированными модулями MatModule в общем модуле?

Предполагая, что ответ - да - будет ли все еще иметь смысл, если MatCardModule используется в двух разных функциональных модулях (тогда вы импортируете его в два отдельных модуля)? Разве Angular справляется с этим - например, если модуль уже был загружен в один лениво загруженный модуль, он не будет загружаться снова для второго лениво загруженного модуля?

TLDR Лучше ли импортировать только те модули UIM, которые вам нужны, в ваши функциональные модули (даже если это означает, что вы будете импортировать один и тот же модуль UIM несколько раз) или лучше оставить все свои модули UIM импортируется в Общий модуль, а затем просто импортируется Общий модуль во все другие функциональные модули

1 Ответ

0 голосов
/ 23 мая 2019

Это IMO, основываясь на моем опыте

У меня есть общий модуль, в который, как вы упомянули, я добавляю все свои общие компоненты и директивы.

Я создаю модуль под названием MyCommonModule и импортируюи экспортировать модули Material и другие сторонние модули, которые используются в большинстве модулей. Затем я импортирую MyCommonModule в AppModule

. Также есть некоторые специальные модули, которые будут использоваться в некоторых функциональных модулях, например ChartModule,Вы можете импортировать его специально.

О размере пакета, если вы не используете модуль, даже если вы импортировали Angular, не будет включать его через фазу TreeShaking, поэтому даже если вы импортируете весь размер файла js будетстолько, сколько модулей, которые вы уже использовали, в масштабе приложения

А по поводу вашего второго уравнения, если файл js модуля уже загружен, angular не будет загружать его снова

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...