React … wait for it … Suspense
summary
React Fiber enables asynchronous rendering and Suspense unifies fetching of code, data and images so components can throw a Promise to suspend rendering until a cached resource resolves. Demo builds a small cache + loading wrapper (uses simple-cache-provider), shows per-component fallbacks, configurable timeouts to avoid flicker, and server streaming with renderToNodeStream. API is experimental and may need a custom React build, but the demos work and reveal the practical tradeoffs and implementation details.
AI-written summary · about
chapters (20)
- 0:00Введение и представление
- 1:28Что такое React Suspense
- 2:10Проблемы React до версии 16
- 3:33Переход на Fiber и новые возможности
- 4:41Асинхронный рендеринг и его преимущества
- 7:10Как работает Fiber
- 10:00Новые методы жизненного цикла
- 12:08Изменения в обработке ошибок
- 16:23Проблема с сетевыми ресурсами
- 17:27Как работает Suspense
- 20:58Реализация Suspense на практике
- 22:42Механизм работы кэша
- 24:09Демонстрация кода Suspense
- 27:44Практическая реализация Suspense
- 28:27Как Suspense работает внутри
- 30:10Кэш и ресурсы в Suspense
- 31:59Примеры использования Suspense
- 32:41Управление спиннерами и тайм-аутами
- 34:29Server-side рендеринг с Suspense
- 35:54Вопросы и ответы
