Зачем нужны динамические импорты

[evo]

Динамические импорты (import() как функция) нужны, чтобы загружать модули по требованию, а не сразу при запуске приложения.

---

Зачем они на практике:

1. Оптимизация производительности
   Загружай код только тогда, когда он нужен.
   → Страница грузится быстрее, потому что не тянет всё сразу.

   Пример:

   if (userClickedHelp) {
     const helpModule = await import('./help.js');
     helpModule.showHelp();
   }
   

2. Ленивая загрузка (lazy loading)
   Особенно полезно в больших приложениях (например, React, Vue, Angular).
   → Код отдельных страниц или компонентов загружается только при переходе на них.

3. Условный импорт
   Загружать разные модули в зависимости от условий (браузер, язык, права пользователя и т.д.).

   Пример:

   let api;
   if (isMobile) {
     api = await import('./api-mobile.js');
   } else {
     api = await import('./api-desktop.js');
   }
   

4. Работа с динамическими путями
   Импортировать модуль с путём, который определяется во время выполнения.

   const moduleName = getUserTheme() + '.js';
   const theme = await import(`./themes/${moduleName}`);
   

---

️ Отличие от статического import:

• import ... from '...' — статический, должен быть наверху файла, загружается сразу.
• import(...) — динамический, можно вызвать где угодно и когда угодно (возвращает Promise).

---

Итог:
Динамические импорты нужны, чтобы делать приложения быстрее и легче, загружая код по мере необходимости.