WordPress site snelheid optimaliseren: complete gids

Een snelle website is essentieel voor gebruikerservaring en SEO. Google gebruikt snelheid als rankingfactor en bezoekers verlaten trage sites. Deze gids behandelt alle aspecten van WordPress-snelheidsoptimalisatie.

Waarom Snelheid Belangrijk Is

Conversie: Elke seconde vertraging kost 7% conversie SEO: Core Web Vitals beïnvloeden rankings Gebruikerservaring: 53% verlaat mobiele sites die langer dan 3 seconden laden Hostingkosten: Efficiënte sites verbruiken minder resources

Snelheid Meten

Meet eerst je huidige prestaties:

Tools

• Google PageSpeed Insights: Officiële Google-metrics
• GTmetrix: Gedetailleerde waterfallanalyse
• WebPageTest: Testen vanaf verschillende locaties
• Chrome DevTools: Network- en Performance-tabbladen

Belangrijke Metrics

Hosting Optimaliseren

De basis van snelheid begint bij je hosting:

Serverlocatie

Kies een datacenter dicht bij je doelgroep. Nederlandse hosting voor Nederlandse bezoekers vermindert latency met 50-100ms.

PHP-versie

Gebruik altijd de nieuwste PHP-versie:

• PHP 8.2 is 3x sneller dan PHP 7.0
• Controleer compatibiliteit van plugins eerst

Server Resources

Minimale vereisten voor goede performance:

• 512MB+ memory limit
• SSD-opslag
• Voldoende PHP-workers

Caching Implementeren

Caching is de grootste snelheidswinst:

Page Caching

Sla gegenereerde HTML op:

// Eenvoudige page cache
function simple_cache_start() {
    $cache_file = WP_CONTENT_DIR . '/cache/' . md5($_SERVER['REQUEST_URI']) . '.html';

    if (file_exists($cache_file) && (time() - filemtime($cache_file)) < 3600) {
        readfile($cache_file);
        exit;
    }

    ob_start();
}

function simple_cache_end() {
    $cache_file = WP_CONTENT_DIR . '/cache/' . md5($_SERVER['REQUEST_URI']) . '.html';
    file_put_contents($cache_file, ob_get_contents());
    ob_end_flush();
}

Gebruik liever een bewezen plugin: WP Rocket, W3 Total Cache, of LiteSpeed Cache.

Object Caching

Redis of Memcached voor database-queries:

// Met Redis
$redis = new Redis();
$redis->connect('127.0.0.1', 6379);

$cache_key = 'recent_posts';
$posts = $redis->get($cache_key);

if (!$posts) {
    $posts = get_posts(['numberposts' => 10]);
    $redis->setex($cache_key, 3600, serialize($posts));
}

Browser Caching

Via .htaccess:

<IfModule mod_expires.c>
    ExpiresActive On
    ExpiresByType image/jpeg "access plus 1 year"
    ExpiresByType image/png "access plus 1 year"
    ExpiresByType image/webp "access plus 1 year"
    ExpiresByType text/css "access plus 1 month"
    ExpiresByType application/javascript "access plus 1 month"
    ExpiresByType font/woff2 "access plus 1 year"
</IfModule>

Afbeeldingen Optimaliseren

Afbeeldingen zijn vaak 50%+ van paginagrootte:

Formaat Kiezen

• WebP: 25-35% kleiner dan JPEG/PNG
• AVIF: Nog kleiner, beperkte browserondersteuning
• SVG: Voor iconen en logo's

Compressie

// Automatische WebP-conversie
add_filter('wp_handle_upload', function($upload) {
    if (strpos($upload['type'], 'image') !== false) {
        $image = imagecreatefromstring(file_get_contents($upload['file']));
        $webp_path = preg_replace('/\.(jpg|jpeg|png)$/i', '.webp', $upload['file']);
        imagewebp($image, $webp_path, 80);
    }
    return $upload;
});

Lazy Loading

// Native lazy loading (WordPress 5.5+)
add_filter('wp_lazy_loading_enabled', '__return_true');

// Of handmatig
<img src="placeholder.jpg"
     data-src="echte-afbeelding.jpg"
     loading="lazy"
     alt="Beschrijving">

Responsive Images

WordPress genereert automatisch srcset:

<img srcset="image-300.jpg 300w,
             image-600.jpg 600w,
             image-1200.jpg 1200w"
     sizes="(max-width: 600px) 300px,
            (max-width: 1200px) 600px,
            1200px"
     src="image-1200.jpg"
     alt="Responsive afbeelding">

