24. diel - React Concurrent Mode - Základy

V predchádzajúcej lekcii, Optimalizácia React aplikácií , sme si ukázali stratégie na optimalizáciu React aplikácií, konkrétne sme sa zamerali na code splitting a memoizáciu.

V dnešnom tutoriále pokročilého Reactu si predstavíme Concurrent Mode a vysvetlíme si jeho dôležitosť pre zlepšenie používateľského zážitku.

React Concurrent Mode

React Concurrent Mode bol vyvinutý, aby vyriešil niekoľko kľúčových problémov týkajúcich sa odozvy používateľského rozhrania v komplexných webových aplikáciách. Umožňuje paralelné vykresľovanie podľa prioritizácie, čo pomáha k lepšiemu užívateľskému zážitku. Hlavné vlákno aplikácie totiž nie je blokované menej urgentnými úlohami trvajúcimi dlhšiu dobu a aplikácia má lepšiu odozvu na akcie užívateľa.

Koreňový komponent pre Concurrent Mode

Pred uvedením React Concurrent Mode sa koreňový komponent vytváral pomocou funkcie ReactDOM.render():

V tomto príklade vezme metóda render() koreňový komponent <App /> a vykreslí ju na stránke do HTML elementu s ID root.

S príchodom React Concurrent Mode bola predstavená nová funkcia createRoot(). Použitie tejto funkcie vyzerá takto:


 

...koniec náhľadu článku...
Pokračuj ďalej

Vedomosti v hodnote stoviek tisíc získaš za pár eur

Došiel si až sem a to je super! Veríme, že ti prvé lekcie ukázali niečo nového a užitočného.
Chceš v kurze pokračovať? Prejdi do prémiovej sekcie.

Pred kúpou tohto článku je potrebné kúpiť predchádzajúci diel

Obsah článku spadá pod licenciu Premium, kúpou článku súhlasíš s Prevádzkovými podmienkami.

Čo od nás v ďalších lekciách dostaneš?
  • Prístup k jednotlivým lekciám podľa spôsobu obstarania.
  • Kvalitné znalosti v oblasti IT.
  • Zručnosti, ktoré ti pomôžu získať vysnívanú a dobre platenú prácu.

Popis článku

Požadovaný článok má nasledujúci obsah:

V tutoriáli pokročilého Reactu sa zoznámime s Concurrent Mode as tým, v akej situácii ho možno využiť na zlepšenie užívateľského zážitku.
Článok pre vás napísala Laura Baluchová
Avatar
Aktivity