Čo je nové v knižnici používateľského rozhrania React JavaScript

Verzia 16.8 knižnice používateľského rozhrania React JavaScript, ktorá je teraz k dispozícii v produkčnom vydaní, má schopnosť háčikov na použitie stavových a ďalších funkcií React bez nutnosti písania triedy.

Kde stiahnuť Reagovať

Produktovú verziu React si môžete stiahnuť z GitHubu.

Aktuálna verzia: Nové funkcie v React 16.8

React 168, ktorý bol vydaný vo februári 2019, poskytuje implementáciu háčikov pre DOM, server DOM, testovací vykresľovač a plytký vykresľovač React. Háky sú podporované v React DevTools. Vývojári môžu vytvárať svoje vlastné mechanizmy zdieľania opakovane použiteľnej stavovej logiky medzi komponentmi. Facebook však odporúča vývojárom, aby si s touto funkciou našli čas a neodporúča vývojárom prepisovať aplikácie tak, aby používali háky „cez noc“.

Neexistujú plány na odstránenie tried z Reactu, takže vývojári by mali vyskúšať háky v niektorých nových komponentoch. Kód usingeveraging hooks bude fungovať spolu s existujúcim kódom používajúcim triedy.

Predchádzajúca verzia: Nové funkcie v reakcii 16.7

React 16.7, ktorý bol vydaný v decembri 2018, pridáva možnosti háčikov na používanie štátnych a ďalších funkcií React bez písania triedy.

Háky sú funkcie, ktoré odkazujú na funkcie Reagovať stav a Životný cyklus z komponentov funkcií. V súčasnosti spolupracujú s existujúcim kódom, čo umožňuje ich postupné prijatie. Neexistujú plány na skutočné odstránenie tried z React. Háky riešia rôzne problémy v React vrátane:

• Chýbajúci spôsob pripájania k opakovane použiteľnému správaniu. Vyskytli sa vzory ako rekvizity na vykreslenie a komponenty vyššieho rádu, ktoré sa to snažia vyriešiť, ale tie si vyžadujú reštrukturalizáciu komponentov, ktorá môže byť ťažkopádna a sťažovať sledovanie kódu. Pomocou háčikov môžu vývojári extrahovať stavovú logiku z komponentu na nezávislé testovanie a opätovné použitie.
• Zložité komponenty sa stali príliš ťažko pochopiteľnými. Pomocou háčikov je možné komponenty rozdeliť na menšie funkcie na základe súvisiacich častí, ako je napríklad nastavenie predplatného alebo načítanie údajov. Toto sa deje namiesto vynútenia rozdelenia založeného na metódach životného cyklu.
• Triedy môžu zmiasť ľudí aj stroje a považujú sa za najväčšiu prekážku v učení Reagovať. Háky umožňujú vývojárom využívať viac funkcií Reactu bez tried. Háky prijímajú funkcie, ale bez obetovania ducha React. Poskytuje sa prístup k nevyhnutným únikovým prielezom. Vývojári sa nemusia učiť zložité techniky funkčného alebo reaktívneho programovania.

Predchádzajúca verzia: Nové funkcie v reakcii 16.6

React 16.6, ktorý bol vydaný v októbri 2018, poskytuje niekoľko vylepšení.

• S poznámka, môžu vývojári pomôcť pri vykresľovaní pomocou funkčných komponentov, podobne ako môžu komponenty triedy zachraňovať pri vykresľovaní, keď sú vstupné rekvizity rovnaké pomocou PureComponents alebo shouldComponentUpdate.
• S lenivý, môžu vývojári používať Napätie komponent na delenie kódu zabalením dynamického importu do volania na React.lazy (). Poznámka: Táto funkcia zatiaľ nie je k dispozícii na vykreslenie na strane servera.
• Pohodlné API bolo zavedené na konzumáciu kontextovej hodnoty z komponentu triedy. Vývojári sa sťažovali, že prijatie nového rozhrania API pre vykreslenie z React 16.3 môže byť v komponentoch triedy náročné.
• Chybová metóda, getDerivedStatefromError (), vykreslí záložné používateľské rozhranie pred dokončením vykreslenia. Poznámka: Zatiaľ nie je k dispozícii na vykreslenie na strane servera, ale vývojári sa na to môžu začať pripravovať.
• Dva Prísny režim Podpora rozhraní API bola ukončená: findDOMNode () a starší kontext pomocou contextType a getChildContext. Vývojárom sa odporúča, aby inovovali na nové contextType API.