CSS en JavaScript Optimaliseren

Minificatie

Verwijder witruimte en comments:

// Minify output
[add_action](/kennisbank/wordpress-hooks-uitleg)('template_redirect', function() {
    ob_start(function($buffer) {
        // Verwijder HTML comments
        $buffer = preg_replace('/<!--(.|\s)*?-->/', '', $buffer);
        // Verwijder extra whitespace
        $buffer = preg_replace('/\s+/', ' ', $buffer);
        return $buffer;
    });
});

Combineren

Reduceer HTTP-requests door bestanden te combineren. Let op: met HTTP/2 is dit minder belangrijk.

Kritieke CSS Inline

Plaats above-the-fold CSS inline:

add_action('wp_head', function() {
    $critical_css = file_get_contents(get_template_directory() . '/critical.css');
    echo '<style>' . $critical_css . '</style>';
}, 1);

Defer JavaScript

add_filter('script_loader_tag', function($tag, $handle) {
    if (is_admin()) return $tag;
    return str_replace(' src', ' defer src', $tag);
}, 10, 2);

Database Optimaliseren

Opruimen

-- Verwijder revisies
DELETE FROM wp_posts WHERE post_type = 'revision';

-- Verwijder spam comments
DELETE FROM wp_comments WHERE comment_approved = 'spam';

-- Verwijder transients
DELETE FROM wp_options WHERE option_name LIKE '%_transient_%';

-- Optimaliseer tabellen
OPTIMIZE TABLE wp_posts, wp_postmeta, wp_options;

Query Optimalisatie

// Slecht: haalt alle data op
$posts = get_posts(['numberposts' => -1]);

// Beter: beperk velden
$posts = get_posts([
    'numberposts' => 10,
    'fields' => 'ids'
]);

Indexen Toevoegen

-- Index voor postmeta lookups
ALTER TABLE wp_postmeta ADD INDEX meta_key_value (meta_key, meta_value(50));

CDN Implementeren

Een Content Delivery Network serveert statische bestanden vanaf servers wereldwijd:

Populaire CDN's

• Cloudflare: Gratis tier, DNS-gebaseerd
• BunnyCDN: Goedkoop, pay-as-you-go
• KeyCDN: Europese focus

Configuratie

// CDN URL voor assets
define('WP_CONTENT_URL', 'https://cdn.jouwsite.nl/wp-content');

// Of via filter
add_filter('wp_get_attachment_url', function($url) {
    return str_replace(
        'https://jouwsite.nl',
        'https://cdn.jouwsite.nl',
        $url
    );
});

Plugins Auditen

Te veel of slechte plugins vertragen je site:

Performance Impact Meten

// Meet plugin laadtijd
add_action('muplugins_loaded', function() {
    define('PLUGINS_START', microtime(true));
});

add_action('plugins_loaded', function() {
    $duration = (microtime(true) - PLUGINS_START) * 1000;
    error_log("Plugins loaded in {$duration}ms");
});

Plugin Alternatieven

Verwijder ongebruikte plugins volledig via de juiste methode.

Server Push en Preloading

// Preload kritieke resources
add_action('wp_head', function() {
    echo '<link rel="preload" href="' . get_stylesheet_uri() . '" as="style">';
    echo '<link rel="preload" href="/fonts/main.woff2" as="font" type="font/woff2" crossorigin>';
    echo '<link rel="preconnect" href="https://fonts.googleapis.com">';
}, 1);

Resultaten Monitoren

Stel monitoring in na optimalisatie:

// Log langzame pagina's
add_action('shutdown', function() {
    $time = timer_stop(0, 3);
    if ($time > 2) {
        error_log("Slow page ({$time}s): " . $_SERVER['REQUEST_URI']);
    }
});

Meer informatie: WordPress.org documentatie

Veelgestelde vragen

Hoe lang duurt het om dit te implementeren?

De implementatietijd varieert per situatie. Voor eenvoudige configuraties is dit binnen een uur geregeld, complexere setups kunnen enkele uren tot een dag duren.

Wat zijn de kosten?

De kosten zijn afhankelijk van je hosting provider en pakket. Veel basisfuncties zijn gratis inbegrepen, voor geavanceerde functies kunnen extra kosten gelden.

Heb ik technische kennis nodig?

Voor de basis heb je weinig technische kennis nodig. De meeste hosting providers bieden uitgebreide documentatie en support om je te helpen.