De gedocumenteerde openbare architectuur van Gatsby
Gatsby is gebouwd rond React- en Node.js-tools. Ontwikkelaars schrijven React-componenten, terwijl Gatsby het ophalen van gegevens uit bronnen, GraphQL-query's, pagina-aanmaak, assetverwerking, bundeling en het geselecteerde renderinggedrag coördineert.
Dit beschrijft de frameworkarchitectuur die voor Gatsby-projecten is gedocumenteerd. Het leidt niet de private hostingsystemen, interne diensten of operationele topologie achter gatsbyjs.com af.
Belangrijkste bouwstenen
| Laag | Openbaar gedocumenteerde rol |
|---|---|
| React | Levert componenten, JSX, state en interactie aan de browserzijde. |
| Gatsby-API's | Verbinden configuratie, het ophalen van gegevens uit bronnen, het maken van nodes, pagina-aanmaak en werk binnen de rendering-lifecycle. |
| Gegevenslaag | Normaliseert records uit bronnen als nodes en stelt ze via een GraphQL-schema beschikbaar. |
| Bronplug-ins | Importeren content uit bestanden, contentsystemen, API's en diensten. |
| GraphQL | Selecteert velden uit bronnen voor pagina's en componenten in de gegevensworkflow van Gatsby. |
| Rendering | Ondersteunt SSG, DSG, SSR via getServerData en client-side routes. |
| Plug-in-ecosysteem | Voegt bronnen, transformaties, afbeeldingsverwerking, styling, analytics en andere integraties toe. |
Van content naar pagina
- Een bronplug-in haalt content op of leest deze.
- Gatsby maakt nodes en bouwt zijn gegevensschema.
- Een paginaquery vraagt de vereiste velden op.
- Een React-template rendert de opgevraagde content.
- Gatsby produceert of levert de pagina volgens de renderingmodus.
Statische pagina's worden tijdens de build gegenereerd. Uitgestelde pagina's worden op compatibele infrastructuur uitgesteld tot hun eerste verzoek. SSR-pagina's voeren via getServerData logica uit tijdens het verzoek. Client-side routes reserveren geselecteerde paden voor applicatiegedrag in de browser.
De architectuur garandeert geen bepaalde buildtijd, paginasnelheid of positie in zoekresultaten. Deze resultaten zijn afhankelijk van bronlatentie, aantallen nodes en pagina's, queryontwerp, afbeeldingen, JavaScript, caching, hosting en de implementatie zelf.