Predchádzajúca verzia: Nové funkcie v React 16.4

Verzia 16.4 React, vydaná koncom mája 2018, pridáva podporu pre udalosti ukazovateľa, často požadovanú funkciu a vylepšenie pre nadchádzajúcu asynchrónnu schopnosť vykresľovania. Prehliadače, ktoré podporujú udalosti ukazovateľa, zahŕňajú verzie Google Chrome, Mozilla Firefox, Microsoft Edge a Microsoft Internet Explorer.

Udalosti ukazovateľa sú udalosti DOM spustené pre ukazovacie zariadenie, ktoré sú navrhnuté tak, aby poskytovali jediný model udalosti na prácu so zariadeniami, ako sú myš alebo dotyk.

S podporou udalostí ukazovateľa React pridáva podporu pre typy udalostí, ktoré zahŕňajú:

• onPointerDow
• onPointerMove
• onPointerUp
• onPointerCancel
• onGotPointerCapture
• onLostPointerCapture
• onPointerEnter
• onPointerLeave
• onPointerOver
• onPointerOut

Medzi ďalšie nové možnosti v React 16.4 patria:

• Vylepšená kompatibilita s plánovaným režimom asynchrónneho vykresľovania. Vydanie obsahuje opravu chyby getDerivedStatefromProps, ktorý sa teraz volá zakaždým, keď je potrebný komponent, bez ohľadu na to, prečo k aktualizácii dochádza. Volalo sa to iba v prípade, ak komponent znova vykreslil rodič a nespustil by sa v dôsledku miestnej aktivity setState. Oprava nemá vplyv na väčšinu aplikácií, ale v zriedkavých prípadoch môže spôsobiť problémy s malým počtom komponentov.
• Bola pridaná experimentálna súčasť profilovania, tzv unstable_Profiler, na meranie výkonu.
• Experimentálny odsúhlasovač na vytváranie vlastných vykresľovačov obsahuje nový tvar konfigurácie hostiteľa, ktorý je plochý a nepoužíva vnorené objekty.
• Opravy React DOM zahŕňajú opravu chyby, ktorá v niektorých prípadoch zabránila šíreniu kontextu, ako aj situáciu, keď boli niektoré atribúty nesprávne odstránené z uzlov vlastných prvkov.

Funkcia experimentálneho vrátenia hovoru bola odstránená vo verzii 16.4 React, pretože ovplyvnila veľkosť balíka a API nebolo dosť dobré. Očakávajte, že to bude niekedy v inej podobe, tvrdí Facebook.

Predchádzajúca verzia: Nové funkcie v React 16.3

Vydanie React z marca 2018, verzia 16.3, prináša zmeny životného cyklu a tiež API pre kontext.

Zmeny životného cyklu v Reagovať 16.3

Pre životný cyklus komponentu nastávajúci režim asynchrónneho vykreslenia roztiahne model API komponentu triedy, ktorý sa používa spôsobmi, ktoré neboli pôvodne zamýšľané. Takže sa pridávajú nové životné cykly, vrátane getDerivedStateFromProps, ako bezpečnejšia alternatíva k staršiemu životnému cyklu, componentWillReceiveProps. Tiež sa pridáva getSnapshotBeforeUpdatena podporu bezpečného čítania vlastností, napríklad modelu DOM, pred vykonaním aktualizácií.

Reakcia 16.3 tiež pridáva „nebezpečnú“ predponu k niektorým z týchto životných cyklov, ako napríklad k componentWillMount a componentWillReceiveUpdate. V týchto prípadoch „nebezpečný“ neodkazuje na bezpečnosť, ale na skutočnosť, že kód používajúci tieto životné cykly bude mať v budúcich verziách Reagovať skôr chyby.

