In dit tweede deel WordPress optimaliseren, laat ik je zien hoe je eenvoudig de URL (of link) van jouw thema stylesheet (CSS) verandert. Voor WordPress optimalisatie is het offloaden van content via andere URL’s belangrijk, het kan een flinke performance boost geven. Simpelweg omdat de webbrowser meer content en bestanden tegelijkertijd kan downloaden.

Wil je deel 1 in deze serie over WordPress optimalisatie nog eens teruglezen? Zie dan het artikel deel 1 in deze serie WordPress optimaliseren. Dat gaat in op de WordPress database (MySQL).

CSS-Stylesheet offloading in WordPress

De term offloading betekent niets anders dan dat je bestanden inlaadt vanaf een andere URL, bijvoorbeeld cdn.itfaq.nl in plaats van www.itfaq.nl. De reden hiervoor heb ik uitgelegd in het PHP optimaliseren artikel (onderwerp content “offloading” (“Content Delivery Network”, of CDN)).

Neem in het functions.php-bestand van jouw thema op:

// verander stylesheet_directory_uri dmv een functions.php filter
function itfaq_stylesheet_directory_uri() {
  return "//cdn.itfaq.nl/wp-content/themes/[thema_naam]";
}
add_filter('stylesheet_directory_uri', 'itfaq_stylesheet_directory_uri' );

Waarbij je cdn.itfaq.nl natuurlijk moet veranderen naar jouw hostnaam, één die je bij je hostingprovider hebt aangemaakt als subdomein. That’s it.

Tip: door het weglaten van “http:” voor “//” is de link (URL) protocol onafhankelijk. Dat wil zeggen dat het gebruikt kan worden voor zowel websites die bereikbaar zijn via HTTP, als voor websites die bereikbaar zijn via HTTPS. Is jouw website nu nog bereikbaar via HTTP, dan functioneert de code ook nog als je een SSL-certificaat installeert, zonder dat je de link hoeft aan te passen.

Een tweede belangrijke WordPress performance tip is om waarden van WordPress functies, die gegevens uit de MySQL-database halen, absoluut te maken (te vervangen door statische HTML).

Vervang WordPress bloginfo() met absolute waarden

In – veelal – het header.php-bestand van jouw WordPress thema vind je code vergelijkbaar met:

<a href="<?php echo esc_url( home_url( '/' ) ); ?>"
  title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></h1>
<h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>

Wat dit doet is de WordPress functie bloginfo() gebruiken om bijvoorbeeld jouw websitenaam of beschrijving uit de database te halen. Deze informatie is vaak statisch, want op een tweede pagina of post heet jouw website niet plotseling anders. Echter, die informatie moet wel wéér uit de database worden gehaald, en dat kost een beetje tijd.

Hierom is het soms verstandig om functies te verwijderen die statische informatie tonen, en statische HTML ervan te maken. Bovenstaande bloginfo() haalt in mijn geval de volgende informatie uit de database:

<a href="https://www.itfaq.nl/"
  title="ITFAQ.nl" rel="home">ITFAQ.nl</a></h1>
<h2 class="site-description">Op ITFAQ.nl worden veelgebruikte afkortingen, en
  veelgestelde vragen, over internet en computers uitgelegd. In eenvoudig Nederlands.</h2>

En door dit als statische HTML in header.php op te nemen kun je twee database queries besparen. Per view. Doe dit ook voor


<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">

<link rel="pingback" href="https://www.itfaq.nl/xmlrpc.php">

Als jouw thema dit ondersteunt, gebruik hiervoor bij voorkeur een child-theme. Dan hoef je de wijzigingen niet bij iedere thema-update opnieuw te maken.

Conclusie WordPress optimaliseren deel 2

Dit was het tweede deel in de serie WordPress optimalisatie. Een kort deel, want zo zijn er heel veel kleine zaken die je kunt aanpakken om jouw website sneller te maken. Niet alles moet met een plugin, en niet alles hoeft veel tijd en expertise te kosten. Wel moet je net even weten wat verbeterd kan worden en waar, en daarvoor is nou net deze WordPress optimaliseren serie.

WordPress website optimaliseren serie

Leave a Comment

Comments

No comments yet. Why don’t you start the discussion?

Geef een reactie

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *