Hoe deze site werkt
Dit is een gewone restaurantwebsite. Eronder zit Astro, zoals Vweb websites voor klanten bouwt. Alles wat op deze pagina staat, wordt op deze pagina gemeten, nu.
Pagina's zijn HTML, geen apps
Astro maakt van elke pagina gewone HTML zodra de site wordt gebouwd. De browser krijgt tekst, foto's en CSS. JavaScript komt alleen waar iets op de pagina op jou moet reageren.
…KB JavaScript
Elke pagina bestaat al voordat iemand erom vraagt
Elke taal, elk gerecht en deze pagina worden één keer als bestand gebouwd. Geen database om op te wachten en niets dat om 2 uur 's nachts kan crashen.
46HTML
Eilanden: interactief alleen waar het nodig is
De bestelbon is het enige interactieve onderdeel van de site. Het is een klein Preact-eiland dat vanzelf wakker wordt; de rest van de pagina wacht er nooit op.
<OrderTicket client:load transition:persist />Van pagina wisselen voelt als een app
Open een gerecht vanuit het menu: de foto en de naam schuiven mee naar de nieuwe pagina. Je bestelling blijft staan terwijl de pagina eronder verandert.
Foto's worden vanzelf verkleind en omgezet
De eigenaar uploadt één foto. Astro maakt er moderne AVIF- en WebP-versies van in meerdere breedtes, en elke telefoon downloadt alleen het formaat dat hij nodig heeft.
Jouw browser downloadde … (…) · origineel: 1200px, 69 KB · beschikbare breedtes: 320, 640, 960, 1200px De eigenaar past inhoud aan, geen code
Menu, prijzen, openingstijden en teksten staan in inhoudsbestanden met een schema. Elk veld dat de eigenaar mag wijzigen heeft een Nederlands label voor de Vweb CMS. Een verkeerde prijs kan niet live: de build stopt.
price: z.object({ xcg: z.number().positive().meta({ title: 'Prijs in XCG' }), usd: z.number().positive().meta({ title: 'Prijs in USD' }), }).meta({ title: 'Prijs' }),Vier talen, vier echte pagina's
Elke taal heeft een eigen adres, zodat Google de juiste kan tonen. Wissel je van taal, dan blijf je bij hetzelfde gerecht.
Lettertypes komen van deze server
Astro haalt de lettertypes op tijdens het bouwen en serveert ze vanaf deze site. Er gaan geen bezoekersgegevens naar een fontdienst.
0verzoeken naar fontdiensten
De volgende pagina laadt al
Zodra je over een link beweegt of hem aanraakt, begint Astro die pagina te laden. Als je klikt, staat hij er vaak al.
prefetch: { prefetchAll: true }