Toen het “World Wide Web” in 1991 voor het eerst aan het publiek werd getoond, waren alle websites eigenlijk niet meer dan verzamelingen van statische HTML documenten – elk bestand bevatte de opmaak die nodig was om een complete pagina in een webbrowser weer te geven en niet meer dan dat. Vrijwel meteen gingen vooruitstrevende developers van het web aan de slag met manieren om websites dynamisch te genereren, samengesteld door code die op webservers draait en inhoud uit databasesystemen haalt.

Hoewel statische websites nooit helemaal verdwenen en de CMS (zoals WordPress) de overhand kregen, is een moderne benadering van het statische websiteconcept nu wederom populair onder degenen die snelheid en veiligheid belangrijk vinden.

En met goede reden, want bijvoorbeeld op Kinsta’s Statische Site Hosting platform zijn websites inderdaad enorm snel en veilig. En het beste: ze zijn ook helemaal gratis.

Laten we eens wat dieper ingaan op statische sites en hoe Kinsta je kan helpen de jouwe te deployen op onze wereldwijde edge servers.

Is een statische site geschikt voor jouw webproject?

Een statische site levert kant-en-klare HTML, CSS, JavaScript en mediabestanden.

“Het voordeel van statische content is dat het snel en efficiënt is,” zegt Michael Fuller, JavaScript developer bij Kinsta en lid van het team dat hielp bij de lancering van Kinsta’s Statische Site Hosting platform. “In plaats van dat een server de pagina moet bouwen door met de database te communiceren, stuurt het gebruikers simpelweg de door jou vooraf gemaakte bestanden.”

“In plaats van statische bestanden helemaal met de hand te maken, zijn er een aantal statische sitegenerators,” zegt hij. “Dit zijn pakketten die het maken en bijwerken van een statische site makkelijker maken door de bestanden die je aanlevert om te zetten in een werkende website.”

Wat voor soort projecten kunnen worden ingezet als statische sites?

“Als je geen pagina’s hebt waarop iemand moet inloggen, geen database of iets anders waarvoor dynamische content nodig is, dan is het waarschijnlijk een goede kandidaat voor een statische site,” zegt Fuller. “Dit kunnen dingen zijn zoals portfolio’s, marketingpagina’s of zelfs een blog als je het leuk vindt om nieuwe berichten te schrijven met behulp van een statische sitegenerator.”

En als een site geen server of database heeft om verbinding mee te maken, biedt dat minder mogelijkheden voor beveiligingslekken.

“Voor meer geavanceerde gevallen kun je een gemengde aanpak kiezen,” zegt Fuller. “Je kunt een statische site maken die een JavaScript framework gebruikt om met een apart beheerde server te praten. Op deze manier krijg je de snelheidsvoordelen in je eerste laadtijden, gecombineerd met de flexibiliteit van een dynamische site.”

Een overzicht van Statische Site Hosting bij Kinsta

Dit is wat je gratis krijgt op het Statische Site Hosting platform van Kinsta:

  • 100 statische sites per bedrijf
  • 1 gelijktijdige build per site
  • 1 GB aan image-grootte van je build per site
  • 600 bouwminuten per maand per bedrijf
  • 100 GB bandbreedte per maand per bedrijf

En net als bij Kinsta’s platforms Applicatie Hosting en Managed WordPress Hosting zijn er gratis SSL certificaten, ondersteuning voor aangepaste domeinnamen en een optionele API voor sitebeheer.

Kinsta bouwt en pusht de inhoud van statische sites naar de 260+ datacenters in het wereldwijde Cloudflare netwerk – hetzelfde platform dat de Kinsta CDN en edge caching voor WordPress sites ondersteunt.

Een statische site deployen bij Kinsta

De eerste stap in het deployen van een statische site bij Kinsta is het verbinden van de Git host van je voorkeur met je account in MyKinsta.

“We ondersteunen momenteel drie van de toonaangevende Git providers, BitBucket, GitHub en GitLab,” zegt Fuller. “Dit betekent dat je, bovenop de voordelen van het feit dat wij je site leveren, gebruik kunt maken van hun versietracking en tools.”

Statische Site Hosting verbinden git provider
Een Git provider kiezen in MyKinsta.

Na het autoriseren van MyKinsta’s toegang tot je Git provider, kun je beginnen met het toevoegen van je eerste statische site door de repository en branch te selecteren:

Een statische site toevoegen in MyKinsta.
Een statische site toevoegen in MyKinsta.

