Я собираюсь ограничить эту статью предложением динамического импорта (на этапе 3) до компонентов React и React в контексте Создать приложение React.
Эта статья, опубликованная 18 мая 2017 года Дэном Абрамовым в блоге React, раскрывает функцию динамического импорта как средство разделения кода.
У Нихар Венугопал есть отличный видеоролик под названием «Руководство для начинающих по разделению кода вашего приложения React». Смотреть видео.
Некоторые выводы из видео Нихара:
- Разделение кода действительно просто
- Как разработчики, мы обычно сидим перед ПК (персональным компьютером) и забываем, что все больше и больше людей используют свои мобильные телефоны с разными скоростями подключения.
- Динамически импортировать компоненты так же просто, как загрузить данные в компонент.
- … Еще (Вы это смотрели?)
Я собираюсь создать проект, используя create-react-app dynamic. Давайте заменим импорт ./App по умолчанию на импорт асинхронного компонента.
Следующий пример в основном описывает, как можно начать визуализировать асинхронные компоненты как зависимости данных. Обработка функции import() так же, как и fetch запроса.
Если вашему асинхронно импортированному компоненту нужны дополнительные реквизиты, вам нужно сделать это домашнее задание для себя.
Расскажите, пожалуйста, несколько историй о победах или неудачах, если вы пытались это реализовать. Какие есть подводные камни и некоторые из «АГА!» моменты?
