Как настроить сборку 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 проекта.

Другие вопросы по тегам