Statiska vietnes ģenerēšana (SSG)
Statiska vietnes ģenerēšana ir metode tīmekļa vietņu būvniecībai, kurā visas lapas tiek iepriekš renderētas būvēšanas laikā statiskos HTML failos, nodrošinot ārkārtīgi ātru ielādes laiku un vienkāršu hostingu.
Statiska vietnes ģenerēšana (SSG) izveido visu tīmekļa vietnes lapas būvēšanas solī, pirms kāds lietotājs apmeklē vietni. Rezultāts ir kolekcija no vienkāršiem HTML, CSS un JavaScript failiem, ko var servēt tieši caur CDN bez servera puses apstrādes katram pieprasījumam. Atšķirībā no dinamiskām vietnēm, kas ģenerē lapas katrā pieprasījumā (SSR) vai pārlūkprogrammā (CSR), statiskas vietnes ir iepriekš uzbūvētas.
Šis novērš servera apstrādes laiku un datubāzu vaicājumus, rezultējoties iespējami ātrākajiem ielādes laikiem. Populāri statisko vietņu ģeneratori ietver Next.js (kas atbalsta gan SSG, gan SSR), Gatsby, Hugo, Eleventy un Astro. Šie rīki ņem jūsu saturu (no markdown failiem, CMS vai API) un veidnes, tad ģenerē pilnu tīmekļa vietni būvēšanas procesā.
Praksē
- Dokumentācijas vietne ar 5 000 lapām, kas izveidota, izmantojot SSG, ielādē katru lapu mazāk nekā 200 ms, jo nav servera apstrādes, tiek tikai servēti iepriekš izveidoti HTML faili caur CDN
- Mārketinga aģentūra pārgāja no WordPress uz statisku vietnes ģeneratoru, samazinot hostinga izmaksas par 90%, tajā pašā laikā uzlabojot lapas ātruma rādītājus līdz gandrīz perfektam
- Blogam ar vairāk nekā 1 000 rakstiem tiek izmantots SSG ar inkrementālām pārbūvēm, ļaujot pievienot jaunu saturu sekundēs, nepārbūvējot visu vietni
- Aizmugures lapa, kas izveidota, izmantojot SSG, no pirmā acu uzmetiena sasniedza 99/100 Lighthouse veiktspijas rezultātu, salīdzinot ar 62/100 iepriekšējai dinamiski ģenerētajai versijai
Vairāk par: Tīmekļa izstrāde
- Responsīvais dizains
- Progressīvā tīmekļa lietotne (PWA)
- Vienas lapas lietotne (SPA)
- Servera puses renderēšana (SSR)
- Statiska vietnes ģenerēšana (SSG)
- API (Application Programming Interface)
- CMS (Satura pārvaldības sistēma)
- Headless CMS
- Versiju kontrole
- CI/CD (Nepārtraukta integrācija / Nepārtraukta izvietošana)
- JavaScript framework
- TypeScript
Nezināt, kā tas attiecas uz jums?
Senior inženieris apstaigā jūsu objektu, jūsu meklēšanas klātbūtni un veidu, kādā nonāk pieprasījumi, un tad rakstiski norāda trīs lietas, ko vispirms vērts labot. Dokuments paliek jums neatkarīgi no rezultāta.