Viimeisen parin vuoden aikana on Suomen läpi mennyt melkoinen JavaScript-aalto. Erityisesti räätälöityjä web-sovelluksia koodaavat firmat ovat olleet tämän hehkutusaallon harjalla, mutta myös perinteisemmät web-firmat ovat viime aikoina ryhtyneet yhä enemmän käyttämään Javascript-frameworkkeja toiminnallisempien osioiden toteutukseen verkkopalveluissa.
North Patrol on suunnitteluun erikoistunut konsulttitoimisto. Suunnittelemme, autamme teknologiavalinnoissa, kilpailutamme. Emme myy toteutusprojekteja, emmekä lisenssejä, olemme aidosti asiakkaan puolella.
28.6.2017
Hypeaallon keskellä on myös puhuttu SPA-sovelluksista ja -sivustoista (”Single-Page-Application”), joilla viitataan kokonaan yhtenä Javascript-sovelluksena pyörivään kokonaisuuteen. Tällöin erillisten html-sivujen sijasta kokonaisuus rakentuu vain yhden sivun varaan, mutta tämä sivu voi muuntautua minkälaiseen olomuotoon tahansa. Tämän mallin keskeisimpänä etuna on nähty sivulatauksista eroon pääseminen, jolloin verkkosivusto voi muuttua ja päivittyä ilman käyttäjää ärsyttäviä välkähteleviä sivulatauksia. Facebook on tämän ajatuksen pitkälle viety ruumiillistuma. Keskon keväällä julkaisema K-ruoka-verkkokauppa on myös hyvä esimerkki erittäin sovellusmaisesta verkkopalvelusta, jossa Javascriptillä on erittäin merkittävä rooli käyttöliittymän toiminnassa.
Ylipäätään Javascript-buumissa on paljolti kysymys siitä, että Javascriptin avulla pystytään toteuttamaan merkittävästi aiempaa sovellusmaisempia palveluita selaimen sisällä. Aiemminhan esimerkiksi verkkopankit olivat varsin kankeita ja hitaasti latautuvia palveluita (ok, useimmat ovat vieläkin…), mutta nykyisin juuri Javascript mahdollistaa käyttökokemuksen, jossa kaikki tapahtuu nopeammin (ainakin alkulatauksen jälkeen) ja käyttö tuntuu enemmän sovellukselta kuin nettisivujen latailulta.
Javascriptin mahdollistamasta dynaamisuudesta ovat hyviä esimerkkejä vaikkapa lentojen hintavertailusivustot, joissa tuloksia ladataan näkyviin sitä mukaa kun niitä vastaanotetaan ja filttereiden säätäminen muuttaa hakutuloksia välittömästi.
Mahdollisuudet ovat siis kiistatta merkittävät. Oman verkkosivuston sisälle tai rinnalle voi teetättää ”kohtuullisella rahalla” (alkaen joitain kymmeniä tuhansia euroja) erittäin nopeasti reagoivan ja visuaalisesti tyylikkään web-sovelluksen. Javascriptiä ei myöskään tarvitse lähteä koodaamaan aivan nollasta, koska esimerkiksi Google (Angular) ja Facebook (React) ovat vapauttaneet avoimeksi lähdekoodiksi paljon tekemäänsä kehitystyötä. Myös erilaiset avoimen koodin projektit ovat tuottaneet paljon valmiita elementtejä, joiden avulla näitä web-sovelluksia pystyy nykyisin rakentamaan tehokkaammin kuin aiemmin.
Framework helpottaa kehittäjää
Javascript-sovellusten toteutuksessa keskeisessä osassa ovatkin nämä frameworkit (ohjelmistokehys olisi ehkä lähin suomenkielinen ilmaus), jotka paketoivat sisäänsä valmiita malleja ja tapoja sovellusten kehitykseen. Frameworkkien avulla aivan kaikkea ei tarvitse koodata nollasta.
Käytännössä frameworkit tehostavat sovellusten tekemistä niin paljon, että ilman frameworkkeja ei laajoja Javascript-sovelluksia käytännössä tehdä.
”Puhdasta Javascriptiä” tehdään toki edelleen, koska jos Javascriptiä käytetään vain joissain pienissä osissa, kuten navigaation toiminnan tehostamisessa, niin isoa frameworkkia ei kannata ladata turhaan, vaan on järkevämpää vain kirjoittaa itse muutama rivi Javascriptiä.
Tällä hetkellä valitettavan yleistä on tosin myös se, että pieniinkin asioihin kehittäjät käyttävät suosimaansa frameworkkia, jolloin tarpeettomasti kuormitetaan verkkoyhteyttä ja etenkin käyttäjän selaimen suorituskykyä, kun selain joutuu lataamaan raskaan Javascript-framework-paketin.
Tavallisten verkkosivustojen toteutuksessa ei raskailla frameworkeilla pitäisi olla mitään sijaa, ja todennäköisesti ilmiö tasaantuu jossain kohtaa, koska esimerkiksi Google arvottaa nykyisin varsin paljon sivujen nopeutta, jolloin hitaat sivustot kärsivät sijoituksissa.
Erittäin sovellusmaisen verkkopalvelun aikaansaamiseksi Javascript-toteutus on kuitenkin välttämättömyys, ja silloin nousee pöydälle seuraava kysymys:
Onko frameworkin valinnalla väliä?
Frameworkin valinta on varsin keskeinen kysymys, jos aikoo lähteä Javascript-sovellusten ihmeelliseen maailmaan. Pitäisikö tehdä Angularilla vai Reactilla? Entäpä Ember, Vue, Meteor? Ja miten Node liittyy tähän kaikkeen?
Näihin kysymyksiin olemme saaneet vastailla North Patrolissakin viime vuosina.
Toteutusfirmoilla on yleensä vahvat suosikkityökalut, ja suosikkityökalua tai työkalukomboa sitten yleensä tarjotaan lähtökohtaisesti kaikkiin tilanteisiin. Harva firma tekee usealla eri frameworkilla samanaikaisesti, vaikka frameworkkien väliset erot eivät ole valtavia.
Asiakkaiden harvoin kannattaa lähteä perehtymään kovin syvälle eri frameworkkien teknisiin eroihin. Asiakkaiden kannalta on kuitenkin useita asioita, jotka on erittäin tärkeätä tiedostaa, kun päättää lähteä Javascript-toteutusten maailmaan.
Teknologiavalinta on vuosikymmenen investointi
Teknologiaratkaisuissa ei kannata tehdä valintojaan kuumimpien trendien mukaan, vaan soveltuvuuden, skaalautuvuuden, ylläpitokokemuksen, yhteensopivuuden ja elinkaarikustannuksien ehdoilla. North Patrol auttaa näkemään teknologiavaihtoehtojen plussat ja miinukset puolueettomasti, konkreettisesti ja kaukonäköisesti.
Mitä tahansa valitset, vuoden päästä se on jo vanhentunutta tekniikkaa
Javascript-frameworkkien kenttä on tällä hetkellä varmasti nopeimmin muuttuva alue web-alalla. Jopa IT-alan normaaliin muutosvauhtiin verrattuna Javascript-frameworkkien välinen hippaleikki on aivan naurettava. Vain hetki sitten kaikki hehkuttivat Angularia, nyt monet jo pitävät sitä aivan reliikkinä (ja tietysti Angulareja on ykkönen ja kakkonen, joilla ei tietenkään ole kovin paljon yhteistä – paitsi että kumpikin on jo menneen talven lumia useimpien mielestä). Useimmat entiset Angular-fanit vouhottavat juuri nyt Reactista, mutta jopa innokkaimmat tunnustavat, että jopa vuoden sisällä voivat vouhottaa yhtä innostuneesti jostain toisesta – vaikkapa Vuesta.
Oion tietysti mutkia edellisissä kommenteissa, mutta en aivan valtavasti. Javascript-frameworkkien ”trendikkyys” on oikea ilmiö. Valitettavasti.
Nopea muutosvauhti ei ole ohjelmistotoimittajille ongelma, mutta asiakkaille on. Omia sovelluksia voi joutua uudelleenkoodaamaan jopa parin vuoden välein, vaikka bisneslogiikka tai vaatimukset eivät olisi muuttuneet mitenkään.
Yksittäisen kehittäjän tai IT-toimittajan kannalta tämä muutosvauhti ei tietysti ole katastrofi, koska vuoden päästä tehdään varmasti jo uusia projekteja, ja ne voi hyvin aloittaa uudella ja paremmalla frameworkilla.
Asiakkaiden kannalta nykyinen muutosvauhti vain käy helposti todella kalliiksi. Omia sovelluksia voi joutua uudelleenkoodaamaan jopa parin vuoden välein, vaikka bisneslogiikka tai vaatimukset eivät olisi muuttuneet mitenkään.
Vaarallisinta on valita framework, joka on jo ohittanut trendin harjan ja on matkalla hitaaseen kuolemaan, koska sen varaan tehty palvelu voi olla vaikea ylläpitää ja jatkokehittää.
Frameworkkien oma tuotekehitys on myös vauhdikasta, ja tämäkin voi pakottaa oman sovelluksen uudistamiseen aika ajoin, koska uudet ominaisuudet voivat rikkoa vanhoja toiminnallisuuksia.
Varaudu jatkuvaan huoltoon, päivittämiseen ja korjauksiin
Sovelluksien jatkuva ylläpito onkin Javascript-maailmassa lähes välttämättömyys, koska yhteensopivuuden varmistaminen eri laitteiden kanssa ja frameworkin päivitykset voivat pakottaa lähes jatkuvaan pienkehitykseen. Tämä ei tietysti ole mikään ongelma, jos sovellusta muutenkin kehitetään koko ajan (esim. startup-yrityksen tapauksessa), mutta jos haaveena olisi saada luotettavaa elinkaarta useammaksi vuodeksi, niin Javascript-frameworkin varaan rakentamista kannattaa ehkä harkita uudestaan.
Käytännössä kyse on myös aina täysin asiakaskohtaisista toteutuksista, eli räätälöidyistä sovelluksista. Angular tai React eivät ole tuotteita, jotka vain otetaan käyttöön, vaan ne ovat hyvin matalan tason ohjelmistokehyksiä, jotka auttavat ohjelmistokehittäjiä räätälöidyn sovelluksen rakentamisessa. Esimerkiksi tavallisen verkkosivuston rakentaminen Angularilla tai Reactilla maksaa varmasti kymmenkertaisen summan kuin yksinkertaisen WordPress-sivuston toteutus. Yksinkertaisiin tehtäviin ei näitä frameworkkeja tule koskaan käyttää. Nämä lelut on suunniteltu vaativien tietojärjestelmien käyttöliittymien rakennuspalikoiksi.
Siksi myös sopivaa kumppania valitessa tulisi kiinnittää merkittävää huomiota kumppanin testausosaamiseen, ohjelmistokehityksen käytänteisiin ja ylipäätään laadunvarmistusosaamiseen. Esimerkiksi sellaiset asiat kuin automaattinen testaus ja jatkuva integraatio eivät ole ollenkaan liian kovia vaatimuksia silloin kun ollaan lähdössä tekemään laadukkaita web-sovelluksia Javascript-frameworkeilla.
Vastauksena aiemmin esitettyyn kysymykseen (Onko frameworkin valinnalla väliä?):
Tällä hetkellä Javascript-markkina on niin kuuma, ja nopeasti muuttuva, että tärkeintä on valita framework, joka on on trendin harjalla ja jota valitsemasi toimisto osaa ja haluaa käyttää. Vaarallisinta on valita framework, joka on jo ohittanut trendin harjan ja on matkalla hitaaseen kuolemaan, koska sen varaan tehty palvelu voi olla vaikea ylläpitää ja jatkokehittää.
(Sivukommentti: North Patrol ei yleensä suosittele asiakkaille trendien perässä juoksemista, mutta silloin kun markkina muistuttaa ryntäilevää sonnilaumaa, niin kannattaa veikata sitä sonnia, joka juoksee keulalla kovimpaa.)
Frameworkin valintaa isompi kysymys kun on se, että kannattaako Javascript-maailmaan lähteä? Tai kuinka isosti sinne kannattaa lähteä? Ja onko oikeasti tekemässä jotain niin vaativaa, että on pakko nojata johonkin läskiin frameworkkiin?
Näitä kysymyksiä kannattaa aidosti pysähtyä hetki pohtimaan, vaikka oma toimisto suu vaahdossa ehdottaisikin uuden verkkopalvelun frontin tekemistä kokonaan Javascriptillä.
Ja sitten jos päätät mennä JavaScript-maailmaan, ota siitä tehot irti:
Panosta käyttökokemukseen, kun se kerran on mahdollista
Yksi toistuva ihmettelyn aihe North Patrolin toimistolla on se, että miksi Javascript-frameworkeilla tehdyt verkkopalvelut tai web-sovellukset eivät hyödynnä joustavan alustan mahdollisuuksia, vaan käyttäytyvät edelleen samalla tavalla kuin perinteiset verkkosivutkin. Miksi käyttää uutta ja kallista toteutustapaa jos ei aio ottaa sen isoimmasta mahdollisuudesta tehoja irti?
Syynä tähän on tietysti se, että merkittävä osa toteutuksista menee tällä hetkellä täysin tekniikka edellä. Tekninen toimittaja on myynyt ajatuksen modernista toteutustavasta, mutta teknisen toimittajan suunnitteluosaaminen ei riitä lunastamaan lupausta paremmasta käyttökokemuksesta. Pahimmillaan kalliit web-sovellukset ovat käytettävyyspainajaisia, jotka eivät noudata mitään käytettävyysstandardeja, saatika että joku oikea designeri olisi huolella suunnitellut palvelun käyttökokemuksen.
Esimerkiksi aiemmin viitattu Momondo ottaa käyttökokemuksessa tehoja irti teknologiasta, koska käyttöliittymä on täynnä erilaisia dynaamisia slaidereita ja valikkoja, joita on miellyttävää säädellä ja kokeilla. Kohteita voi merkata suosikkeihin, sivun elementtejä voi järjestää uusiksi, elementtien kokoa voi muuttaa, linkeistä saattaa avautua tyylikäs pop-uppi. Nämä kaikki ovat asioita joita olisi perinteisillä html-tekniikoilla vaikea toteuttaa.
Keskon K-ruoka-verkkokauppa on hyvä kotimainen esimerkki palvelusta, jossa on otettu tehot irti Javascriptistä, ja palvelun käyttökokemus on huolella suunniteltu ja toteutettu. Hintalappu on toki pelkälle frontille varmasti satoja tuhansia euroja, mutta tässä tapauksessa rahalle on saatu vastineeksi juuri sitä mitä pitäisikin saada.
Raskas Javascript-toteutus mahdollistaa tämän kaiken ja aiheuttaa käyttäjälle imua palvelun käyttöön (ns. immersiivisyyttä). Momondon palvelussa lentoa jaksaa hakea pitkäänkin, kun palvelu tuntuu hyvin suunnitellulta ja toimivalta työkalulta, jonka kanssa voi ”keskustella” siitä mikä lento olisi minulle parhaiten sopiva. Tällaisen kokemuksen saavuttaminen vaatii kuitenkin merkittävää panostusta konseptin ja käyttökokemuksen suunnitteluun, eikä suinkaan synny vain panostamalla moderniin teknologiaan. Teknologia vain mahdollistaa paremman käyttökokemuksen.
Ekosysteemi on vielä hauras
Lopuksi on syytä todeta, että näiden mainittujen keskeisimpien haasteiden lisäksi Javascript-frameworkkien saralla kärsitään vielä lukuisista muistakin, pienemmistä haasteista.
Esimerkiksi suorituskykyhaasteet ovat vieläkin yleisiä, koska kokemattomuudesta tai käytetyistä toteutustavoista johtuen Javascript-sovellukset voivat vaatia kohtuullisen paljon verkkoyhteydeltä tai päätelaitteelta. Tällöin lupaus nopeudesta voi kääntyä itseään vastaan, kun asiakkaat eivät jaksa odottaa edes sovelluksen ensimmäistä latautumista. Myös saavutettavuuden ja hakukoneoptimoinnin näkökulmasta Javascript-toteutukset tuottavat usein ikäviä yllätyksiä asiakkaille.
Tähän asiaan vahvasti liittyvä haaste on myös rekrymarkkinan merkittävä ylikuumentuminen tällä hetkellä. Javascript-osaajia haetaan rahatukkujen kanssa kotoa ja mökiltä töihin. Parhaimmat osaajat vaihtavat työpaikkoja herkästi, ja omaan projektiin voi olla vaikea saada kiinnitettyä kovia osaajia – ja pitkäksi ajaksi heitä ei saa missään tapauksessa.
Kestääkin aikansa, että Javascript-buumi tasaantuu ja internetin infrastruktuuri päivittyy sellaiselle tasolle, jossa raskaitakin Javascript-sovelluksia pystytään luotettavasti pyörittelemään laitteella kuin laitteella ja tilanteessa kuin tilanteessa.
Suunta on kuitenkin selvä, Javascript-frameworkit ovat tulleet jäädäkseen. Koko webistä ei Javascript-vetoista tule, mutta vaativien web-sovelluksien rakennuspalikoiksi ne ovat tulleet jäädäkseen. Asiakkaana tärkeintä on varmistaa, että on oikeasti tekemässä web-sovellusta, eikä vain kallista ja vaikeasti ylläpidettävää Javascript-kuorrutettua verkkosivustoa.
Teknologiavalinta on vuosikymmenen investointi
Teknologiaratkaisuissa ei kannata tehdä valintojaan kuumimpien trendien mukaan, vaan soveltuvuuden, skaalautuvuuden, ylläpitokokemuksen, yhteensopivuuden ja elinkaarikustannuksien ehdoilla. North Patrol auttaa näkemään teknologiavaihtoehtojen plussat ja miinukset puolueettomasti, konkreettisesti ja kaukonäköisesti.
PS. Sinua voisi kiinnostaa tulossa oleva ilmainen webinaarimme: Digitaaliset asiointipalvelut – Erilaiset konseptit ja toteutuksen eri vaihtoehdot (11.12.2024 klo 10:00). Ilmoittaudu webinaariin
