Bootstraps is slecht voor page speed
Bij het zien van de titel zal men waarschijnlijk gedacht hebben. Wat? Bootstraps is slecht voor page speed? En dat is precies wat het is en hier zal ik eens uitleggen waarom ik geen bootstrap gebruik. Dit is om in de Google page speed test de volgende meldingen te voorkomen.
- Beperk niet-gebruikt JavaScript
- Beperk niet-gebruikte CSS
- Vermijd enorme netwerkpayloads
- Houd het aantal verzoeken laag en de overdrachtsgrootte klein
Dit is hiermee slecht voor de elementen FCP (First Contentful Paint) en LCP (Largest Contentful Paint) en uiteraard SI (Speed Index) van Google core Web Vitals. En dus heeft het sinds 2021 ook een effect op SEO.
Bootstraps is slecht voor page speed en Web Vitals.
Wat is Bootstrap?
Bootstrap is het meest populaire HTML, CSS en JavaScript framework voor het ontwikkelen van een responsive en mobiel vriendelijke websites. Het is absoluut om gratis te downloaden en te gebruiken. Bootstrap is een front-end framework dat wordt gebruikt voor eenvoudige en snelle website ontwikkeling. Het bevat HTML- en CSS-gebaseerde ontwerpsjablonen voor typografie, formulieren, knoppen, tabellen, navigatie, modals, carrouselsliders en vele anderen. Met andere woorden, het vergemakkelijkt om responsieve websites te bouwen.
Het is zo populair dat klanten eisen dat bootstrap wordt gebruikt op hun website terwijl ze geen idee hebben dat dit alleen is om het de ontwikkelaar makkelijker te maken. En ze hebben niet door dat dit eigenlijk niet goed is voor hun page speed terwijl dat ook één van de eisen is.
Bootstraps is slecht voor page speed
Veel mensen denken dat als het hun het werk makkelijker wordt gemaakt en men niet meer zo veel kennis nodig heeft om een responsive website te bouwen. Dan zou het toch goed moeten zijn?
Het punt is heel duidelijk als je goed begrijpt wat page speed eigenlijk is. Page speed heeft vooral te maken met hoeveel er gedownload moet worden om een pagina te kunnen tonen. De meer je moet laden, de langzamer wordt de website. Zoals ik altijd zeg, laad niet wat je niet nodig hebt. En dat is het punt.
Om bootstrap te gebruiken heb je minimaal een javascript bestand, bootstrap.min.js(48KB), en een css bestand, bootstrap.min.css(142KB), nodig. Dit zijn bij elkaar 190KB dat iemand moet downloaden om een pagina te tonen met bootstrap. Dat is meer dan twee keer de volledige overdrachtsgrootte van de home page van deze website.
Als men wat dieper kijkt zal men zien dat van beide bestanden maar een heel erg klein deel wordt gebruikt. Of je het nou bekijkt over een gehele website of alleen één pagina, het zo weinig dat daadwerkelijk wordt gebruikt. Als men alle niet gebruikte CSS en JavaScript verwijderd blijft er misschien maar 25KB over.
Dit is nog niet eens alles want als je echt dieper gaat kijken dan zal je opmerken dat de HTML ook veel te veel DOM elementen moet bevatten om het werkend te maken. Dit is weer een andere probleem voor Web Vitals.
Vraag vrijblijvende een offerte aan.
Bootstrap gebruiken of niet
Het mag nu duidelijk zijn dat bootstrap slecht is voor page speed. Of je het wilt gebruiken of niet moet een ieder voor zichzelf beslissen. Als page speed erg belangrijk is dan zal men er waarschijnlijk over na moeten denken dit niet te gebruiken.
Steeds meer websites gebruiken page builders om het de ontwikkelaars nog gemakkelijker te maken om websites te bouwen. Deze zijn allemaal gebouwd op basis van bootstrap. Deze zouden er goed aan doen een verkleinde versie te gebruiken. Door alleen de CSS voor de grid uit de CSS te halen en dit samen te voegen met het hoofd CSS bestand, dan kan hier makkelijk 160KB bespaard worden.
Er zijn nog geen reacties. Wees de eerste..!!