Aina säännöllisesti ohjelmistokehittäjien maailmasta nousee termejä yleiskäyttöön, kuten vaikka applikaatio eli sovellus. Itse tein käsityötunnilla makeita applikaatioita ompelukoneella farkkutakin selkään, mutta se on toinen tarina. Yleiskielessä sovellus eli applikaatio viittaa kännykkäsovellukseen, mutta web-ohjelmistokehityksessä sovellus voi olla oikeastaan mikä tahansa selaimessa pyörivä ohjelmisto. App kääntyy siis sovellukseksi, mutta mikä on Single Page App eli SPA, joka terminä alkaa olla tuttu myös ei-koodaajille. Spoilaan sen verran, että kyseessä ei ole deittisivusto eikä edes kylpylä.

Single-page application vs. multi-page application

SPA on selaimessa käytettävä ohjelmisto, jossa kaikki toiminnallisuudet ja tiedot ladataan kerralla selaimeen, mutta kaikkea ei välttämättä näytetä kerralla. Perinteinen web-sovellus eli toiminnallinen sivusto kuten vaikka verkkokauppa näyttää käyttäjälle aina yhden näkymän kerrallaan ja hakee sitten seuraavat näkymän tarvittaessa palvelimelta. Eli jos käyttäjä käy vain kaupan etusivulla, hänen selaimeensa ei tallenneta muuta kuin etusivu. Kun hän etenee katsomaan tuotteita, ne puolestaan tallentuvat sitä mukaa kun niitä tarvitaan.  Jos yhteys hidastelee, niin sitten ei pääse mihinkään. Tätä perinteistä tapaa kutsutaan nimellä MPA eli Multi Page Application, monta näkymää, monta sivua, paljon palvelinkutsuja ja sivun luomista uudelleen selaimessa. Single Page App -logiikka on puolestaan tuttua vaikka Gmailista tai Twitteristä; kaikki on yhdellä kerralla nähtävissä, käyttäjää ei erityisesti kuljeteta mihinkään, dataa vain haetaan palvelimelta lisää sen verran kun tarvitaan.
Meillä City Dev Labsissa on tehty useita Single Page Appeja kuten Eat.fi tai Carlo Casagrandelle tehdyt ovitilaustyökalut ja siitä on tullut tavallinen toiminnallisten webbisivujen toteutuksen muoto. SPA-saittien etuna on nopeus ja responsiivisuus, selaimen ei tarvitse erikseen rakentaa näkyvää sivua joka klikkauksen jälkeen kuten ennen maailman aikaan oli pakko. Vain dataa (JSON tai XML-muodossa) haetaan palvelimelta lisää, ei itse sivuston rakennetta eli HTML:aa. Yleisimmät teknologiat SPA-saittien tekemisessä ovat JavaScript -frameworkit:

• AngularJS
• Angular
• ReactJS
• VUE.js.

Mitä tavallisen bisnessihmisen tarvitsee tietää SPA:sta? Eiköhän se riitä keväällä 2018, että kyseessä on nykyaikainen tapa tehdä dynaamisia webbisivuja eli sovelluksia.
Kirjoittaja: Anu Halme, asiakkuusjohtaja, City Dev Labs
Kuva: Carlo Casagranden verkkokaupan ovitilaustyökalu, joka on toteutettu Singe Page App-tekniikalla: