Как настроить сборку ember-cli, чтобы исключить исходный код
У меня довольно большое приложение, сейчас около 5 Мб для app.js и 1 Мб + для вендора js. Я предполагаю, что он превысит 10 МБ, наши целевые пользователи находятся в медленном интернете, и у каждого пользователя есть разные права, поэтому большинство компонентов недоступны для пользователя.
Я думал исключить некоторые большие компоненты из процесса сборки и загружать их по требованию. До сих пор мне понравилась эта идея https://github.com/Cryrivers/ember-remote-component/blob/master/app/components/remote-component.js где он проверяет, загружен ли компонент, если нет, то загрузите их, используя AJAX
что-то вроде
if(!container.hasRegistration(`component:${ componentName }`)){
$.when(
$.getScript(`/remote-components/${ componentName }/component.js`),
$.getScript(`/remote-components/${ componentName }/template.js`)
).done(()=> {
let container = getOwner(this);
container.register(`component:${ componentName }`, require(`${ ENV.modulePrefix }/components/${ componentName }`).default, {singleton: false});
this.set('isLoaded', true);
})
}
Я думаю, что это может работать. Но вот два вопроса
A: Как исключить компонент из процесса сборки и предотвратить его конкатенацию, а также сохранить их в папке / dist / components / abc /
B: Отдельно откомпилируйте template.hbs к template.js для этого компонента, так как компиляция шаблона после загрузки через AJAX вызовет огромную проблему с производительностью.
1 ответ
Это не точное решение, которое ищет ОП, но я думаю, что это лучшее долгосрочное решение:
Я думаю, что лениво загруженные двигатели могут быть лучшим способом решения этой проблемы. https://github.com/dgeb/ember-engines
Вы можете предотвратить загрузку большинства приложений для большинства пользователей.
Экспериментальная поддержка отложенной загрузки доступна в основной ветке согласно README проекта.