In een vorige blogpost schreef ik over metaframeworks die veel worden ingezet voor React, Angular en Vue. Ik noemde toen Next.js (als framework voor React), Analog.js (voor Angular) en Nuxt (voor Vue).
Maar er zijn er meer! Hieronder heb ik voor de bekendste frameworks een aantal metaframeworks op een rijtje gezet. Ik herhaal de eerder genoemde frameworks nogmaals, zodat je overzicht compleet is.
Voor React
- Next.js – Next.js is waarschijnlijk het meest veelzijdige React-framework en richt zich op fullstack-ontwikkeling. Hiervoor worden onder meer React Server Components (RSC’s) gebruikt, die de kracht van React naar de server brengen.
https://nextjs.org/
- Remix – Richt zich op het verbeteren van prestaties door het efficiënter ophalen van data en eenvoudige routing toevoegen in je applicaties. Remix legt de nadruk op geoptimaliseerde server-side rendering, progressieve verbetering en minimale JavaScript voor interactiviteit. Applicaties die met Remix zijn gemaakt, zijn meestal erg snel en compact.
https://remix.run/
- Gatsby – Gatsby is gebouwd voor high-performance statische sites. Als een van de eersten maakte Gatsby gebruik van GraphQL voor dataverwerking. Gatsby heeft een enorm plugin-ecosysteem. Hierdoor is het ideaal voor content-gedreven sites waarvan gegevens vaak uit meerdere databronnen afkomstig zijn.
https://www.gatsbyjs.com/
Voor Vue
- Nuxt – Dit is het grootste, bekendste en meestgebruikte metaframework voor Vue. Nuxt is een typisch applicatie framework en biedt een enorm scala aan uitbreidingen, ondersteuning, YouTube-kanalen en -video’s en actieve ontwikkeling vanuit de volledige Vue-community.
https://nuxt.com/
- VitePress - Een statische site-generator die is geoptimaliseerd voor documentatie en eenvoudigere projecten. Gebouwd op Vite, snel en eenvoudig te configureren.
https://vitepress.dev/
- Gridsome: Vergelijkbaar met Gatsby maar dan voor Vue. Gridsome richt zich op het bouwen van statische sites met een plugin-ecosysteem dat integratie met CMS’en en API’s gemakkelijk maakt. Gridsome presenteert zichzelf als een Jamstack-framework (JavaScript, API’s en Markup). Als je zelf al een Jamstack-applicatie beheert, ligt het gebruik van Gridsome voor de hand.
https://gridsome.org/
Voor Angular
- Scully – Scully is voornamelijk een statische site-generator die Angular-apps omzet naar statische HTML. Dit optimaliseert de prestaties en SEO zonder een volledige server-rendering setup nodig te hebben. Ook Scully presenteert zich – net als Gridsome voor Vue – als een Jamstack-framework.
https://scully.io/
- Angular Universal – Angular Universal is niet echt een standalone metaframework. Het is in feite ingebouwd in Angular (al sinds ca. 2018) en is meer een set tools die SSR mogelijk maakt voor Angular. Vaak wordt Angular Universal gecombineerd met tools zoals NestJS om API’s naast server rendering af te handelen.
https://angular.dev/guide/ssr
Voor Svelte
- SvelteKit – SvelteKit is het officiële metaframework voor Svelte. Het biedt ondersteuning voor SSR, SSG en CSR, op een minimale en sterk geoptimaliseerde manier. SvelteKit is ideaal voor het bouwen van applicaties met hoge performance en minimale overhead.
https://svelte.dev/docs/kit/introduction
Overige
- Astro – Astro staat bekend om zijn "Islands Architecture," hiermee kun je componenten uit verschillende frameworks zoals React, Vue en Svelte samen gebruiken. Het richt zich op het verzenden van minder JavaScript voor snellere laadtijden. Dit maakt Astro tot een goede keuze voor content-rijke of statische sites.
https://astro.build/
- Eleventy (11ty) – Eleventy is technisch gezien eigenlijk meer een statische site-generator. Het voordeel is dat Eleventy flexibel en framework-agnostisch is. Het biedt, ondersteuning voor verschillende templating-talen en optimalisatie voor performance-geoptimaliseerde statische sites. Eleventy is het allersnelst in de benchmarks als het gaat om het bouwen (build) van een website die bestaat uit 1000+ pagina’s.
https://www.11ty.dev/
Voor je gemak heb ik snel een pagina opgezet met korte beschrijvingen en hyperlinks naar deze metaframeworks: https://www.kassenaar.com/metaframeworks/
<shameless-plug>
Als er behoefte is aan een training in jouw bedrijf over React, Angular, Vue of een van de metaframeworks, aarzel dan niet om contact op te nemen! Training op jouw of onze locatie, op een tijdstip dat uitkomt. Ook 1:1-trainingen.
</shameless-plug>
-- Peter Kassenaar
10 november 2024