Hvordan vi bygger lynrask, server-gjengitt e-handel med Next.js

Mitt navn er Magnus Öhrström, jeg er frontend-utvikler hos Cloud Nine, og jeg jobber for tiden med et av våre nystartede e-handelsprosjekter.

En rask applikasjon med korte lastetider er et must for enhver moderne nettside, og er spesielt viktig for alle dagens e-handlere, ikke minst for e-handleren som jeg jobber med akkurat nå. Cloud Nine har lang erfaring med å lage raske og responsive grensesnitt ved hjelp av React javascript-rammeverket. Med en React-applikasjon trenger ikke hele siden å oppdateres ved for eksempel et knappeklikk, men kun berørte deler som må endres. Hvordan det fungerer i en såkalt «Single Page Application» forteller en annen av våre frontend-utviklere Alexander, mer om i innlegget.

I arbeidet med e-handelsprosjektet vårt bruker vi også et rammeverk kalt Next.js, som er ekstra spennende å jobbe med, fordi det muliggjør såkalt «server-side rendering». Dette betyr at javascript-applikasjonen kan gjengis på serversiden i stedet for på klientsiden. Dette gir en rekke fordeler. Nettsidene får kortere lastetider og da spesielt på den første gjengivelsen av siden. Dette utgjør en stor forskjell for for eksempel mobilbrukere med treg internettforbindelse, siden nettsiden blir raskere interaktiv.

Noen søkemotorer og andre typer roboter kan ikke gjengi javascript, men de kan håndtere en servergjengitt applikasjon. På denne måten har nettsiden bedre forutsetninger for å havne høyere i SEO-hierarkiet. I tillegg til SEO-fordelen, håndterer applikasjonen dataoverføringer raskere enn en klientgjengert applikasjon.

Å ha en nettside med høy ytelse blir viktigere og viktigere. Vi i Cloud Nine bruker Next.js i et par oppstartsprosjekter for e-handel for å dra nytte av server-renderte React-applikasjoner, for å lage nettsteder med svært høy ytelse.