Prezentare generală a reacției
React este una dintre bibliotecile JavaScript open source. Este utilizat pentru construirea de interfețe de utilizator interactive. Este o bibliotecă eficientă, declarativă și flexibilă. Se ocupă de componenta V adică Vizualizare a modelului - View-Controller (MVC). Nu este un cadru întreg, ci doar o bibliotecă frontend. Permite crearea sau crearea de interfețe de utilizator complexe folosind bucăți de cod izolate și mici cunoscute sub numele de componente. Avantajul major al componentelor este că modificarea adusă oricărei componente nu afectează întreaga aplicație.
Aceasta a fost dezvoltată de inginerul software, Jordan Walke, care lucrează la Facebook. Facebook a desfășurat-o în newsfe-ul lor și a folosit-o pentru a-și îmbunătăți interfața de utilizator. Acesta a fost făcut public în mai 2013.
Este utilizat special pentru aplicații cu o singură pagină. Scopul său este să fie scalabil, simplu și rapid. Aceasta poate fi utilizată în combinație cu diferite cadre JavaScript sau biblioteci, cum ar fi Angular JS.
Caracteristici ale React
Să ne uităm la caracteristicile esențiale și cele mai exigente ale React:
1. JSX
JSX înseamnă JavaScript XML. Este o extensie la sintaxa limbajului JS. Acesta oferă o modalitate de a reda componentele folosind sintaxa similară cu HTML. React folosește JSX pentru a-și scrie componentele. Poate folosi și JavaScript pur, dar preferă JSX. Este folosit de Babel, un pre-procesor pentru a converti textul similar cu HTML găsit în fișierele JavaScript în obiecte JS standard. Codul HTML poate fi încorporat în JavaScript pentru a face codul HTML mai ușor de înțeles și îmbunătăți performanța JavaScript și pentru a face aplicația robustă.
2. Model de obiect de document virtual
Reacționează faceți o memorie cache a structurii de date din memorie, apoi calculează diferența dintre DOM-ul anterior și cel nou și apoi actualizează modificările sau mutațiile efectuate. Actualizează doar modificările, nu întreaga aplicație. Acest lucru ajută la creșterea vitezei și a performanței și reduce risipa de memorie.
3. Testabilitate
Vizualizările de reacție sunt utilizate ca funcții ale stării în care statul determină comportamentul componentei. Prin urmare, putem face modificări ale stării și apoi trecem la o vizualizare ReactJS și apoi determinăm ieșirea și acțiunile, funcțiile și evenimentele. Acest lucru face ușor testarea și depanarea.
4. SSR
Reprezintă reprezentarea laterală a serverului. Permite redarea prealabilă a stării inițiale a componentelor din partea serverului. Browserul poate fi redat fără a aștepta executarea sau încărcarea JavaScript. Acest lucru face ca paginile web să se încarce mai rapid. Acesta ajută utilizatorul să vizualizeze paginile web chiar și atunci când React încă descarcă JavaScript, leagă evenimente sau creează DOM virtual în backend.
5. Legarea datelor unice
Permite fluxul de date cu un singur sens, adică legarea datelor unidirecționale. Datorită acestei caracteristici, există un control mai bun asupra aplicației. Aceasta face ca starea aplicației să fie conținută în anumite magazine și, prin urmare, toate celelalte componente să rămână ușor cuplate. Acest lucru îmbunătățește flexibilitatea și eficiența aplicației.
6. Simplitatea
Fișierele JSX fac ca aplicația să fie simplă și de înțeles. JavaScript standard poate fi utilizat pentru a codifica, dar utilizarea JSX facilitează utilizarea. Mai multe metode ale ciclului de viață și abordarea sa bazată pe componente fac mai simplu să învețe și să execute.
7. Curba de învățare
În comparație cu alte cadre, curba de învățare a React este scăzută. Începătorii care au un limbaj de programare de bază, pot învăța să reacționeze cu ușurință.
Cum functioneazã?
Atunci când echipa de dezvoltatori Facebook a construit aplicații din partea clientului, a constatat că modelul de obiect document (DOM) este lent. Pentru a-l face mai rapid, un DOM virtual care este o reprezentare arbore a DOM în JavaScript este implementat în React.
React operează pe Virtual DOM. Nu manipulează documentul din browser după ce au fost făcute modificările, ci modifică DOM-ul virtual. Când DOM virtual este complet actualizat, acesta actualizează DOM-ul browserului în cel mai eficient mod posibil. DOM-ul virtual al Reactului se află integral în memorie. Reprezintă DOM-ul browserului web, astfel încât atunci când este scrisă o componentă React, se creează o componentă virtuală ieftină, care este transformată în DOM de React. Reactul a fost folosit pentru a fi folosit în browser, dar cu Node.js, acesta poate fi folosit și cu serverul.
Cum îl folosim?
Folosirea React este simplu ca să includeți un fișier JS în HTML. Să vedem utilizarea React printr-un exemplu simplu:
Cod:
First React Code
ReactDOM. render( First Code, document. querySelector ('#application')
);
First React Code
ReactDOM. render( First Code, document. querySelector ('#application')
);
First React Code
ReactDOM. render( First Code, document. querySelector ('#application')
);
First React Code
ReactDOM. render( First Code, document. querySelector ('#application')
);
Pare un pic dificil, dar este ușor de implementat și de învățat.
Cine folosește reacționează?
React devine popular în piața de astăzi, iar caracteristicile sale ajută companiile mari să își îmbunătățească experiența și interfețele.
Giganții de internet precum Facebook, Instagram, Netflix, New York Times, Yahoo Mail, Khan Academy, WhatsApp, Vivaldi Browser, Codecademy și Dropbox folosesc React într-un alt mod. Sberbank din Rusia a folosit, de asemenea, React o să dezvolte site-ul web al băncii lor.
Multe site-uri web precum github.com, reddit.com, outlook.live.com, bitbucket.org, account.godaddy.com și multe altele folosesc, de asemenea, React.
Avantajele reacției
- SEO prietenos
- Este ușor să creezi cazuri de testare pentru UI.
- Componentele cu reacție pot fi reutilizate cu ușurință.
- Asigură redarea mai rapidă.
- Debugarea este ușoară.
- Ușor de migrare.
- Îmbunătățește productivitatea.
- Scrierea componentelor este ușoară.
- Cod stabil.
- Are un set de instrumente util pentru dezvoltatori.
- React native este disponibil pentru dezvoltarea de aplicații mobile
- Usor de invatat.
- Îmbunătățește performanța
Dezavantajele reacției
- Ritm ridicat de dezvoltare.
- Documentare slabă.
- Probleme suplimentare SEO
- Doar orientat spre vizualizare.
- Biblioteca de dimensiuni mari a React.
- Curba de învățare pentru începători.
- Necesită procesarea manuală a modificărilor de date.
- În unele cazuri, aveți nevoie de mai multe coduri.
Articol recomandat
Acesta a fost un ghid pentru ceea ce este reacționează. Aici am discutat conceptele, definiția și înțelegerea cu avantajul și dezavantajul React. Puteți parcurge și alte articole sugerate pentru a afla mai multe -
- Ce este programarea Agile?
- Ce este multithreading în java?
- Utilizări de zmeură Pi
- Ce este JMS? | Definiție | Explicaţie
- Reactează nativul și reacționează
- Crearea butoanelor de stil în React Native