E ardhmja e kornizave: Çfarë pritet për pjesën tjetër të vitit 2020?

Autor: John Stephens
Data E Krijimit: 27 Janar 2021
Datën E Azhurnimit: 9 Mund 2024
Anonim
E ardhmja e kornizave: Çfarë pritet për pjesën tjetër të vitit 2020? - Krijues
E ardhmja e kornizave: Çfarë pritet për pjesën tjetër të vitit 2020? - Krijues

Përmbajtje

Në vitin 2020, ne jemi të bekuar me një numër kornizash dhe bibliotekash për të na ndihmuar në zhvillimin e uebit. Por jo gjithmonë kishte kaq shumë larmi. Në vitin 2005, një gjuhë e re skenarësh e quajtur Mocha u krijua nga një djalë i quajtur Brendan Eich. Muaj pasi u riemërua në LiveScript, emri u ndryshua përsëri në JavaScript. Që atëherë, JavaScript ka bërë një rrugë të gjatë.

Në vitin 2010, ne pamë prezantimin e Backbone dhe Angular si kornizat e para JavaScript dhe, deri në 2016, 92 për qind e të gjitha faqeve të internetit përdorën JavaScript. Në këtë artikull, ne do të hedhim një vështrim në tre prej kornizave kryesore JavaScript (Angular, React dhe Vue) dhe statusin e tyre në dekadën e ardhshme. Dëshironi të bëni faqen tuaj? Provoni këtë listë të krijuesve të faqeve të internetit.

Për disa burime të shkëlqyera, shikoni gjithashtu listën tonë të mjeteve kryesore të dizenjimit të uebit, përmbledhjen tonë të shërbimeve të pritjes në internet dhe këtë listë të programeve të shkëlqyera të testimit të përdoruesve.


01. Këndore

AngularJS u lëshua në 2010 por deri në 2016 u rishkrua plotësisht dhe u lëshua si Angular 2. Angular është një kornizë e plotë në internet e zhvilluar nga Google, e cila përdoret nga Wix, Upwork, The Guardian, HBO dhe më shumë.

Pro:

  • Mbështetje e jashtëzakonshme për TypeScript
  • MVVM u mundëson zhvilluesve që të ndajnë punën në të njëjtën seksion aplikacioni duke përdorur të njëjtën grup të të dhënave
  • Dokumentacion i shkëlqyeshëm

Kundrat:

  • Ka një kurbë pak të të mësuarit
  • Migrimi nga një version i vjetër mund të jetë i vështirë.
  • Azhurnimet prezantohen rregullisht, domethënë zhvilluesit duhet të përshtaten me to

Ç'pritet më tej?

Në këndin 9, Ivy është përpiluesi i paracaktuar. Beenshtë vendosur për të zgjidhur shumë çështje rreth performancës dhe madhësisë së skedarit. Duhet t'i bëjë aplikacionet më të vogla, më të shpejta dhe më të thjeshta.


Kur krahasoni versionet e mëparshme të Angular në React dhe Vue,
Madhësitë përfundimtare të paketës ishin shumë më të mëdha kur përdoren Angular. Ivy gjithashtu bën të mundur Hydration Progressive, e cila është diçka që ekipi Angular tregoi në I / O 2019. Hydration Progressive përdor Ivy për të ngarkuar progresivisht në server dhe klient. Për shembull, sapo një përdorues të fillojë të ndërveprojë me një faqe, kodi i përbërësve së bashku me çdo kohë pune merret pjesë për pjesë.

Ivy duket si fokusi i madh që shkon përpara për Angular dhe shpresa është ta bëjmë atë të disponueshëm për të gjitha aplikacionet. Do të ketë një opsion opt-out në versionin 9, deri në Angular 10.

02. Reagoni

React u lëshua fillimisht në 2013 nga Facebook dhe përdoret për ndërtimin e ndërfaqeve interaktive të uebit. Shtë përdorur nga Netflix, Dropbox, PayPal dhe Uber për të përmendur disa.

Pro:


  • React përdor DOM virtual, i cili ka një ndikim pozitiv në performancën
  • JSX është e lehtë për t’u shkruar
  • Përditësimet nuk e rrezikojnë stabilitetin

Kundrat:

  • Një nga pengesat kryesore është nevoja për biblioteka të palëve të treta për të krijuar aplikacione më komplekse
  • Zhvilluesit lihen në errësirë ​​në mënyrën më të mirë të zhvillimit

Ç'pritet më tej?

Në React Conf 2019, ekipi i React preku një numër gjërash për të cilat kanë punuar. E para është Hidratimi Selektiv, i cili është vendi ku React do të ndalojë çdo gjë në të cilën po punon në mënyrë që të përcaktojë me përparësi përbërësit me të cilët përdoruesi po ndërvepron. Ndërsa përdoruesi shkon për të bashkëvepruar me një seksion të veçantë, ajo zonë do të hidratohet. Ekipi gjithashtu ka punuar në Suspense, i cili është sistemi i React për orkestrimin e ngarkimit të kodit, të dhënave dhe imazheve. Kjo u mundëson përbërësve të presin diçka para se të japin.

