Jamstack är ett arkitekturmönster för att bygga webbapplikationer. Namnet fångar tre ingredienser. JavaScript körs i webbläsaren för att hantera interaktivitet. API:er levererar dynamisk data vid request-tid eller bygge-tid. Markup är förrenderad istället för sammansatt av en server vid varje request. Tillsammans låter de tre en sajt leverera snabb HTML från ett CDN samtidigt som den fortsätter göra riktigt arbete genom API-anrop när det behövs.
## Varifrån Jamstack kommer
Termen myntades av Netlify runt 2016 för att beskriva en våg av statisk-sajt-generatorer som användes för riktiga produktionssajter. Den ursprungliga pitchen var att en sajt kunde byggas en gång, driftsättas som statiska filer till ett CDN och serveras utan en origin-server på den kritiska vägen. Den modellen var snabb, billig och lätt att resonera om. Den fungerade bra för marknadsföringssajter, bloggar och dokumentation.
Över tid utökades mönstret. Ramverk som Next.js, Nuxt och Astro lade till incremental static regeneration, server-side rendering och edge-funktioner. Definitionen av Jamstack löstes upp för att täcka vilken arkitektur som helst där frontenden är frikopplad från de datakällor den konsumerar och där förrendering spelar en meningsfull roll i prestandan.
## Jamstack i e-handel
E-handel komplicerar den ursprungliga statiska modellen. Produktkataloger ändras. Priser uppdateras. Lager rör sig. Personalisering behöver realtidsdata. Ren statisk generering kan inte hantera något av det ensam. Men Jamstack-mönstret gäller fortfarande när frontenden är en separat applikation som renderar förbyggda skal och anropar e-handels-API:er för de delar som behöver vara aktuella.
I praktiken använder en Jamstack-e-handelsfrontend typiskt server-side rendering för sidor som behöver färsk data (produktdetalj, kundvagn, checkout) och statisk eller inkrementell rendering för sidor som ändras sällan (marknadssidor, kategoriskal, blogginnehåll). Frontenden hämtar produkter från ett
headless commerce-API, innehåll från ett
headless CMS och personaliseringsdata från varhelst det ligger.
## Vad Jamstack ändrar på frontend-leveransen
Den största vinsten är prestanda. Förrenderad markup som serveras från ett CDN laddar snabbare än markup som byggs av en backend vid varje request. Den andra vinsten är frikoppling. Frontenden är sin egen applikation med sin egen driftsättningscykel. E-handelsbackenden kan bytas eller uppgraderas utan att skriva om storefronten.
Avvägningarna är komplexitet och färskhet. En Jamstack-frontend har fler rörliga delar än ett monolitiskt tema, och det kräver riktig engineering att hålla förrenderat innehåll i synk med backend-ändringar. Ramverken hanterar det mesta av det idag, men modellen är inte gratis.
## Hur Frntkey passar in
Frntkey är en Jamstack-stil e-handelsfrontend byggd på Nuxt.js. Sidor som ändras ofta (produktlistningar, kundvagn, checkout, konto) server-renderas på Vercel. Sidor som ändras sällan cachas och revalideras. E-handelsdata flödar genom
Norce- eller
Shopware-API:er. Innehåll flödar genom
Storyblok. Mönstret låter storefronten nå gröna
Core Web Vitals utan att offra realtids-e-handelsdata.
## Relaterade termer
Headless arkitektur ·
Headless commerce ·
Headless CMS ·
Ecommerce frontend