Lekce 24 - React Concurrent Mode - Základy
V předchozí lekci, Optimalizace React aplikací, jsme si ukázali strategie pro optimalizaci React aplikací, konkrétně jsme se zaměřili na code splitting a memoizaci.
V dnešním tutoriálu pokročilého Reactu si představíme Concurrent Mode a vysvětlíme si jeho důležitost pro zlepšení uživatelského zážitku.
React Concurrent Mode
React Concurrent Mode byl vyvinutý, aby vyřešil několik klíčových problémů týkajících se odezvy uživatelského rozhraní v komplexních webových aplikacích. Umožňuje paralelní vykreslování podle prioritizace, což pomáhá k lepšímu uživatelskému zážitku. Hlavní vlákno aplikace totiž není blokované méně urgentními úkoly trvajícími delší dobu a aplikace má lepší odezvu na akce uživatele.
Kořenová komponenta pro Concurrent Mode
Před uvedením React Concurrent Mode se kořenová komponenta vytvářela
pomocí funkce ReactDOM.render()
:
import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; // Vytvoření kořenové komponenty ReactDOM.render(<App />, document.getElementById('root'));
V tomto příkladu vezme metoda render()
kořenovou komponentu
<App />
a vykreslí ji na stránce do HTML elementu s ID
root
.
S příchodem React Concurrent Mode byla představena nová funkce
createRoot()
. Použití této funkce vypadá takto:
...konec náhledu článku...
Pokračuj dál
Došel jsi až sem a to je super! Věříme, že ti první lekce ukázaly něco nového a užitečného.
Chceš v kurzu pokračovat? Přejdi do prémiové sekce.
Koupit tento kurz
Před koupí tohoto článku je třeba koupit předchozí díl
Obsah článku spadá pod licenci Premium, koupí článku souhlasíš se smluvními podmínkami.
- Neomezený a trvalý přístup k jednotlivým lekcím.
- Kvalitní znalosti v oblasti IT.
- Dovednosti, které ti pomohou získat vysněnou a dobře placenou práci.
Popis článku
Požadovaný článek má následující obsah:
V tutoriálu pokročilého Reactu se seznámíme s Concurrent Mode a s tím, v jaké situaci jej lze využít ke zlepšení uživatelského zážitku.
Kredity získáš, když podpoříš naši síť. To můžeš udělat buď zasláním symbolické částky na podporu provozu nebo přidáním obsahu na síť.