WordPress laadt automatisch een emojiscript genaamd wp-emoji-release.min.js op elke pagina van uw site. Dit script werd geïntroduceerd in WordPress 4.2 om ervoor te zorgen dat emoji-tekens correct werden weergegeven in oudere browsers zoals Internet Explorer 10 en vroege versies van Android. Het werkt door te detecteren of de browser van de bezoeker emoji's nativ kan renderen. Zo niet, dan vervangt het script emoji-tekens door afbeeldingen van het WordPress CDN op s.w.org.
Het probleem is dat dit script op elke pagina wordt geladen, ongeacht of uw inhoud daadwerkelijk emoji's bevat. Voor de overgrote meerderheid van WordPress-sites is dit verspilde overhead.
Waarom WordPress dit script standaard nog steeds laadt
WordPress hecht meer waarde aan achterwaartse compatibiliteit dan aan bijna al het andere. Aangezien er nog een klein aantal gebruikers op zeer oude browsers is, houdt het kernteam deze functie standaard ingeschakeld. Het script bestaat uit twee delen: een inline JavaScript-blok dat een emoji-rendertest uitvoert, en het externe bestand wp-emoji-release.min.js dat geladen wordt als de test bepaalt dat de browser hulp nodig heeft. Daarbovenop voegt WordPress CSS-stijlen toe voor emoji-rendering en een DNS-prefetch-hint voor s.w.org om de CDN-verbinding te versnellen.
De werkelijke prestatie-impact
Hoewel het emojiscript zelf ongeveer 15-20 KB groot is, zijn de totale kosten hoger dan alleen de bestandsgrootte. Dit is wat er gebeurt bij elke pagina-aanroep wanneer het emojiscript actief is:
- Inline JavaScript-uitvoering: De emoji-detectietest draait in de
<head>-sectie, wat render-blocking is. De browser moet deze code uitvoeren voordat hij verder kan gaan met het parsen van de rest van de pagina. - Extra DNS-opzoeking: De DNS-prefetch voor
s.w.orgactiveert een DNS-resolutie die anders niet nodig zou zijn. Op mobiele verbindingen met hoge latentie kan dit 50-100ms kosten. - Extra HTTP-verzoek: Als de browser "faalt" voor de emoji-test (wat zeldzaam is op moderne apparaten), wordt het volledige scriptbestand gedownload van het CDN.
- CSS-overhead: Extra emoji-gerelateerde stijlen worden geïnjecteerd in zowel de frontend als het beheergedeelte.
Voor sites die zich richten op prestaties en goede Core Web Vitals-scores is het verwijderen van dit script een van de eenvoudigste winstpunten. Het vermindert uw totale blokkeringstijd en elimineert onnodige netwerkverzoeken.
Wie heeft het emojiscript daadwerkelijk nodig
U moet het emojiscript behouden als uw site zich specifiek richt op gebruikers met zeer oude browsers (IE 10 of eerder, Android 4.3 of lager) en uw inhoud sterk afhankelijk is van emoji-weergave. In de praktijk geldt dit voor bijna niemand. Elke moderne browser uitgebracht sinds 2015 verwerkt emoji's nativ via de lettertyperendering van het besturingssysteem. Zelfs zonder het WordPress-script worden emoji's correct weergegeven voor meer dan 99% van uw bezoekers.
Verwijder het emojiscript via functions.php
De schoonste manier om het emojiscript uit te schakelen is door de volgende code toe te voegen aan het functions.php-bestand van uw thema, of beter nog, aan een site-specifieke plugin. Elke regel richt zich op een specifiek deel van het emojisysteem:
/**
* Disable WordPress emoji scripts and styles
*/
function disable_emojis() {
// Remove the inline emoji detection script from the frontend head
remove_action('wp_head', 'print_emoji_detection_script', 7);
// Remove the emoji detection script from the admin area
remove_action('admin_print_scripts', 'print_emoji_detection_script');
// Remove emoji CSS styles from the frontend
remove_action('wp_print_styles', 'print_emoji_styles');
// Remove emoji CSS styles from the admin area
remove_action('admin_print_styles', 'print_emoji_styles');
// Stop converting emoji in RSS feed content
remove_filter('the_content_feed', 'wp_staticize_emoji');
// Stop converting emoji in RSS comment text
remove_filter('comment_text_rss', 'wp_staticize_emoji');
// Stop converting emoji in outgoing emails
remove_filter('wp_mail', 'wp_staticize_emoji_for_email');
// Remove the DNS prefetch for the emoji CDN
add_filter('wp_resource_hints', function($urls, $relation_type) {
if ('dns-prefetch' === $relation_type) {
$urls = array_filter($urls, function($url) {
return strpos($url, 'https://s.w.org/images/core/emoji/') === false;
});
}
return $urls;
}, 10, 2);
// Prevent the emoji script from loading via the block editor
add_filter('emoji_svg_url', '__return_false');
}
add_action('init', 'disable_emojis');Alternatief: gebruik een plugin
Als u liever geen code rechtstreeks bewerkt, zijn er verschillende lichte plugins die dit voor u afhandelen. De populairste opties zijn:
- Disable Emojis (SUSPENDED): Was jarenlang de favoriete oplossing. Zeer kleine voetafdruk, doet precies wat de bovenstaande code doet. Let op: deze plugin is uit de WordPress-pluginrepository verwijderd, maar er bestaan alternatieven.
- Autoptimize: Een algemene optimalisatieplugin met een optie om emojiscripts te verwijderen onder het tabblad "Extra"-instellingen. Als u Autoptimize al gebruikt voor CSS/JS-optimalisatie, is dit een handige alles-in-één aanpak.
- Prestatieplugins: Veel caching- en prestatieplugins zoals WP Rocket, LiteSpeed Cache en Perfmatters bevatten een schakelaar om het emojiscript uit te schakelen. Controleer de instellingen van uw bestaande plugins voordat u iets nieuws installeert.
Wat gebeurt er met de emoji-weergave na verwijdering
Niets ergs. Moderne browsers gebruiken het ingebouwde emojilettertype van het besturingssysteem om emoji-tekens te renderen. Op Windows is dat het lettertype Segoe UI Emoji. Op macOS en iOS is het Apple Color Emoji. Op Android is het Noto Color Emoji. Deze systeemlettertypen verwerken alle standaard Unicode-emoji's zonder hulp van WordPress.
Het enige zichtbare verschil dat u mogelijk opmerkt, is dat emoji's er iets anders uitzien afhankelijk van het besturingssysteem van de bezoeker. Een Apple-gebruiker ziet emoji's in Apple-stijl, een Windows-gebruiker emoji's in Microsoft-stijl, enzovoort. Dit is het standaardgedrag op het hele web en is niet specifiek voor WordPress.
Hoe u kunt verifiëren dat het script weg is
Nadat u de code heeft toegevoegd of een plugin heeft geactiveerd, moet u bevestigen dat het emojiscript niet meer wordt geladen. Hier zijn drie manieren om dat te controleren:
- Paginabron bekijken: Open uw site in een browser, klik met de rechtermuisknop en selecteer "Paginabron weergeven". Zoek naar
wp-emoji. Als u geen resultaten vindt, is het script succesvol verwijderd. - Browser DevTools: Open het tabblad Netwerk in de developertools van uw browser, herlaad de pagina en filter op "emoji". U zou nul verzoeken gerelateerd aan emojiscripts moeten zien.
- InspectWP-scan: Voer een nieuwe InspectWP-scan van uw site uit. De WordPress-sectie meldt of het emojiscript nog aanwezig is. Als de verwijdering succesvol was, zal de emojiscript-indicator niet meer in het rapport verschijnen.