Si Hydration Selective ashtu edhe Suspense janë bërë të mundshme nga Modaliteti Konkurrent, i cili mundëson që aplikacionet të jenë më të përgjegjshme duke i dhënë React aftësinë për të hyrë në blloqe të mëdha me punë me përparësi më të ulët në mënyrë që të përqendrohen në diçka që është me përparësi më të lartë, si përgjigja ndaj inputeve të përdoruesve. Ekipi gjithashtu përmendi aksesin si një fushë tjetër që ata kanë parë, duke u përqëndruar në dy tema të veçanta - menaxhimin e fokusit dhe ndërfaqet e hyrjes.

03. Vue

Vue u zhvillua në 2014 nga Evan You, një ish-punonjës i Google. Përdoret nga Xiaomi, Alibaba dhe GitLab. Vue arriti të fitonte popullaritet dhe mbështetje nga zhvilluesit në një hapësirë ​​të shkurtër kohe dhe pa mbështetjen e një marke të madhe.

Pro:

  • Përmasa shumë e lehtë
  • Fillestar miqësor - lehtë për t'u mësuar
  • Komunitet i madh

Kundrat:

  • Nuk mbështetet nga një kompani e madhe, si React me Facebook dhe Angular me Google
  • Asnjë strukturë reale

Ç'pritet më tej?

Vue i ka vënë vetes si synim të jetë më i shpejtë, më i vogël, më i qëndrueshëm dhe duke e bërë më të lehtë për zhvilluesit që të synojnë vendasit (nëse keni probleme me mirëmbajtjen, merrni parasysh një shërbim të mbajtjes në internet). Publikimi tjetër (3.0) pritet në Q1 2020, i cili përfshin një rishkrim virtual DOM për një performancë më të mirë së bashku me Ndihmën e përmirësuar TypeScript. Ekziston gjithashtu shtimi i API-së së Përbërjes, i cili u ofron zhvilluesve një mënyrë të re për të krijuar komponentë dhe për t'i organizuar ato përmes funksionit në vend të funksionimit.

Ata që zhvillojnë Vue kanë qenë gjithashtu të zënë duke punuar në Suspense, i cili pezullon dhënien e komponentit tuaj dhe jep një komponent kthyes derisa të plotësohet një kusht.

Një nga gjërat më të mira me azhurnimet e Vue është se ato mbajnë pajtueshmërinë e prapambetur. Ata nuk duan që ju të thyeni projektet tuaja të vjetra Vue. Ne e pamë këtë në migrimin nga 1.0 në 2.0 ku 90 përqind e API ishte e njëjtë.

Si krahasohet sintaksa e kornizave?

Të tre kornizat kanë pësuar ndryshime që nga lëshimet e tyre, por një gjë që është thelbësore për të kuptuar është sintaksa dhe mënyra se si ajo ndryshon. Le të hedhim një vështrim se si krahasohet sintaksa kur bëhet fjalë për lidhjen e thjeshtë të ngjarjeve:

Vue: v-në direktiva përdoret për të bashkangjitur dëgjuesit e ngjarjeve që thërrasin metodat në instancat Vue. Direktivat parashtrohen me v- në mënyrë që të tregojë se ato janë atribute të veçanta të siguruara nga Vue dhe të zbatojnë sjellje të veçantë reaktive në DOM të dhënë. Manaxherët e ngjarjeve mund të sigurohen ose brenda ose si emër i metodës.

