Što je novo u knjižnici korisničkog sučelja React JavaScript

Sada dostupna u produkcijskom izdanju, verzija 16.8 biblioteke korisničkog sučelja React JavaScript ima mogućnost kukica za korištenje stanja i drugih React značajki bez pisanja klase.

Gdje preuzeti React

Producton verziju React-a možete preuzeti s GitHub-a.

Trenutna verzija: Nove značajke u Reactu 16.8

Objavljen u veljači 2019., React 168 nudi implementaciju kukica za Reactov DOM, DOM poslužitelj, test renderer i plitki render. Udice su podržane u React DevTools. Programeri mogu izraditi vlastite udice kako bi dijelili logiku sa višestrukim korištenjem stanja među komponentama. No, Facebook savjetuje programerima da odvoje vrijeme s ovom sposobnošću, ne preporučujući programerima da prepisuju programe kako bi kuke koristili "preko noći".

Ne planira se uklanjanje klasa iz React-a, pa bi programeri trebali isprobati udice u nekim novim komponentama. Šifre koje koriste usrednjavajuće udice radit će zajedno s postojećim kodovima koji koriste klase.

Prethodna verzija: Nove značajke u Reactu 16.7

Objavljen u prosincu 2018., React 16.7 dodaje mogućnost kukica za korištenje stanja i drugih React značajki bez pisanja klase.

Kuke su funkcije koje povezuju stanje reakcije i značajke životnog ciklusa iz komponenti funkcije. Trenutno rade rame uz rame sa postojećim kodom, što omogućuje postupno usvajanje. Ne planira se stvarno uklanjanje klasa iz React-a. Kuke rješavaju razne probleme u Reactu, uključujući:

  • Nedostatak načina za povezivanje višekratnog ponašanja s komponentom. Bilo je obrazaca kao što su renderirani rekviziti i komponente višeg reda koji to pokušavaju riješiti, ali oni zahtijevaju restrukturiranje komponenata, što može biti glomazno i ​​otežati slijedenje koda. Koristeći kuke, programeri mogu izvući logiku stanja iz komponente za neovisno testiranje i ponovnu upotrebu.
  • Kompleksne komponente postalo je preteško razumjeti. Pomoću kukica, komponente se mogu podijeliti u manje funkcije na temelju srodnih dijelova, poput postavljanja pretplate ili dohvaćanja podataka. To se radi umjesto da se prisiljava na razdvajanje na temelju metoda životnog ciklusa.
  • Predavanja mogu zbuniti ljude i strojeve i smatraju se najvećom preprekom za učenje React-a. Kuke omogućavaju programerima da koriste više React-ovih značajki bez nastave. Kuke prihvaćaju funkcije, ali bez žrtvovanja duha Reacta. Pristup je osiguran imperativnim otvorima za bijeg. Programeri ne moraju učiti složene tehnike funkcionalnog ili reaktivnog programiranja.

Prethodna verzija: Nove značajke u Reactu 16.6

Izdan u listopadu 2018., React 16.6 nudi nekoliko poboljšanja.

  • Uz to memoprogrameri mogu spasiti od prikazivanja funkcijskim komponentama, slično onome kako komponente klase mogu spasiti od prikazivanja kada su ulazni rekviziti isti koristeći PureComponentsili shouldComponentUpdate.
  • Uz lazy, programeri mogu koristiti Suspensekomponentu za podjelu koda umotavanjem dinamičkog uvoza u poziv na React.lazy(). Napomena: Značajka još nije dostupna za prikazivanje na strani poslužitelja.
  • API pogodnosti uveden je za konzumiranje vrijednosti konteksta unutar komponente klase. Programeri su se žalili da bi usvajanje novog API-ja render prop iz React-a 16.3 moglo biti teško u komponentama klase.
  • Metoda pogreške getDerivedStatefromError(), prikazuje zamjensko korisničko sučelje prije dovršetka prikazivanja. Napomena: Još nije dostupan za prikazivanje na strani poslužitelja, ali programeri se mogu početi pripremati za njega.
  • Dva StrictmodeAPI-ja su zastarjela: findDOMNode()i naslijeđeni kontekst pomoću contextType i getChildContext. Programeri se potiču na nadogradnju na novi contextTypeAPI.

Prethodna verzija: Nove značajke u Reactu 16.4

Verzija 16.4 Reacta, objavljena krajem svibnja 2018., dodaje podršku za događaje pokazivača, često traženu značajku, kao i poboljšanje za nadolazeću sposobnost asinkronog prikazivanja. Preglednici koji podržavaju događaje pokazivača uključuju verzije Google Chrome, Mozilla Firefox, Microsoft Edge i Microsoft Internet Explorer.

Pokazivački događaji su DOM događaji aktivirani za pokazivački uređaj, osmišljeni kako bi pružili jedan model događaja za upravljanje uređajima poput miša ili dodira.

Uz podršku za događaje pokazivača, React dodaje podršku za tipove događaja koji uključuju:

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

Ostale nove mogućnosti u Reactu 16.4 uključuju:

  • Poboljšana kompatibilnost s planiranim asinkronim načinom prikazivanja. Da biste to učinili, izdanje sadrži ispravku programske pogreške getDerivedStatefromProps, koja se sada naziva svaki put kad je potrebna neka komponenta, bez obzira na to zašto se događa ažuriranje. Pozvan je samo ako je komponentu generirao roditelj i ako se lokalno ne bi aktivirao setState. Ispravka ne utječe na većinu aplikacija, ali u rijetkim slučajevima može uzrokovati probleme s malim brojem komponenata.
  • Za unstable_Profilermjerenje performansi dodana je, nazvana , eksperimentalna komponenta profila .
  • Eksperimentalni pomirivač za stvaranje prilagođenih rendera sadrži novi oblik konfiguracije hosta koji je ravan i ne koristi ugniježđene objekte.
  • Popravci React DOM-a uključuju popravak programske pogreške koja je spriječila širenje konteksta u nekim slučajevima, kao i situaciju u kojoj su se neki atributi pogrešno uklanjali iz čvorova prilagođenih elemenata.

