React.lazy

React.lazy - это функция в React, которая позволяет лениво загружать компоненты. компонент загружается только когда он требуется для рендеринга.

1
2
3
4
5
6
7
8
9
10
11
12
13
import React, { Suspense } from 'react';  const LazyComponent = React.lazy(() => import('./LazyComponent'));  function App() {  return (    <div>      <Suspense fallback={<div>Загрузка...</div>}>        <LazyComponent />      </Suspense>    </div>  );}

Преимущества:

• ✅ Уменьшает начальный размер загружаемого кода
• ✅ Ускоряет первоначальную загрузку приложения
• ✅ Улучшает производительность для больших приложений

Ограничения:

• ❌ Работает только с default-экспортами
• ❌ Требует обертки в <Suspense>
• ❌ Не поддерживает серверный рендеринг из коробки (нужен дополнительный подход)