SSG (Static Site Generator, czyli generator stron statycznych) to narzędzie, które bierze Twoje szablony, dane i treści (najczęściej pliki Markdown), a następnie podczas budowania (build) wypluwa komplet gotowych plików .html, CSS i JS. Te pliki są tworzone zanim ktokolwiek wejdzie na stronę — nie ma renderowania w locie przy każdym żądaniu. Efekt: serwer ma do roboty tylko jedno, czyli oddać gotowy plik. Stąd te strony są szybkie, tanie w hostingu i trudne do zepsucia.
Jak to działa
Klasyczna strona dynamiczna (np. WordPress) przy każdym wejściu odpytuje bazę danych, składa HTML i dopiero wtedy go zwraca. SSG odwraca kolejność: cała ta robota dzieje się raz, na Twoim komputerze albo na serwerze CI/CD, w momencie publikacji. Wynik to zwykły folder z plikami, który możesz wrzucić na dowolny hosting statyczny.
Dlatego SSG świetnie pasuje do treści, które nie zmieniają się co sekundę: blogi, dokumentacja techniczna, landing page, portfolio. Brak bazy danych i backendu w czasie działania oznacza mniejszą powierzchnię ataku i niższe rachunki. Hostować możesz na czymś takim jak Netlify, Vercel, Cloudflare Pages czy GitHub Pages — często za darmo.
Przykład z praktyki
Powiedzmy, że piszesz bloga w Astro. Posty trzymasz jako pliki .md, a budujesz całość komendą:
npm run build
Astro generuje katalog dist/ z gotowymi plikami HTML — po jednym na każdy post. Ten folder wrzucasz na hosting i tyle. Podobnie działają inne popularne SSG: Hugo (napisany w Go, słynie z absurdalnie szybkiego builda — hugo), Jekyll (Ruby, napędza GitHub Pages), Eleventy (11ty, JavaScript) czy Next.js i Gatsby w świecie Reacta.
Na co uważać
Najczęstszy mit: „statyczna znaczy nudna i bez funkcji”. Nieprawda — komentarze, wyszukiwarkę czy formularze dorzucisz przez zewnętrzne API albo serverless functions. Statyczny jest HTML, nie cała aplikacja.
Drugi haczyk: przy dużej liczbie podstron build potrafi się wlec. Jeśli generujesz dziesiątki tysięcy stron, każda zmiana = długie czekanie. Tu wchodzą techniki w stylu incremental builds albo ISR (Incremental Static Regeneration) w Next.js. I pamiętaj: treść jest „zamrożona” w momencie builda — żeby zaktualizować stronę, musisz przebudować i wgrać ją ponownie (albo ustawić to automatycznie w CI/CD).
Pojęcia powiązane
Warto kojarzyć: SSR (Server-Side Rendering), CSR (Client-Side Rendering), Jamstack, headless CMS, CI/CD, Markdown oraz CDN, które roznosi Twoje statyczne pliki po świecie.