Mogućnost eksperimentalnog povratka poziva izbrisana je u React verziji 16.4 jer je utjecala na veličinu snopa, a API nije bio dovoljno dobar. Očekujte to u nekom trenutku u drugom obliku, kaže Facebook.

Prethodna verzija: Nove značajke u Reactu 16.3

Izdanje Reacta, verzija 16.3 iz ožujka 2018., donosi promjene životnog ciklusa, kao i API za kontekst.

Promjene životnog ciklusa u Reactu 16.3

Za životni ciklus komponente, nadolazeći način asinkronog prikazivanja proteže se na API model klase komponente, koji se koristi na načine koji prvotno nisu bili predviđeni. Dakle, dodaju se novi život ciklusa, uključujući getDerivedStateFromProps, kao sigurnije alternative naslijeđe životnog ciklusa, componentWillReceiveProps. Također je dodano getSnapshotBeforeUpdate, kako bi se podržalo sigurno čitanje svojstava, poput DOM-a prije nego što se izvrše ažuriranja.

React 16.3 također dodaje "nesigurni" prefiks nekim od ovih životnih ciklusa, poput componentWillMounti componentWillReceiveUpdate. U tim se slučajevima "nesigurno" ne odnosi na sigurnost, već na činjenicu da će kod koji koristi ove životne cikluse vjerojatnije imati pogreške u budućim verzijama React-a.

S React 16.3 izdanjem programeri ne moraju ništa raditi na naslijeđenim metodama. Izdanje je namijenjeno potaknuti održavače projekata otvorenog koda da ažuriraju svoje knjižnice prije upozorenja o ukidanju, koja neće biti omogućena do budućeg izdanja u retku 16.x.

Verzija 16.3 dodaje StrictModekomponentu koja identificira komponente s nesigurnim životnim ciklusima. StrictMode, koji se izvodi samo u razvojnom načinu, također upozorava na uporabu naslijeđenog API-ja niza referenci i otkriva neočekivane nuspojave. Aktivira dodatne provjere za potomke. Više funkcionalnosti bit će dodano kasnije.

Context API podržava provjeru statičkog tipa i dubinska ažuriranja

Novi kontekstni API, podržava provjeru statičkog tipa i dubinska ažuriranja. Ovaj je API također učinkovitiji od prethodne eksperimentalne verzije API-ja, rekao je Brian Vaughn, član React JS osnovnog tima na Facebooku. Kontekst omogućuje prosljeđivanje podataka kroz stablo komponenata bez potrebe za ručnim prosljeđivanjem rekvizita, od kojih neki uključuju preferencije lokalizacije i temu korisničkog sučelja. Stari API nastavit će raditi za izdanja React 16.x, dajući korisnicima vremena za migraciju.

Također novo u Reactu 16.3:

  • Poboljšani API, nazvan createrefAPIza upravljanje refovima, koji pružaju način pristupa DOM čvorovima ili React elementima razvijenim u metodi rendera.
  • forwardRefAPI, pomažući uz korištenje višeg reda komponenti koje promiču koda ponovno korištenje.

Prethodna verzija: Nove značajke u Reactu 16.2

Izdanje React 16.2 u studenom 2017. donosi sposobnost fragmenata za poboljšanje podrške za prikazivanje više djece iz metode generiranja komponenata. Fragmenti koji nalikuju praznim JSX oznakama, dopuštaju programerima da grupiraju popis djece bez dodavanja čvorova u DOM.

Verziju 16.2 možete instalirati iz NPM registra. Da biste instalirali s upraviteljem paketa Yarn, pokrenite yarn add [email protected]^16.2.0 [email protected]^16.2.0. Da biste ga instalirali s NPM-om, pokrenite npm install --save [email protected]^16.2.0 [email protected]^16.2.0.

Prethodna verzija: Nove značajke u Reactu 16.0

Nazvan "React Fiber" tijekom svog razvoja, React 16.0 iz rujna 2017. prepravlja jezgru React, poboljšavajući perceptivni odziv složenih aplikacija putem novog algoritma pomirenja. Ključne značajke React 16 uključuju:

  • Pogreške koje sadrže praćenje steka komponenata radi lakšeg uklanjanja pogrešaka.
  • Povratak nizova / nizova izravno iz metoda generiranja komponenata.
  • Novi brži render za prikazivanje na strani poslužitelja.
  • Više performansi aplikacija sličnih nativima.
  • Prijelaz s kontroverzne licence BSD + patenti na MIT licencu koja je ukusnija.

Iako su Reactovi interni dijelovi u potpunosti prepisani u React 16, javni API je "u biti nepromijenjen", rekla je Sophie Alpert, Facebook-ov inženjerski menadžer za React. Namjera je bila spasiti programere od potrebe da prepisuju postojeće komponente izgrađene s Reactom.

Novi kôd React 16 napisan je uz stari kôd u GitHub repo-u, prema poznatoj praksi na Facebooku. Prebacivanja između njih obavljena su pomoću Booleove useFiberzastave značajke. Proces je omogućio Facebooku da započne izgradnju nove implementacije bez utjecaja na postojeće korisnike i nastavi ispravljati programske pogreške na staroj bazi koda.

Nakon nekoliko mjeseci peglanja bugova, Facebook se odlučio isporučiti jedan proizvod kako bi smanjio mogući skup bugova, umjesto da dvije verzije React-a ostane aktualne.