Hierboven hebben we Automatische deployment bij commit geselecteerd, wat betekent dat Kinsta de site opnieuw zal deployen als er wijzigingen naar de branch op de Git host worden gepusht.

Vervolgens zal MyKinsta proberen de build-instellingen te bepalen die nodig zijn voor je project:

MyKinsta Statische Site Hosting details toevoegen
Build-instellingen gedetecteerd voor een project dat Nuxt.js gebruikt om een statische site te genereren.

“Wanneer we in staat zijn om de generator en package manager die je gebruikt te detecteren, vullen we deze vooraf in met de standaard conventies die daarvoor worden gebruikt,” zegt Fuller. “Het commando voor Node.js-powered builds is bijvoorbeeld meestal yarn build of npm run build, en de publish directory is meestal iets als build, dist, public of out.”

“Je kunt ook je eigen omgevingsvariabelen opgeven als je bouwproces daar gebruik van maakt.”

“Voor de eerste release van Statische Site Hosting ondersteunen we alleen Node.js voor het bouwen van sites,” zegt Fuller, “maar we werken eraan om je in de toekomst meer platforms te kunnen bieden.”

Je kunt echter nog steeds veel statische sites deployen die niet afhankelijk zijn van Node.js tools voor het bouwen ervan. Als voorbeeld hebben we beschreven hoe je een Jekyll site en een Hugo site kunt deployen – geen van beide hebben builds die worden aangedreven door Node.js. In beide gevallen worden website-assets buiten het Kinsta platform gebouwd en vervolgens toegevoegd aan een map of branch in een Git repository om als statische site te worden gedeployd.

Je kunt ook statische assets deployen die helemaal geen build stap nodig hebben, bijvoorbeeld gewone HTML sites.

“Als je geen generator gebruikt, hoef je geen build commando op te geven en gaan we ervan uit dat je repository vooraf gemaakte bestanden bevat,” zegt Fuller.

Zodra een deployment is gestart, wordt deze toegevoegd aan de build wachtrij van de site.

“Wanneer de deployment start, maken we een build instance aan in Google Cloud Platform en halen we de code uit je repository,” zegt Fuller. “Als er een build commando is opgegeven, gebruiken we een image gebaseerd op het door jou opgegeven platform – Node.js voor nu – om dat commando uit te voeren. Hierna controleren we de bestandsgrootte van alles in de publish map om te bevestigen dat het binnen onze limieten blijft.”

“De laatste stap is de upload, waarbij we je bestanden naar een Cloudflare R2 bucket pushen.”

Details van de nieuwe deployment van de statische site in MyKinsta
Details van de nieuwe deployment van de statische site.

Snelheid maximaliseren met incrementele deployments

Het deploymentproces van Statische Site Hosting optimaliseert bouwtijden door alleen bestanden die daadwerkelijk zijn veranderd te uploaden naar de Cloudflare servers.

“We bewaren eerder geüploade bestanden over meerdere deployments, dus als je ervoor kiest om een vorige versie opnieuw te deployen, zijn er weinig tot geen bestanden die opnieuw moeten worden geüpload,” zegt Fuller. “Om dit te doen hernoemen we de bestanden naar de hashwaarde van hun inhoud en houden we de oorspronkelijke paden bij. Deze slaan we op in een mapbestand voor die deployment, met het pad als sleutel en de nieuwe naam als waarde.”

“Wanneer een verzoek naar de site wordt gestuurd, gebruiken we de map van de huidige deployment om naar de juiste versie van het bestand te routen.”

De infrastructuur achter Kinsta's Statische Site Hosting.
De infrastructuur achter Kinsta’s Statische Site Hosting.

Samenvatting

Kinsta’s Statische Site Hosting platform biedt bliksemsnelle levering van content op een netwerk van edge servers van wereldklasse, ondersteund door het MyKinsta dashboard de deployment in een handomdraai mogelijk maakt.

En het is allemaal gratis.

Ga snel aan de slag met Statische Site Hosting bij Kinsta door onze bibliotheek met Quickstart voorbeelden van een aantal statische sitegenerators te bekijken. De voorbeelden bevatten Git repositories die je kunt kopiëren om je eigen projecten te starten.

Steve Bonisteel Kinsta

Steve Bonisteel is a Technical Editor at Kinsta who began his writing career as a print journalist, chasing ambulances and fire trucks. He has been covering Internet-related technology since the late 1990s.