Helt siden JavaScript ble lansert i 1995, har det primært fungert som et programmeringsspråk for klient-siden (frontend). I begynnelsen fikk det også et rykte for å ha svak ytelse. I ettertid har det blitt investert en betydelig mengde tid, ressurser og arbeid for å forbedre språket.
Denne innsatsen førte til utviklingen av mange populære biblioteker og rammeverk som benytter språket. Noen viktige eksempler inkluderer jQuery, React, AngularJS, Vue og Node.js.
Hva er Full Stack JavaScript?
Full stack JavaScript er metoden for å anvende JavaScript både på front- og baksiden av en applikasjon. JavaScript er velkjent for sine front-end-biblioteker og rammeverk, mens det på baksiden benyttes Node.js.
Selv om Node.js ikke var det første forsøket på å bruke JavaScript på serversiden av programvareutvikling, var det absolutt det mest suksessfulle. I dag er JavaScript på serversiden synonymt med Node.js, og JavaScript er offisielt et fullstack programmeringsspråk med tre svært populære stakker.
MERN-stakken
JavaScript sin MERN-stakk er uten tvil den mest brukte, bestående av fire sentrale teknologier. På forsiden av disse applikasjonene finner vi React-biblioteket, et populært JavaScript-bibliotek utviklet av Facebook. Dette bibliotekets popularitet skyldes flere faktorer, inkludert fleksibilitet, ytelsesoptimalisering og rask adopsjon av store teknologiselskaper.
De tre andre teknologiene i denne stakken er Node.js, Express og MongoDB. Disse teknologiene samarbeider på baksiden av MERN-stakken.
Node.js (også kjent som NodeJS) er mer enn bare et rammeverk. Det er et asynkront JavaScript-kjøringsmiljø som opererer på en applikasjons serverside for å styre spesifikke prosesser. Utviklerne av Node.js understreker programvarens ikke-blokkerende I/O-operasjoner. Denne funksjonen gir Node.js en fordel over noen av konkurrentene, da du kan utvikle applikasjoner uten å bekymre deg for vranglås.
En annen viktig funksjon ved Node.js er at den er hendelsesdrevet. Dette innebærer at den benytter en hendelsessløyfe som en kjøretidskonstruksjon, heller enn som et bibliotek. Denne hendelsessløyfen er avgjørende for Node.js sin evne til å utføre ikke-blokkerende I/O-operasjoner.
Express (også kalt Express.js) er et Node.js-rammeverk som gjør det mulig for Node.js å utføre spesifikke oppgaver. For eksempel har Express en viktig rolle i hvordan Node.js håndterer ruting av en applikasjon, ved å forenkle prosessen. I de fleste Node.js-applikasjoner håndterer Express alle HTTP-forespørsler.
MongoDB er et NoSQL-databasehåndteringssystem. I likhet med Node.js er MongoDB en pioner innen sitt felt. I lang tid har MongoDB vært synonymt med NoSQL-databaser. Utviklere foretrekker MongoDB fordi det er brukervennlig og mindre rigid enn sine SQL-motparter.
MEAN-stakken
Det som skiller MEAN-stakken fra MERN-stakken er teknologien på frontend, som er Angular. Angular har en kompleks historie. Den første versjonen av Angular (AngularJS) ble konstruert utelukkende med JavaScript. Imidlertid er Angular som vi kjenner i dag en TypeScript (som er et supersett av JavaScript) nettutviklingsplattform.
Angular er et komponentbasert rammeverk som leverer innebygd støtte for viktige webutviklingsmekanismer, som for eksempel ruting. I tillegg fungerer Angular som en utviklingsplattform, og tilbyr avanserte funksjoner som du vanligvis må hente fra eksterne biblioteker eller rammeverk. Et slikt avansert verktøy er Angulars internasjonaliseringsverktøy.
Internasjonaliseringsverktøyet forenkler lokalisering ved å trekke ut merket tekst for oversettelse til forskjellige språk. Dette verktøyet støtter flere oversettelser og lar deg til og med formatere data basert på plasseringen til applikasjonens bruker. På baksiden av MEAN-stakken finner du Node.js, Express og MongoDB.
MEVN-stakken
Selv om MEVN-stakken uten tvil er den minst populære blant de tre store JavaScript-stakkene, har den likevel et sterkt fellesskap. MEVN-stakken består av Node.js, Express, MongoDB og Vue.
Vue (også kjent som Vue.js) er et JavaScript-rammeverk. I likhet med React og Angular bruker Vue en komponentbasert modell som lar deg utvikle både enkle og komplekse brukergrensesnitt for applikasjonene dine. Dette rammeverket har to sentrale funksjoner: det leverer deklarativ gjengivelse og reaktivitet.
Vue-rammeverket oppnår deklarativ gjengivelse ved å tillate deg å beskrive et brukergrensesnitts utdata gjennom en JavaScript-tilstand. JavaScript-tilstand spiller også en viktig rolle i denne teknologiens evne til å være reaktiv, da den lar den oppdatere Document Object Model (DOM) når endringer forekommer.
MERN vs. MEAN vs. MEVN
Sammenligningen mellom de tre store JavaScript-stakkene koker ned til de tre teknologiene på frontend. Derfor evaluerer tabellen nedenfor stakkene ved å bruke React, Angular og Vue.
| MERN | MEAN | MEVN | |
| Læringskurve | React har en jevn læringskurve. | Angular har en bratt læringskurve på grunn av sin omfattende liste over funksjoner og bruken av TypeScript. | Vue anses som mer nybegynnervennlig sammenlignet med React fordi den bruker en malsyntaks som ligner mye på HTML, mens React bruker JavaScript XML (JSX). |
| Økosystem |
|
|
|
| Lisens og fellesskap |
|
|
|
| Fleksibilitet | React er svært fleksibel når det gjelder prosjektstrukturering og gjenbruk av komponenter. | Angular er restriktiv når det gjelder prosjektstruktur på grunn av dens mange innebygde funksjoner og konvensjoner. | Vue faller et sted mellom React og Angular. Det gir et høyt nivå av fleksibilitet samtidig som det tilbyr sitt eget sett med konvensjoner når det er nødvendig. |
| Sikkerhet | React har ingen innebygde sikkerhetsfunksjoner. | Angular har en innebygd sikkerhetsfunksjon som bidrar til å forhindre cross-site scripting (XSS) angrep. | Vue har også en innebygd sikkerhetsfunksjon som bidrar til å forhindre XSS-angrep. |
| Gjengivelsesytelse | React bruker en Virtual DOM (VDOM), som er en kopi av den faktiske DOM. Når applikasjonens tilstand endres, oppretter React en virtuell representasjon i VDOM, som senere oppdaterer den faktiske DOM i en prosess som kalles avstemming. Denne tilnærmingen minimerer mengden av faktisk DOM-manipulasjon (som er en kostbar operasjon). | Angular bruker en endringsdeteksjonsmekanisme som overvåker applikasjonstilstanden og oppdaterer DOM når den oppdager endringer. | Vue bruker Reacts virtuelle DOM og kombinerer det med sitt eget reaktivitetssystem. Dette gir i hovedsak Vue det beste fra begge verdener når det kommer til gjengivelse. |
| Tilgjengelighet | React støtter ikke tilgjengelighet. | Angular har flere verktøy og funksjoner som støtter tilgjengelighet. | Vue støtter ikke tilgjengelighet. |
Fordeler med Full Stack JavaScript
En åpenbar fordel med full-stack JavaScript er at det reduserer læringskurven for utviklere som velger å bruke det til full-stack utvikling. Det er også iboende asynkront, slik at du kan utvikle mer skalerbare applikasjoner. Ytelsesmessig er JavaScript-runtime (spesielt Node.js) blant de beste, og gir imponerende prosessering på serversiden.
Det er imidlertid en bemerkelsesverdig ulempe ved å ha full-stack JavaScript. Selv om JavaScript på serversiden utmerker seg i både I/O-bundne og hendelsesdrevne prosesser, er det fortsatt ikke det ideelle valget for CPU-intensive oppgaver, spesielt når kraftigere språk som Python og Java er tilgjengelige.