Concurrent Mode e Responsividade

Transcript

1. Concurrent Mode & Responsividade
2. EXPERIMENTAL
3. O que é Concurrent Mode?
4. Um conjunto de recursos que permitem que aplicações em React possam permanecer reativas e adaptáveis à interferências, como velocidade de rede e recursos dos dispositivos dos usuários. O que é Concurrent Mode?
7. Master Sua Branch
8. Em Modo Concorrente, a renderização é interruptível, e não bloqueante.
9. Renderização Interrompida
10. B
11. Blusa Bola Balança Boia B
12. Bl
13. Blusa Blusa de frio Blusa de manga longa Blusa de meia manga Bl
14. Sequências de Carregamento Intencionais
15. Ainda na metáfora da master e suas branches... Sequências de Carregamento Intencionais Master Sua Branch
18. Mas como?
19. HEURÍSTICA
20. ...ou a capacidade humana de tomar decisões.
21. Concurrent Mode + Suspense
22. Suspense permite "esperar" que códigos ou dados sejam carregados, especificando declarativamente um estado de carregamento (fallback) enquanto espera. Concurrent Mode + Suspense
23. Concurrent Mode + Suspense const ProfilePage = React.lazy(() => import('./ProfilePage')); // Carregado quando necessário // Mostra um spinner enquanto o perfil está carregando <Suspense fallback={<Spinner />}> <ProfilePage /> </Suspense>
24. Mas onde entra a responsividade?
26. Design Responsivo
28. Perguntas?
29. Obrigada!