S vydaním React 16.3 nemusia vývojári so staršími metódami nič robiť. Toto vydanie má správcov projektov otvorených zdrojov vyzvať, aby aktualizovali svoje knižnice pred upozorneniami na zastaranie, ktoré budú povolené až v budúcom vydaní v riadku 16.x.

Verzia 16.3 pridáva StrictMode komponent, ktorý identifikuje komponenty s nebezpečnými životnými cyklami. StrictMode, ktorý beží iba v režime vývoja, tiež varuje pred starým použitím reťazca ref API a detekuje neočakávané vedľajšie účinky. Aktivuje ďalšie kontroly pre potomkov. Neskôr budú pridané ďalšie funkcie.

Kontextové rozhranie API podporuje kontrolu statického typu a hĺbkové aktualizácie

Nové kontextové rozhranie API podporuje kontrolu statického typu a hĺbkové aktualizácie. Toto API je tiež efektívnejšie ako predchádzajúca experimentálna verzia API, uviedol Brian Vaughn, člen základného tímu React JS na Facebooku. Kontext umožňuje údaje prechádzať stromom komponentov bez potreby manuálneho odovzdávania rekvizít, z ktorých niektoré zahŕňajú predvoľbu miestneho nastavenia a tému používateľského rozhrania. Staré rozhranie API bude naďalej fungovať pre vydania React 16.x, čo poskytne používateľom čas na migráciu.

Nové tiež v React 16.3:

• Vylepšené API, tzv createrefAPI, na správu odkazov, ktoré poskytujú spôsob prístupu k uzlom DOM alebo k prvkom React vyvinutým v metóde vykreslenia.
• The forwardRef API, ktoré pomáha pri používaní komponentov vyššieho rádu, ktoré podporujú opätovné použitie kódu.

Predchádzajúca verzia: Nové funkcie v React 16.2

Vydanie React 16.2 z novembra 2017 prináša schopnosť fragmentov vylepšiť podporu pre zobrazovanie viacerých detí z metódy vykresľovania komponentov. Fragmenty, ktoré sa podobajú prázdnym značkám JSX, umožňujú vývojárom zoskupiť zoznam detí bez pridania uzlov do DOM.

Verziu 16.2 môžete nainštalovať z registra NPM. Inštaláciu spustíte pomocou správcu balíkov Yarn priadza pridať reagovat@^16.2.0 reagovat-dom@^16.2.0. Ak ju chcete nainštalovať pomocou NPM, spustite npm install --save react@^16.2.0 react-dom@^16.2.0.

Predchádzajúca verzia: Nové funkcie v React 16.0

V priebehu svojho vývoja nazvaný „React Fibre“ je React 16.0 zo septembra 2017 prepisom jadra React, ktorý zlepšuje vnímanú reakciu zložitých aplikácií pomocou nového algoritmu zmierenia. Medzi kľúčové vlastnosti React 16 patria:

• Chyby, ktoré obsahujú sledovanie zásobníka komponentov, aby sa ľahšie ladili.
• Vracanie reťazcov / polí priamo z metód vykresľovania komponentov.
• Nový rýchlejší streamovací renderer na strane servera.
• Výkon natívnejšej aplikácie.
• Prechod od kontroverznej licencie BSD + Patents k prijateľnejšej licencii MIT.

Aj keď boli vnútorné prvky Reactu úplne prepísané v React 16, verejné API je „v podstate nezmenené,“ uviedla Sophie Alpert, inžinierska manažérka spoločnosti React pre Facebook. Zámerom bolo ušetriť vývojárom nutnosť prepisovať existujúce komponenty vytvorené pomocou React.

Nový kód React 16 bol napísaný spolu so starým kódom v repozitári GitHub, podľa známeho postupu na Facebooku. Prepínanie medzi týmito dvoma spôsobmi sa uskutočňovalo pomocou Boolovej hodnoty useFiber príznak funkcie. Tento proces umožnil spoločnosti Facebook začať budovať svoju novú implementáciu bez toho, aby to malo vplyv na existujúcich používateľov, a pokračovať v opravách chýb starej kódovej základne.

Po niekoľkých mesiacoch odstraňovania chýb sa Facebook rozhodol dodať jediný produkt na zníženie možnej množiny chýb, namiesto toho, aby ponechal dve verzie React aktuálne.