JavaScript: Statische Websites mit React und Gatsby entwickeln

[ad_1]

Aus Kyle Mathews Wunsch, ein Tool zum Erstellen statischer Websites mit React zu haben, ist dank einigen Bemühungen nun der Site-Generator Gatsby geworden. Das erste Major Release soll unter anderem kürze Ladezeiten bewirken.

Nach gut zwei Jahren Arbeit präsentierte Entwickler Kyle Mathews nun Version 1.0 seines Tools zum Generieren statischer Websites für die JavaScript-Bibliothek React. Bei Gatsby waren ihm vor allem das Verhalten bei unzuverlässiger Internetverbindung und Möglichkeiten zur Datenabfrage wichtig. So nutzt das Tool Konzepte wie das des Service Workers oder die bei Google entwickelte PRPL-Architektur (Push, Render, Pre-Cache, Lazy-load) für ein gutes Offline-Verhalten. Außerdem lädt Gatsby zunächst nur den Code der aktuell besuchten Seite und lädt dann den für andere Routen nach.

Was den Umgang mit Daten angeht, hat man vom anfänglich verfolgten Push-Ansatz Abstand genommen und eine Schicht zur Datenverarbeitung eingezogen, die Daten aus lokale Dateien oder externen Quellen in ein GraphQL-Schema wandelt, sodass sich Abfragen wie an eine Datenbank stellen lassen. Durch GraphQL-Anfragen an jede Gatsby-Seite kann das Tool herausbekommen, welche Daten sie benötigt. Die Datenschicht erledigt entsprechende Abfragen während Entwicklung und Buildprozess und schreibt die Ergebnisse in eine JSON-Datei, die dann hilft, die richtigen Daten im Voraus zu laden. Das entsprechende Colocating-Pattern ist Facebooks Datenframework Relay entlehnt.

Gatsby ist als Plug-in-System aufgebaut, um die Entwicklung von Websites durch die Möglichkeit auf andere Tools zurückzugreifen zu beschleunigen. So lassen sich etwa Webpack-Loader, zu React kompatible Frameworks, Sitemaps oder Google Analytics durch Plug-ins integrieren. Weitere Details lassen sich der Ankündigung entnehmen. Gatsby ist Open Source und mit einer MIT-Lizenz versehen auf GitHub zu finden. (jul)

[ad_2]

Read more on: Source