JavaScripti veebiarenduse raamistik
Veebiarenduse tööriistad on veebiarenduses viimastel aastatel väga populaarseks saanud. Nad on osutunud suurepäraseks võimaluseks veebirakenduste arendamise kiirendamiseks. Veebiarendus, eriti esiotsa arendamine, on viimastel aegadel märkimisväärselt edenenud. See sobib suurepäraselt nii kasutajate kui ka tehnoloogia jaoks üldiselt, kuid see tähendab ka, et veebiarendajana seisate silmitsi pideva survega lisada oma repertuaari rohkem oskusi ja õppida rohkem veebiarendust. Veebiarenduses on seal saadaval sadu veebiarenduse tööriistu ja võib-olla olete neist mõnda juba katsetanud. Kuid nende valdamine nõuab tõsist aega ja vaeva. Ilmselt tähendab see, et te ei saa kõiki veebiarenduse raamistikke vallata. Peate hoolikalt valima, kuhu soovite investeerida, ja see võib osutuda väljakutseks. Idee õppida midagi uut veebiarendust pole sugugi ahvatlev, eriti kui arendate lõpuks välja rakenduse, mida peate seejärel hooldama.
Teisisõnu, peate oma veebiarenduse tööriistad valima hoolikalt. Kuid miks üldse häirida veebiarendust? Miks mitte minna tavapärase serveripoolse rakendusega? Vastus on selles, et veebiarendustööriistad pakuvad paremat kasutajakogemust ja kasutajakogemus on iga veebirakenduse tuum.
Näiteks kui kasutaja klõpsab nuppu, peab tavaline serveripoolne veebirakendus kogu lehe uuesti laadima ja see võib võtta aega. JavaScripti veebiarenduse raamistikud laadivad aga ainult need lehe osad, millega kasutaja suhtleb. See tähendab kiiremat ja reageerimisvõimelisemat kasutajaliidest ning loob kasutajakogemuse, mis on sama terav ja kiire kui loomuliku mobiilirakenduse puhul.
Veebiarenduse raamistikes saate sarnaseid tulemusi saavutada traditsioonilise serveripoolse rakenduse ja mõne jQuery abil, kuid see võib minna väga kiiresti allamäge. Koodihaldus jQuery abil on suur väljakutse, kui te ei tegele mõne lihtsa rakendusega, kuna see viib peaaegu alati spagetikoodini. Teisest küljest lahendab kaasaegne JavaScripti veebiarendus koodihalduse väljakutse täpselt määratletud rakendusearhitektuuri abil. Nad kasutavad sageli Model-View-Controller (MVC) kujundusmustrit, millel puudub jQuery. Need veebiarenduste raamistikud on täpselt määratletud arhitektuurid, mis lihtsustavad arendamist. Valige veebiarenduse raamistik ja saate otse reageerivad kasutajaliidesed ning hästi struktureeritud ja hooldatava koodi.
JavaScripti veebiarenduse raamistikud õppimiseks
Siin on neli JavaScripti veebiarenduse raamistikku ja nende eelised:
1.Tagaluu
Backbone.js on üks vanimaid veebiarenduse raamistikke, mille väljaandmine toimus 2010. aastal, kuid vaatamata oma vanusele tuleb seda siiski tõsiselt kaaluda. Ühe jaoks on see ülikerge, kõigest 6, 3 KB. See on siis, kui see on tootmiseks kokku surutud ja minimeeritud ning seda ainult ühe sõltuvusega. Veebiarenduse raamistikud on väga mitmekülgsed ja esindavad minimalistlikku MVC disaini, mis kasutab enamikku tänapäeval populaarsetest veebisaitidest, sealhulgas Pinterest, Hulu ja Twitter.
Backbone'iga saate palju ära teha, millel pole nii palju piiranguid kui muude veebiarenduste puhul. Näiteks pole sellel Underscore.js-ga kaasasoleva põhimootori kõrval mallmootorit. See annab teile võimaluse valida oma projekti jaoks kõik, mida soovite.
Selgroo kerge iseloom paistab tõesti läbi, kui seda kasutatakse lihtsamate projektide jaoks, kus kiirus on suurim prioriteet, näiteks Pinterest ja Twitter ühelehelised rakendused või vidinad, mis moodustavad osa tavapärasest veebirakendusest.
Kuid selle kerge kaal võib olla ka tema suurim viga. Selgroog võib olla nii kondita, et selle töötamiseks on vaja tõsiseid JavaScripti oskusi. See muudab selle paremini JavaScripti edasijõudnutele. Selle veebiarendusriista abil sõltub väljund suuresti teie kogemusest ja oskuste tasemest. Selgroograkenduse ehitamiseks saate segada ja sobitada paljusid pistikprogramme ja raamatukogusid, mis on kogenud arendajatele tohutu õnnistus, kuid väljakutse algajatele.
Samuti kurdavad mõned arendajad, et veebiarendustööriista käivitamiseks ja projekti käivitamiseks tuleb kirjutada palju katlakivikoodi. Kogenumad arendajad on öelnud, et nad ei kirjuta peaaegu nii palju koodi, mis jällegi viitab sellele, et selgroog sobib pigem kogenud rahvaga. Teine oluline selgroo probleem on serveripoolse renderdamise puudumine - see on asi, mida näete hiilimas paljudes teistes veebiarendustööriistades, eriti nendes, mis kasutavad MVC-kujundusi.
Serveripoolse renderdamise puudumine võib tõesti mõjutada veebirakenduse toimivust ja mõjutada ka SEO-d. Otsimootorid, mis ei saa JavaScripti sõeluda, ei saa sisu saitidelt, mis ei toeta serveripoolset renderdamist. Muidugi on selle probleemiga seotud ümberkorraldusvõimalusi, kuid kui peate valiku Selgroog, peate seda meeles pidama.
2.AngularJS
Nii et varem rääkisime veebiarenduse teemal Selgroog, mis on seal üks vanimaid veebiarenduse raamistikke. Noh, AngularJS on vanem kui Backbone aasta võrra, kui see Brat Tech 2009. aastal välja andis. Kuid see sai tõepoolest alguse vaid Google'i toel, mistõttu peetakse seda nooremaks veebiarenduse raamistikuks kui see tegelikult on. Nurk hakkas veojõudu omandama 2012. aastal ja on viimastel aastatel kiiresti populaarsust kogunud.
See populaarsuse purunemine on viinud tugeva kaastöötajate kogukonnani, kuid mõned on öelnud, et Angular ei täida hüpe. Tootmiseks tõmblukustatud ja kokkusurutud Angular on suurusega 36 KB ja see ei järgi MVC kujundusmustrit, mistõttu väidetakse sageli olevat veebiarendustehnoloogiaid „mudel-vaade-mida iganes” jaoks. See on umbes kolm korda suurem kui selgroog ja seda mõjuval põhjusel, kuna see sisaldab rohkem sisseehitatud funktsioone. Mõned populaarsemad saidid, mis seda veebiarendust kasutavad, on MSNBC, VEVO ja The Weather Channel.
Angulari üks tuntumaid funktsioone on kahesuunaline andmete sidumine. Nüüd tähendab andmete sidumine, et andmed seotakse vaate HTML-elemendiga ja element saab andmeid ka värskendada ja kuvada. Rakenduses AngularJS saavad andmeid vaadata nii View kui ka Model, mistõttu kutsutakse seda andmete kahesuunaliseks sidumiseks. Selle funktsiooni abil vajate dünaamiliste vaadete loomiseks vähem kodeeringut.
Nurga teine populaarne omadus on direktiivid. Need võimaldavad arendajatel DOM-i osadele kinnitada spetsiaalset käitumist, laiendades HTML-i. Näiteks võimaldab ng-korrata direktiiv arendajatel elemendi kordamist, mis on väga kasulik üksuste massiivi printimiseks või muude toimingute tegemiseks. Võite isegi oma direktiive teha, välja arvatud need, mis on kaasas nurgaga, mis lisab kasutajaliidese käitumise loomiseks rohkem paindlikkust.
Nurgaga on kaasas ka funktsioon, mida nimetatakse sõltuvuse süstimiseks, mis võimaldab arendajatel hõlpsalt oma moodulitele teenuseid lisada. Näiteks kui soovite funktsiooni kirjutamisel kasutada asukohta, peate vaid lisama selle funktsiooni parameetriks. Nurga all veenduge siis, et funktsiooni jaoks oleks kättesaadav teenuse eksemplar. See on eriti kasulik piltide andmete sisestamiseks komponentidesse, muutes nurga väga testitavaks.
Google'i olemasolu sponsorina on samuti tohutu pluss ja kriitiline kaalutlus. Seetõttu on nii paljud ettevõtted ja arendajad valinud nurga. Kuid kahesuunaline andmete sidumine, mis muudab selle nii populaarseks, võib olla ka üks selle suurimaid probleeme. See kipub mõjutama rakenduse jõudlust ja muudab silumise keerukamaks.
Nurk võib olla ka aeglane, kui seda kasutatakse keerukamates suuremates rakendustes, mis kahjustab tohutut põhjust veebiarenduse kasutamiseks. Kuid asjatundlikud veebiarenduse raamistikud lahendavad selle probleemi suures osas. Samuti on olemas Angular 2.0, mis on nüüd beetaversioon ja mis on oluline muutus võrreldes varasemate veebiarenduse raamistikega, null tagurpidi ühilduvusega. Kui kavatsete valida nurga all, võiksite minna ka 2.0-le, kuid see risk on endiselt beetaversioon. Samuti puudub nurgal serveripoolne renderdamine.
Soovitatavad kursused
- C # sertifitseerimise kursus
- PHP ja MySQL kursused
- Pooljuhtide kursused
- Tarkvara hindamise atesteerimiskoolitus
3.Ember
Ember on võrreldes Angular või Backbone'iga üks tõeliselt noorematest veebiarendustest, mille esmakordselt avaldas 2011. aastal Yehuda Katz, Ruby on Rails ja jQuery tuumimeeskondade liige. See on ülioluline, kuna Ember tunneb end sageli Railsiga väga sarnasena. Selle on üles ehitanud pühendunud arendajate kogukond, mille taga pole ühtegi ettevõtte sponsorit. Siiani on veebiarenduse raamistikes nii hea olnud.
Tootmiseks tõmblukustatud ja tihendatud Ember on 95 kB, mis teeb sellest selles veebiarendustehnoloogiate loendis ühe raskeima veebiarenduse. Juhtrauad ja jQuery on vajalikud sõltuvused, mis selles paketis sisalduvad. Kas see lisaraskus sisaldab lisafunktsionaalsust? Jah, küll. Nest, Vine, Qualcomm ja NBC News kasutavad oma veebisaitidel Emberit.
Emberi puhul ületab konventsioon konfiguratsiooni. Selle veebiarenduse kasutamisel on olemas nn eber-viis, kuidas neid asju teha. Nendes tööriistades on üsna palju kõike, mis on vajalik veebirakenduse ehitamiseks, sealhulgas mallide kogu ja muud, mis säästavad arendajatel palju aega ja aitavad neil keskenduda suuremate projektipõhiste probleemide korral.
Emberi huvitav osa on Ember CLI - käsurida, mis pole küll vajalik, kuid millest võib tõesti abi olla. See tegeleb enamiku asjadega, mille jaoks inimesed Gulppi või Gruntit kasutavad, näiteks JS-i ja CSS-i minimeerimine või Sassi koostamine. Kui teil pole ehitamissüsteemi paigas, on Ember CLI sellest alustuseks tõesti kasulik.
Mitme arendaja jaoks on tohutu pluss ka ettevõtte sponsori puudumine. Selle veebiarendusriistade taga olev meeskond on pühendatud avatud lähtekoodiga liikumisele. Kui ettevõtte sponsorlus on midagi, mis on teile lähedal, võib see teile sobida.
Asjade tegemise nn jäme viis muudab arendamise teatud mõttes lihtsaks, kuid see piirab ka teie võimalusi. Emberi viis sarnaneb nurgelistega, kuid see erineb kindlasti väga vanimatest veebiarendustehnoloogiatest nagu näiteks Selgroog jne, mis annab teile palju rohkem vabadust asju omavahel segada ja omavahel sobitada. Samuti genereeritakse palju koodi, nii et teil võib olla keeruline aru saada, mis täpselt toimub. Õppimiskõver võib olla üsna järsk, kui teil on nii suur veebiarendus, millel on palju sisseehitatud funktsioone. Emberil on ka kõik kahesuunalise andmete sidumise plussid ja puudused, isegi kui see kasutab teistsugust rakendust. Ka sellel puudub serveripoolne renderdamine, kuid Emberi meeskond on öelnud, et see eemaldub kahesuunalisest sidumisest ja serveripoolsest renderdamisest.
4.React
React on siin veebiarendustehnoloogiate osas noorem veebiarendus, kõigest kolmeaastane veebiarendustehnoloogia, mille esimene väljalase 2013. aastal oli ainult Facebook. see veebiarendus erineb oma lähenemisviisis oluliselt muudest veebiarendustehnoloogiatest selles veebiarendustehnoloogiate loendis, mistõttu peate sellesse veebiarendustehnoloogiatesse investeerimist hoolikalt kaaluma.
Kui teistel siin kolmel veebiarendustööriistal on kliendi poolel asuv MVC-kujundus, keskendub React Facebooki andmetel rohkem vaate osale. Ülejäänud mustri jaoks Fluxi rakenduste arhitektuur, mis sobib kõige paremini suurte rakenduste jaoks veebiarendustehnoloogiates. Praktiliselt öeldes peaks enamuse rakenduste jaoks hästi reageerima see reaalajas.
Veebiarenduses on react suuruseks 120 KB, tootmiseks kokku pakitud ja minimeeritud. Ehkki selles veebiarendustööriistade loendis on kõige raskem, pole sellel nõutavaid sõltuvusi. Muidugi kasutab Facebook Reaktorit, nagu ka Instagram, Netflix ja BBC.
Vaatamata veebiarenduse suurusele on React selles veebiarendustööriistade loendis kiireim veebiarendus ning sellel on palju pistmist sünteetiliste sündmuste ja virtuaalse DOM-i juurutamisega. Seda on ka lihtne õppida, mida iga arendaja hindab. Ember ja Nurk iseloomustavad palju domeenispetsiifilisi keeli, mis on nende järskude õppimiskõverate peamine põhjus. Reageeri siiski mitte, muutes õppimise lihtsamaks, kui teate oma JavaScripti.
Kui olete CommonJS-i moodulitega tuttav, sobiksite te Reactiga üsna hästi, kuna sellel on komponendipõhine lähenemisviis. Iga komponent on osa kasutajaliidesest, nagu lehe pealkiri või vormi element, mida saab segada ja sobitada ning mis võimaldab koodi maksimaalset korduvkasutatavust.
Reaketi üks tohutu pluss on see, et kui olete selle selgeks õppinud, saate seda kasutada nii veebi kui ka iOS-i rakenduste kirjutamiseks. See võib olla suur eelis, kui arvestada, kui olulised on mobiilirakendused praegu. Samuti toetab React juba serveripoolset renderdamist, nii et pole vaja kasutada ümberarvutusi, nagu ülaltoodud veebiarendustehnoloogiate puhul. Kuid selle raamistiku vastuoluline aspekt on komponentide kasutamine kasutajaliidese jaoks ja mallide puudumine. See tähendab sisuliselt seda, et teie HTML on teie JavaScriptis.
Veebiarendustehnoloogiate järeldus
Praegu näib, et React on siin kõige tugevam veebiarendus, kuid tõde on see, et igal ühel on oma plussid ja miinused ning teie otsustada on, mida soovite õppida. JavaScript on muutunud veebiarenduses hädavajalikuks ja nende veebiarenduste jaoks on oluline, et saaksite hüppe teha ja omandada teadmisi rohkem kui mõne veebiarendustehnoloogia osas, et ajaga kaasas käia.
Soovitatavad artiklid
See on juhend veebiarendustööriistade ja veebiarenduse raamistike eeliste kohta veebiarenduses. Sellel lingil võite teada saada ka välist kasu.
- Parim juhend veebiarenduse intervjuuküsimuste kohta
- 10 uut eelist - veebiarenduse tööriistad algajatele (tasuta)
- Uurige välja 8 hämmastavat erinevust andmeteaduse ja veebiarenduse vahel
- Alustage veebiarenduse Pythoni ja Django kasutamist
- Nurk 2 vs Vue JS: millised on hämmastavad funktsioonid
- SASS-i intervjuu küsimused: kasulikud küsimused