Sadržaj
- 01. Kutni
- 02. Reagirajte
- 03. Vue
- Kako se uspoređuje sintaksa okvira?
- Popularnost i tržište
- Razvoj mobilne aplikacije
- Ostali okviri na koje treba paziti 2020. godine
- Zaključak
U 2020. godini blagoslovljeni smo brojnim okvirima i knjižnicama koje nam pomažu u web razvoju. Ali nije uvijek bilo toliko raznolikosti. Davne 2005. godine momak po imenu Brendan Eich stvorio je novi skriptni jezik pod nazivom Mocha. Mjesecima nakon što je preimenovan u LiveScript, ime je ponovno promijenjeno u JavaScript. Od tada je JavaScript daleko napredovao.
U 2010. godini uvođenje Backbone i Angular vidjeli smo kao prvi JavaScript okvir, a do 2016. godine 92 posto svih web stranica koristilo je JavaScript. U ovom ćemo članku pogledati tri glavna JavaScript okvira (Angular, React i Vue) i njihov status u sljedećem desetljeću. Želite napraviti vlastitu stranicu? Isprobajte ovaj popis graditelja web stranica.
Neke sjajne resurse potražite na našem popisu najboljih alata za web dizajn, našem pregledu usluga web hostinga i na ovom popisu izvrsnog softvera za testiranje korisnika.
01. Kutni
AngularJS je objavljen 2010. godine, ali je do 2016. potpuno prepisan i objavljen kao Angular 2. Angular je potpuno razvijeni mrežni okvir koji je razvio Google, a koriste ga Wix, Upwork, The Guardian, HBO i drugi.
Pros:
- Iznimna podrška za TypeScript
- MVVM omogućuje programerima da odvoje rad na istom odjeljku aplikacije koristeći isti skup podataka
- Izvrsna dokumentacija
Protiv:
- Ima malo krivulje učenja
- Prelazak sa stare verzije može biti težak.
- Ažuriranja se uvode prilično redovito, što znači da im se programeri moraju prilagoditi
Što je sljedeće?
U Angular 9, Ivy je zadani prevoditelj. Postavljen je za rješavanje mnogih problema oko performansi i veličine datoteke. Trebao bi učiniti aplikacije manjim, bržim i jednostavnijim.
Kada usporedite prethodne verzije Angular-a s React-om i Vue-om,
konačne veličine snopa bile su puno veće kada se koristi Angular. Ivy također omogućuje Progressive Hydration, što je nešto što je Angular tim pokazao na I / O 2019. Progressive Hydration koristi Ivy za progresivno učitavanje na poslužitelju i klijentu. Na primjer, kad korisnik počne komunicirati sa stranicom, kôd komponenata zajedno s bilo kojim izvođenjem dohvaća se dio po dio.
Čini se da je Ivy veliki fokus za Angular i nada se da će ga učiniti dostupnim za sve aplikacije. U verziji 9 bit će opcija odjave sve do Angular 10.
02. Reagirajte
React je Facebook prvotno objavio 2013. godine i koristi se za izgradnju interaktivnih web sučelja. Koriste ga Netflix, Dropbox, PayPal i Uber da nabrojimo samo neke.
Pros:
- React koristi virtualni DOM, što pozitivno utječe na performanse
- JSX je jednostavno napisati
- Ažuriranja ne ugrožavaju stabilnost
Protiv:
- Jedan od glavnih zastoja su potrebe biblioteka trećih strana za stvaranje složenijih aplikacija
- Programeri ostaju u mraku kako bi pronašli najbolji način za razvoj
Što je sljedeće?
Na React Conf 2019 tim React dotaknuo se niza stvari na kojima je radio. Prva je Selektivna hidratacija, gdje će React zaustaviti sve na čemu radi kako bi dao prioritet komponentama s kojima korisnik komunicira. Kako korisnik prelazi u interakciju s određenim odjeljkom, to će područje biti hidratizirano. Tim je također radio na Suspenseu, koji je Reactov sustav za orkestriranje učitavanja koda, podataka i slika. To omogućuje komponentama da čekaju nešto prije nego što se prikažu.
I selektivna hidratacija i suspenzija omogućeni su istodobnim načinom rada, koji omogućava aplikacijama da reagiraju više, pružajući Reactu mogućnost ulaska u velike blokove posla nižeg prioriteta kako bi se usredotočio na nešto što je veći prioritet, poput odgovora na korisnički unos. Tim je također spomenuo pristupačnost kao drugo područje koje su promatrali, usredotočujući se na dvije određene teme - upravljanje fokusom i ulaznim sučeljima.
03. Vue
Vue je 2014. godine razvio Evan You, bivši zaposlenik Googlea. Koriste ga Xiaomi, Alibaba i GitLab. Vue je uspio steći popularnost i podršku programera u kratkom vremenskom razmaku i bez potpore velike marke.
Pros:
- Vrlo lagane veličine
- Pogodno za početnike - lako za naučiti
- Velika zajednica
Protiv:
- Ne podržava velika tvrtka, poput React-a s Facebookom i Angular-a s Googleom
- Nema stvarne strukture
Što je sljedeće?
Vue si je postavio za cilj da bude brži, manji, održiviji i olakša programerima da ciljaju izvorne (ako imate problema s održavanjem, razmislite o usluzi web hostinga). Sljedeće izdanje (3.0) trebalo bi doći u prvom kvartalu 2020. godine, što uključuje virtualno prepisivanje DOM-a radi boljih performansi, zajedno s poboljšanom podrškom za TypeScript. Tu je i dodatak Composition API, koji programerima nudi novi način za stvaranje komponenata i njihovo organiziranje po značajkama, umjesto po operacijama.
Oni koji razvijaju Vue također su zauzeti radom na Suspenseu, koji obustavlja prikazivanje vaše komponente i generira zamjensku komponentu dok se ne ispuni uvjet.
Jedna od sjajnih stvari s Vueovim ažuriranjima je da održavaju povratnu kompatibilnost. Ne žele da razbijete svoje stare Vue projekte. To smo vidjeli u migraciji s 1,0 na 2,0, gdje je 90 posto API-ja bilo isto.
Kako se uspoređuje sintaksa okvira?
Sva tri okvira pretrpjela su promjene od svojih izdanja, ali jedna stvar koju je presudno razumjeti je sintaksa i kako se ona razlikuje. Pogledajmo kako se uspoređuje sintaksa kada je riječ o jednostavnom vezivanju događaja:
Vue: The v-on Direktiva se koristi za pričvršćivanje slušatelja događaja koji pozivaju metode na Vue instancama. Direktive imaju prefiks sa v- kako bi naznačili da su to posebni atributi koje pruža Vue i primijenili posebno reaktivno ponašanje na generirani DOM. Obrađivači događaja mogu se pružiti u obliku reda ili kao naziv metode.
template> gumb v-on: click = ”clickHandler”> Click me / button> / template> script> export default {name: “HelloWorld”, metode: {clickHandler: function () {console.log („Kliknut sam! "); }}}; / skripta>
Reagirati: React stavlja oznake i logiku u JS i JSX, sintaksno proširenje za JavaScript. S JSX-om funkcija se prenosi kao rukovatelj događajima. Rukovanje događajima s React elementima vrlo je slično rukovanju događajima na DOM elementima. Ali postoje neke sintaktičke razlike; na primjer, React događaji imenuju se pomoću camelCase, a ne malim slovima.
function Button () {function clickHandler (e) {console.log („Kliknut sam“); } gumb za povratak onClick = {clickHandler}> Klikni me! / gumb>; }
Kutni: Sintaksa vezanja događaja sastoji se od ciljanog naziva događaja u zagradama s lijeve strane znaka jednakosti i citiranog izraza predloška s desne strane. Možete koristiti i na- prefiks, poznat kao kanonski oblik.
@Component ({selektor: “app-click-me”, predložak: `button (click) =” onClickMe () ”> Click me! / Button>`}) klasa izvoza ClickMeComponent {onClickMe () {console.log („ Kliknuli ste me! "); }}
Popularnost i tržište
Započnimo s gledanjem sveukupne slike tri okvira u odnosu na ostatak weba ispitivanjem statistike W3Techs-a. Angular trenutno koristi 0,4 posto svih web stranica, a tržišni udio JavaScript knjižnice iznosi 0,5 posto. React koristi 0,3 posto svih web stranica i 0,4 posto tržišnog udjela JavaScript knjižnice, a Vue ima 0,3 posto za obje. To se čini prilično ujednačeno i očekivali biste da će brojke rasti.
Googleovi trendovi: Tijekom posljednjih 12 mjeseci, React je najpopularniji u pojmovima za pretraživanje, a slijedi ga Angular. Vue.js prilično zaostaje; međutim, jedna stvar koju treba zapamtiti je da je Vue još uvijek mlad u usporedbi s druge dvije.
Traženje posla: U vrijeme pisanja ovog članka, React i Angular prilično su usko povezani s obzirom na popise poslova na Indeedu s Vueom koji je daleko iza. Međutim, na LinkedInu se čini da postoji veća potražnja za Vue programerima.
Preljev stoga: Ako pogledate rezultate ankete Stack Overflow Developer Survey za 2019. godinu, React i Vue.js najomiljeniji su i najtraženiji mrežni okviri. Angular sjeda na deveto mjesto za najvoljenije, ali treće najtraženije.
GitHub: Vue ima najviše zvjezdica sa 153 tisuće, ali ima najmanje suradnika (283). S druge strane, React ima 140 tisuća zvijezda i 1341 suradnika. Angular ima samo 59,6 tisuća zvijezda, ali ima najveći broj suradnika od ove tri s 1579.
NPM trendovi: Gornja slika prikazuje statistiku za proteklih 12 mjeseci, gdje možete vidjeti da React ima veći broj preuzimanja mjesečno u odnosu na Angular i Vue.
Razvoj mobilne aplikacije
Jedan od glavnih fokusa velike trojke je mobilna implementacija. React ima React Native, koji je postao popularan izbor za izradu iOS i Android aplikacija, ne samo za React korisnike, već i za širu zajednicu za razvoj aplikacija. Kutni programeri mogu koristiti NativeScript za izvorne aplikacije ili Ionic za hibridne mobilne aplikacije, dok programeri Vue imaju izbor NativeScript ili Vue Native. Zbog popularnosti mobilnih aplikacija, ovo ostaje ključno područje ulaganja.
Ostali okviri na koje treba paziti 2020. godine
Ako želite isprobati nešto novo u 2020. godini, pogledajte ove JavaScript okvire.
Žeravica: Okvir otvorenog koda za izradu web aplikacija koji radi na temelju MVVM obrasca. Koristi ga nekoliko velikih tvrtki poput Microsofta, Netflixa i LinkedIna.
Meteor: Potpuno složena JavaScript platforma za razvoj modernih web i mobilnih aplikacija. Jednostavno je naučiti i ima zajednicu koja podržava.
Zaključak
Sva tri okvira kontinuirano se poboljšavaju, što je ohrabrujući znak. Svatko ima svoju perspektivu i željeno rješenje o tome koje bi trebao koristiti, ali to se stvarno svodi na veličinu projekta i zbog čega se osjećate ugodnije.
Najvažniji aspekt je kontinuirana podrška njihovih zajednica, pa ako planirate započeti novi projekt i nikada prije niste koristili niti jedan od tri, vjerujem da ste u sigurnim rukama svih njih. Ako još niste imali priliku naučiti niti jedan od tri okvira, predlažem da za novogodišnju odluku započnete s učenjem. Budućnost će se vrtjeti oko ove trojice.
Ovaj se sadržaj izvorno pojavio u časopisu net.
