Beanloop är med och bygger om Bygghemmas e-handel

BHG har varit vår kund sedan 2018, då vi kom in i början av ett projekt som innebar att stötta Bygghemmas team i Malmö och Oskarshamn med arbetet att skriva om deras e-handel till React.js. Det har varit ett mycket givande samarbete med ett utbyte av kunskaper och erfarenheter åt båda håll.

Att skriva om en e-handel i ett SPA-ramverk som React.js medför utmaningar. Sökmotoroptimering är något som e-handlare vill optimera för, därför krävs det att sidan fungerar väl utan JavaScript. Bygghemma fungerar således även utan JavaScript (om än begränsat) och Googles sökrobotar kan indexera sidan.

En omskrivning sker inte över en natt, speciellt inte med en så stor e-handel som bygghemma.se. Därför har det varit väldigt viktigt att den gamla tekniken ska kunna leva och samsas med den nya. Det har varit en utmaning där sida för sida har skrivits om till React medan gamla sidor fortfarande rullar med den gamla tekniken.

Då bygghemma är en väldigt stor e-handel har det även varit stort fokus på prestanda. För detta har ”code-splitting” implementerats, vilket innebär att javascript-applikationen är uppdelad i många mindre filer istället för en enda stor javascript-fil. Detta innebär att sidan endast laddar in precis så mycket som behövs. Går man exempelvis till startsidan så laddas bara startsidan in. Andra delar av sajten hämtas sedan allt eftersom användaren navigerar till olika sidor. För att snabba upp applikationen ännu mer så har pre-fetching implementerats, där viktiga sidor hämtas i förtid och lagras i webbläsarens cache, vilket gör att de kan hämtas snabbare när de väl behövs.

Då vi var färdiga med den initiala omskrivningen till React.js, påbörjades ett nytt projekt med fokus på att utveckla en ny modern design som skulle göra siten mer lättnavigerad, modern och mobilanpassad.