shablloni> butoni v-on: kliko = "clickHandler"> Kliko mua / butonin> / template> skriptin> eksporto parazgjedhur {name: "HelloWorld", metodat: {clickHandler: function () {console.log ("Unë u klikova! ”); }}}; / skenari>

Reagoni: React vë shenjën dhe logjikën në JS dhe JSX, një zgjerim sintakse në JavaScript. Me JSX, funksioni kalon si mbajtës i ngjarjeve. Trajtimi i ngjarjeve me elemente React është shumë i ngjashëm me trajtimin e ngjarjeve në elementet DOM. Por ka disa ndryshime sintaksore; për shembull, Ngjarjet e Reagimit emërtohen duke përdorur camelCase dhe jo të vogla.

butoni i funksionit () {funksioni clickHandler (e) {console.log ("Unë u klikova"); } butoni i kthimit nëClick = {clickHandler}> Kliko mua! / butonin>; }

Këndore: Sintaksa e lidhjes së ngjarjes përbëhet nga një emër i ngjarjes së synuar brenda kllapave në të majtë të një shenje të barabartë dhe një deklarate modeli të cituar në të djathtë. Përndryshe, ju mund të përdorni në- parashtesë, e njohur si formë kanonike.

@Component ({zgjedhësi: "app-click-me", modeli: `butoni (kliko) =" onClickMe () "> Kliko mua! / Butonin>"}) eksporti i klasës ClickMeComponent {onClickMe () {console.log (" Ju më klikuat! ”); }}

Popullariteti dhe tregu

Le të fillojmë duke parë një pamje të përgjithshme të tre kornizave në lidhje me pjesën tjetër të internetit duke ekzaminuar statistikat nga W3Techs. Angular aktualisht përdoret nga 0.4 përqind e të gjitha faqeve të internetit, me një pjesë të tregut të bibliotekës JavaScript prej 0.5 përqind. React përdoret nga 0.3 përqind e të gjitha faqeve të internetit dhe 0.4 përqind e tregut të bibliotekës JavaScript dhe Vue ka 0.3 përqind për të dy. Kjo duket mjaft e barabartë dhe ju do të prisni të shihni numrat të rriten.

Trendet e Google: Gjatë 12 muajve të fundit, React është më i popullarizuari në termat e kërkimit, i ndjekur nga afër nga Angular. Vue.js është mjaft larg; megjithatë, një gjë për të mbajtur mend është se Vue është ende i ri në krahasim me dy të tjerët.

Kërkimet për punë: Në kohën e shkrimit, React dhe Angular përputhen mjaft ngushtë për sa i përket listave të vendeve të punës në Në të vërtetë me Vue shumë larg. Sidoqoftë, në LinkedIn duket se ka më shumë kërkesa për zhvilluesit e Vue.

Mbingarkesa e pirgut: Nëse shikoni rezultatet e Sondazhit të Zhvilluesve të Stack Overflow për 2019, React dhe Vue.js janë të dy kornizat më të dashura dhe të kërkuara të uebit. Angular ulet në pozicionin e nëntë për më të dashurit, por të tretët më të kërkuar.

GitHub: Vue ka numrin më të madh të yjeve me 153k por ka numrin më të vogël të kontribuesve (283). React nga ana tjetër ka 140k yje dhe 1,341 kontribues. Angular ka vetëm 59.6k yje por ka numrin më të lartë të kontribuesve nga të tre me 1,579.

Trendet e NPM: Imazhi më sipër tregon statistikat për 12 muajt e fundit, ku mund të shihni se React ka një numër më të lartë të shkarkimeve në muaj krahasuar me Angular dhe Vue.

Zhvillimi i aplikacioneve mobile

Një fokus kryesor për tre të mëdhenjtë është vendosja e celularëve. React ka React Native, e cila është bërë një zgjedhje popullore për ndërtimin e aplikacioneve iOS dhe Android jo vetëm për përdoruesit e React por edhe për komunitetin më të gjerë të zhvillimit të aplikacioneve. Zhvilluesit këndorë mund të përdorin NativeScript për aplikacione vendase ose Ionic për aplikacione hibride për celularë, ndërsa zhvilluesit Vue kanë një zgjedhje të NativeScript ose Vue Native. Për shkak të popullaritetit të aplikacioneve mobile, kjo mbetet një fushë kryesore e investimeve.

Korniza të tjera për t'u parë në vitin 2020

Nëse doni të provoni diçka të re në vitin 2020, shikoni këto korniza JavaScript.

Prush: Një kornizë me burim të hapur për ndërtimin e aplikacioneve në internet që funksionon bazuar në modelin MVVM. Përdoret nga disa kompani të mëdha si Microsoft, Netflix dhe LinkedIn.

Meteor: Një platformë JavaScript e plotë për zhvillimin e aplikacioneve moderne në internet dhe celular. Easyshtë e lehtë për tu mësuar dhe ka një komunitet shumë mbështetës.

Përfundim

Të tre kornizat po përmirësohen vazhdimisht, gjë që është një shenjë inkurajuese. Të gjithë kanë perspektivën e tyre dhe zgjidhjen e preferuar për atë që duhet të përdorin, por me të vërtetë vjen deri te madhësia e projektit dhe që ju bën të ndiheni më rehat.

Aspekti më i rëndësishëm është mbështetja e vazhdueshme e komuniteteve të tyre, kështu që nëse po planifikoni të filloni një projekt të ri dhe nuk keni përdorur kurrë ndonjë nga tre më parë, atëherë besoj se jeni në duar të sigurta me të gjithë ata. Nëse ende nuk keni pasur një shans për të mësuar ndonjë nga tre kornizat, atëherë unë sugjeroj që ta bëni rezolutën tuaj të Vitit të Ri të filloni të mësoni. E ardhmja do të sillet rreth këtyre treve.

Kjo përmbajtje fillimisht u shfaq në revistën net.

Zgjedhja Jonë
13 alternativat më të mira të Photoshop
Me Tutje

13 alternativat më të mira të Photoshop

Në e jeni duke kërkuar alternativa për Photo hop, do të zbuloni mundë itë tuaja. Ka humë ar ye p e mund të dë hironi të gjeni di a programe jo-Adobe, ...
20 iluzione trompe l’oeil që sjellin mendjen
Me Tutje

20 iluzione trompe l’oeil që sjellin mendjen

Fjalë për fjalë do të thotë 'ma htrim i yrit', Trompe l'oeil ë htë teknika e përdorimit të imazheve reali te për të krijuar një ...
20 ditarë të lartë 2016 për dizajnerët
Me Tutje

20 ditarë të lartë 2016 për dizajnerët

Në e jeni ende duke menduar mënyrën më të mirë për të organizuar vitin 2016, kjo përzgjedhje e ditarëve per onale do t'ju ndihmojë të q&...