Aucune optimisation n’est jamais trop petite quand il s’agit de performance web. Avec le temps, un grand nombre de ces petites astuces et optimisations peuvent commencer à réduire une bonne partie de votre temps de chargement global. Dans un article précédent, nous avons expliqué comment désactiver les émojis dans WordPress. Aujourd’hui, nous voulons partager avec vous comment désactiver les embeds dans WordPress.

Quand ils ont sorti WordPress 4.4, ils ont fusionné la fonction oEmbed dans le noyau. Vous l’avez probablement déjà vu ou utilisé. Cela permet aux utilisateurs d’intégrer des vidéos YouTube, des tweets et de nombreuses autres ressources sur leurs sites simplement en collant une URL, que WordPress convertit automatiquement en embed et fournit un aperçu en direct dans l’éditeur visuel. Par exemple, nous avons collé cette URL depuis Twitter : https://twitter.com/kinsta/status/760489262127120385 et elle a été convertie en ce que vous voyez ci-dessous. Vous pouvez voir la liste officielle des types d’intégration pris en charge.

Tweet intégré
Tweet intégré

WordPress est un consommateur de oEmbed depuis longtemps, mais avec la mise à jour, WordPress est devenu un fournisseur oEmbed. Cette fonction est utile pour beaucoup de gens, et vous voudrez peut-être la garder activée. Cependant, cela signifie que cela génère également une requête HTTP supplémentaire sur votre site WordPress pour charger le fichier wp-embed.min.js. Et ça se charge sur chaque page. Bien que ce fichier ne fasse que 1,7 Ko, les choses comme celles-ci s’accumulent avec le temps. La demande elle-même est parfois plus importante que la taille du téléchargement de contenu.

(Lecture suggérée: Comment résoudre le problème d’oEmbed Facebook dans WordPress).

wp embed
wp-embed.min.js

Désactiver l’intégration dans WordPress

Il y a plusieurs façons de désactiver les Embeds dans WordPress. Vous pouvez le faire avec un plugin gratuit, avec du code, ou avec du JS minifié inline.

1. Désactiver les Embeds dans WordPress avec un plugin

La première façon de désactiver les Embeds est d’utiliser simplement un plugin gratuit appelé Disable Embeds, développé par Pascal Birchler qui est en fait l’un des contributeurs principaux de WordPress.

Plugin WordPress pour désactiver les Embeds
Plugin WordPress pour désactiver les Embeds

Ce plugin est super léger, seulement 3 KB pour être exact. Au moment d’écrire ces lignes, il y a actuellement plus de 10 000 installations actives avec une note de 4,8 étoiles sur 5. Vous pouvez le télécharger à partir du référentiel WordPress ou en le recherchant dans votre tableau de bord WordPress sous « Ajouter » extensions. Il n’y a rien à configurer, il suffit de l’installer, de l’activer et le fichier JavaScript supplémentaire sera supprimé. Il comprend ce qui suit :

  • Il empêche les autres d’intégrer votre site.
  • Vous empêche d’intégrer d’autres sites qui ne sont pas sur la liste blanche.
  • Désactive le chargement du fichier JavaScript sur votre site WordPress.

Vous pouvez toujours intégrer des choses à partir de YouTube et Twitter en utilisant leurs scripts iframe intégrés. Vous pouvez également utiliser un plugin premium comme perfmatters (développé par un membre de l’équipe de Kinsta), qui vous permet de désactiver les embeds ainsi que d’autres optimisations pour votre site WordPress.

Désactiver les Embeds avec le plugin Perfmatters
Désactiver les Embeds avec le plugin Perfmatters

2. Désactiver les Embeds dans WordPress avec du code

Si vous ne voulez pas installer un autre plugin, vous pouvez aussi simplement désactiver les embeds avec du code. Commencez par créer une sauvegarde de votre site, puis créez un thème enfant afin que vos modifications ne soient pas perdues si vous mettez à jour votre thème. Ensuite, ajoutez ce qui suit au fichier functions.php de votre thème enfant. Note : code provenant du plugin Disable Embeds ci-dessus.

Important ! L’édition du code source d’un thème WordPress pourrait casser votre site si ce n’est pas fait correctement. Si vous n’êtes pas à l’aise de le faire, veuillez d’abord vérifier auprès d’un développeur.
function disable_embeds_code_init() {

 // Remove the REST API endpoint.
 remove_action( 'rest_api_init', 'wp_oembed_register_route' );

 // Turn off oEmbed auto discovery.
 add_filter( 'embed_oembed_discover', '__return_false' );

 // Don't filter oEmbed results.
 remove_filter( 'oembed_dataparse', 'wp_filter_oembed_result', 10 );

 // Remove oEmbed discovery links.
 remove_action( 'wp_head', 'wp_oembed_add_discovery_links' );

 // Remove oEmbed-specific JavaScript from the front-end and back-end.
 remove_action( 'wp_head', 'wp_oembed_add_host_js' );
 add_filter( 'tiny_mce_plugins', 'disable_embeds_tiny_mce_plugin' );

 // Remove all embeds rewrite rules.
 add_filter( 'rewrite_rules_array', 'disable_embeds_rewrites' );

 // Remove filter of the oEmbed result before any HTTP requests are made.
 remove_filter( 'pre_oembed_result', 'wp_filter_pre_oembed_result', 10 );
}

add_action( 'init', 'disable_embeds_code_init', 9999 );

function disable_embeds_tiny_mce_plugin($plugins) {
    return array_diff($plugins, array('wpembed'));
}

function disable_embeds_rewrites($rules) {
    foreach($rules as $rule => $rewrite) {
        if(false !== strpos($rewrite, 'embed=true')) {
            unset($rules[$rule]);
        }
    }
    return $rules;
}

Ou vous pouvez aussi utiliser la fonction wp_dequeue_script.

function my_deregister_scripts(){
 wp_dequeue_script( 'wp-embed' );
}
add_action( 'wp_footer', 'my_deregister_scripts' );

3. JS Minifié Inline

Une troisième option serait de récupérer le contenu du fichier wp-embed.min.js et de l’intégrer dans le code source, en mode inline. Ceci ne devrait être fait qu’avec de petits fichiers ou quand il n’y a pas beaucoup de code impliqué. Ce serait le cas si vous vouliez simplement vous débarrasser de la requête HTTP tout en laissant le support pour les embeds.