SSR

Server-Side Rendering · Konseptit

Lyhyesti

Tekniikka jossa sivu renderöidään palvelimella valmiiksi HTML:ksi ennen selaimelle lähettämistä.

SSR eli Server-Side Rendering tarkoittaa että sivu renderöidään palvelimella valmiiksi HTML:ksi ennen selaimelle lähettämistä. Tämä parantaa hakukonenäkyvyyttä (SEO) koska Google näkee valmiin sisällön, ja ensimmäinen sivunlataus on nopeampi koska selain saa valmiin HTML:n. Next.js App Routerissa kaikki komponentit ovat oletuksena Server Components eli ne renderöidään palvelimella. Vibekoodaajana sinun ei tarvitse ymmärtää SSR:n teknisiä yksityiskohtia syvällisesti — Next.js hoitaa sen automaattisesti. Riittää että tiedät: "use client" tekee komponentista selainpuolisen kun tarvitset interaktiivisuutta.

Esimerkkejä

Next.js App Router renderöi komponentit palvelimella oletuksena

SSR parantaa SEO:ta — Google näkee valmiin HTML-sisällön

"use client" merkitsee komponentin selainpuoliseksi interaktiivisuutta varten

getServerSideProps hakee datan palvelimella ennen renderöintiä (Pages Router)