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 WordPress optimaliseren – deel 1. Deel 1 van deze serie 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)) op Saotn.org.

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:

<h1 class="site-title"><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:

<h1 class="site-title"><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

<meta charset="<?php bloginfo( 'charset' ); ?>">
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
<meta charset="UTF-8">
<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


MCSA Windows Server 2016

Bereid je met dit boek voor op je MCSA Windows Server 2016 examens 70-740, 70-741 en 70-743, nu via bol.com! Dit complete studieboek is het enige boek dat je nodig hebt voor jouw MCSA 2016 certificering. Met deze aankoop steun je ITFAQ.nl, waarvoor dank!

Je vindt misschien ook interessant: 70-744 Securing Windows Server 2016 | 70-740 Installation, Storage and Compute with Windows Server 2016 | 70-741 Networking with Windows Server 2016 with Practice Test | 70-743 Upgrading Your Skills to MCSA | Kaspersky Internet Security 2019 (3 gebruikers, 1 jaar) - via bol.com

Psst: steun ITFAQ.nl en doneer een kop koffie via paypal.me/jreilink.