đŸ’„ TRENDING: Plugins/autoptimize - Collection

Autoptimize

Description

Autoptimize makes optimizing your site really easy. It can aggregate, minify and cache scripts and styles, injects CSS in the page head by default but can also inline critical CSS and defer the aggregated full CSS, moves and defers scripts to the footer and minifies HTML. You can optimize and lazy-load images (with support for WebP and AVIF formats), optimize Google Fonts, async non-aggregated JavaScript, remove WordPress core emoji cruft and more. As such it can improve your site’s performance even when already on HTTP/2! There is extensive API available to enable you to tailor Autoptimize to each and every site’s specific needs.
If you think performance indeed is important, you should at least consider one of the many free page caching plugins (e.g. Speed Booster pack or KeyCDN’s Cache Enabler) to complement Autoptimize or even consider Autoptimize Pro which not only has page caching but also image optimization, CDN, critical CSS and more!

Autoptimize Pro
Autoptimize Pro is a premium Power-Up, adding image optimization, CDN, page caching, automatic critical CSS rules and extra “booster” options, all in one handy subscription to make your site even faster!!

Premium Support
We provide great Premium Support and Web Performance Optimization services with Accelera, check out our offering on https://accelerawp.com/!

(Speed-surfing image under creative commons by LL Twistiti)

Installation

Il suffit de l’installer Ă  partir de votre tableau de bord WordPress « Extensions > Ajouter » et tout ira bien. L’installation manuelle est Ă©galement trĂšs simple :

  1. Téléversez le fichier zip et dézippez-le dans le répertoire /wp-content/plugins/.
  2. Activez l’extension via le menu « Extensions » de WordPress.
  3. Allez dans Réglages > Autoptimize et activez les options que vous souhaitez. En général, cela signifie « Optimiser HTML/CSS/JavaScript ».

FAQ

Que fait l’extension pour accĂ©lĂ©rer mon site ?

It minifies all scripts and styles and configures your webserver to compresses them with good expires headers. JavaScript be default will be made non-render-blocking and CSS can be too by adding critical CSS. You can configure it to combine (aggregate) CSS & JS-files, in which case styles are moved to the page head, and scripts to the footer. It also minifies the HTML code and can also optimize images and Google Fonts, making your page really lightweight.

Mais je suis en HTTP/2, donc je n’ai pas besoin d’Autoptimize ?

HTTP/2 is a great step forward for sure, reducing the impact of multiple requests from the same server significantly by using the same connection to perform several concurrent requests and for that reason on new installations Autoptimize will not aggregate CSS and JS files any more. That being said, concatenation of CSS/ JS can still make a lot of sense, as described in this css-tricks.com article and this blogpost from one of the Ebay engineers. The conclusion; configure, test, reconfigure, retest, tweak and look what works best in your context. Maybe it’s just HTTP/2, maybe it’s HTTP/2 + aggregation and minification, maybe it’s HTTP/2 + minification (which AO can do as well, simply untick the « aggregate JS-files » and/ or « aggregate CSS-files » options). And Autoptimize can do a lot more then « just » optimizing your JS & CSS off course 😉

Est-ce que ça fonctionnera avec mon site ?

Although Autoptimize comes without any warranties, it will in general work flawlessly if you configure it correctly. See « Troubleshooting » below for info on how to configure in case of problems. If you want you can test Autoptimize on a new free dummy site, courtesy of tastewp.com.

Why is jquery.min.js not optimized when aggregating JavaScript?

A partir de AO 2.1, le cƓur de WordPress jquery.min.js n’est pas optimisĂ© pour la simple raison que de nombreuses extensions populaires injectent du JS en ligne qui n’est pas non plus agrĂ©gĂ© (en raison de problĂšmes Ă©ventuels de taille de cache avec un code unique dans le JS en ligne) qui repose sur la disponibilitĂ© de jquery, donc l’exclusion de jquery.min.js garantit que la plupart des sites fonctionneront dĂšs le dĂ©part. Si vous souhaitez Ă©galement optimiser jquery, vous pouvez le retirer de la liste d’exclusion d’optimisation JS (vous devrez peut-ĂȘtre activer « également agrĂ©ger en ligne JS » ou passer Ă  « forcer JS dans l’en-tĂȘte »).

Pourquoi le rendu JS Autoptimizé est-il bloqué ?

This happens when aggregating JavaSCript and ticking the « force in head » option or when not aggregating and not deferring. Consider changing settings.

Pourquoi le CSS Autoptimizé est-il encore signalé comme bloquant le rendu ?

Avec la configuration par dĂ©faut d’Autoptimize le CSS est liĂ© dans l’en-tĂȘte, ce qui est sĂ»r par dĂ©faut, mais Google PageSpeed Insights s’en plaint. Vous pouvez consulter les options « tous les CSS en ligne » (facile) ou « en ligne et diffĂ©rer le CSS » (mieux) qui sont Ă©galement expliquĂ©es dans cette FAQ.

Quelle est l’utilitĂ© de « Mettre en ligne et diffĂ©rer le CSS » ?

Le CSS en gĂ©nĂ©ral doit aller dans l’en-tĂȘte du document. RĂ©cemment, par exemple, Google a commencĂ© Ă  promouvoir le report des CSS non essentiels, tout en soulignant les styles nĂ©cessaires pour construire la page au-dessus de la ligne de flottaison. Ceci est particuliĂšrement important pour rendre les pages le plus rapidement possible sur les appareils mobiles. Depuis la version 1.9.0 d’Autoptimize, c’est facile : sĂ©lectionnez « Mettre en ligne le CSS et diffĂ©rer », collez le bloc « CSS au-dessus de la ligne de flottaison » dans le champ de saisie (zone de texte) et c’est bon !

Mais comment trouver le CSS « au-dessus de la ligne de flottaison » ?

Il n’y a pas de solution facile Ă  ce problĂšme car le « dessus de la ligne de flottaison » dĂ©pend de l’endroit oĂč se trouve la ligne de flottaison, qui dĂ©pend Ă  son tour de la taille de l’écran. Il existe cependant des outils qui tentent d’identifier exactement ce qui se trouve « au-dessus dessus de la ligne de flottaison ». Cette liste d’outils est un excellent point de dĂ©part. Le gĂ©nĂ©rateur de CSS critique et le gĂ©nĂ©rateur de chemin critique de Jonas Ohlsson sont de belles solutions de base et https://criticalcss.com est une solution haut de gamme du mĂȘme Jonas Ohlsson. Sinon, cette bookmarklet (Chrome uniquement) peut Ă©galement ĂȘtre utile.

Ou alors faut-il mettre en ligne tous les CSS ?

RĂ©ponse courte : probablement pas. Bien que l’insertion de tous les CSS rende le CSS bloquant, il en rĂ©sultera que votre page HTML de base deviendra beaucoup plus grande, ce qui nĂ©cessitera plus de « temps d’aller-retour ». De plus, lorsque plusieurs pages sont demandĂ©es au cours d’une session de navigation, le CSS en ligne est envoyĂ© Ă  chaque fois, alors que s’il n’est pas en ligne, il est servi Ă  partir du cache. Enfin, le CSS en ligne poussera les mĂ©ta-balises dans le HTML jusqu’à une position oĂč Facebook ou Whatsapp ne les chercheront plus, cassant par exemple les miniatures lors du partage sur ces plateformes.

Mon cache devient Ă©norme, est-ce qu’Autoptimize purge le cache ?

Autoptimize n’a pas son propre mĂ©canisme de purge de cache, car cela pourrait retirer les CSS/JS optimisĂ©s qui sont encore mentionnĂ©s dans d’autres caches, ce qui briserait votre site. De plus, un cache Ă  croissance rapide est une indication d’autres problĂšmes que vous devriez Ă©viter (en).

Au lieu de cela, vous pouvez maintenir la taille du cache à un niveau acceptable soit :

  • en dĂ©sactivation les options « ConcatĂ©ner le JS en ligne » et/ou « ConcatĂ©ner le CSS en ligne »,
  • en excluant des variables JS (ou parfois des sĂ©lecteurs CSS) qui changent par page (ou par chargement de pages). Vous pouvez lire comment faire cela dans ce billet (en).

MalgrĂ© les objections ci-dessus, il existe des solutions tierces pour purger automatiquement le cache d’AO, par exemple en utilisant ce code ou cette extension, mais pour les raisons ci-dessus, ces solutions doivent ĂȘtre utilisĂ©es uniquement si vous savez rĂ©ellement ce que vous faites.

« Vider le cache » ne semble pas fonctionner ?

Lorsque vous cliquez sur le lien « Vider le cache » dans le menu dĂ©roulant d’Autoptimize situĂ© dans barre d’outils du back-office, vous pouvez obtenir un message « Votre cache n’a peut-ĂȘtre pas Ă©tĂ© bien purgé ». Dans ce cas, allez Ă  la page de configuration d’Autoptimize et cliquez sur le bouton « Enregistrer les modifications & vider le cache ».

De plus, ne vous inquiĂ©tez pas si votre cache n’est jamais rĂ©duit Ă  0 fichier/0 ko, car Autoptimize (Ă  partir de la version 2.2) prĂ©chargera automatiquement le cache immĂ©diatement aprĂšs qu’il ait Ă©tĂ© vidĂ© pour accĂ©lĂ©rer encore plus la minification.

Mon site a l’air cassĂ© quand je vide le cache d’Autoptimize !

Lors de l’effacement du cache d’AO, aucune page du cache ne doit contenir de pages (HTML) faisant rĂ©fĂ©rence aux CSS/JS optimisĂ©s supprimĂ©s. Bien qu’il existe Ă  cette fin une intĂ©gration entre Autoptimize et certains caches de pages, cette intĂ©gration ne couvre pas 100 % des configurations, de sorte que vous pourriez devoir vider votre cache de pages manuellement.

Puis-je toujours utiliser le Rocket Loader de Cloudflare ?

Cloudflare Rocket Loader est un moyen assez avancĂ© mais invasif de rendre JavaScript non bloquant pour le rendu, ce que Cloudflare considĂšre toujours comme en bĂȘta. Parfois, Autoptimize & Rocket Loader fonctionnent ensemble, parfois non. La meilleure approche consiste Ă  dĂ©sactiver Rocket Loader, Ă  configurer Autoptimize et Ă  rĂ©activer Rocket Loader (si vous pensez que cela peut aider) aprĂšs cela et Ă  tester si tout fonctionne toujours.

En ce moment (juin 2017), il semble que RocketLoader pourrait casser la fonction « Mettre en ligne et diffĂ©rer le CSS » d’AO, qui est basĂ© sur Filamentgroup’s loadCSS, ce qui fait que le CSS diffĂ©rĂ© ne se charge pas.

J’ai essayĂ© Autoptimize mais mon score Google Pagespeed s’est Ă  peine amĂ©liorĂ©

Autoptimize n’est pas une simple extension « corriger mes problĂšmes de vitesse ». Elle ne fait que concatĂ©ner et minifier JS (local) & CSS et images et permet quelques extras sympas comme la suppression des polices Google et le report du chargement du CSS. Ainsi, Autoptimize vous permettra d’amĂ©liorer vos performances (temps de chargement mesurĂ© en secondes) et vous aidera probablement aussi Ă  faire face Ă  certains avertissements spĂ©cifiques concernant la vitesse des pages. Si vous voulez continuer Ă  vous amĂ©liorer, vous devrez probablement aussi vous pencher sur la mise en cache des pages et sur la configuration de votre serveur web, ce qui amĂ©liorera les performances rĂ©elles (lĂ  encore, le temps de chargement est mesurĂ© par exemple par https://webpagetest.org) et vos « meilleures pratiques en matiĂšre de performance » de la vitesse des pages.

Que puis-je faire avec l’API ?

Beaucoup de choses : il y a des filtres que vous pouvez utiliser pour dĂ©sactiver conditionnellement Autoptimize par requĂȘte, pour changer les exclusions CSS et JS, pour changer la limite des images d’arriĂšre-plan CSS Ă  insĂ©rer dans le CSS, pour dĂ©finir quels fichiers JS sont dĂ©placĂ©s derriĂšre le fichier agrĂ©gĂ©, pour changer l’attribut de report sur le script-tag JS concatĂ©nĂ©… Il y a des exemples pour certains filtres dans autoptimize_helper.php_example et dans cette FAQ.

Comment fonctionne le CDN ?

À partir de la version 1.7.0, le CDN est activĂ© dĂšs l’entrĂ©e dans le rĂ©pertoire racine du site CDN (par exemple http://cdn.example.net/wordpress/). Si cette URL est prĂ©sente, elle sera utilisĂ©e pour tous les fichiers gĂ©nĂ©rĂ©s par Autoptimize (c’est-Ă -dire les CSS et JS concatĂ©nĂ©s), y compris les images d’arriĂšre-plan dans le CSS (lorsqu’on n’utilise pas les URL de donnĂ©es).

Si vous souhaitez que vos images tĂ©lĂ©chargĂ©es se trouvent Ă©galement sur le CDN, vous pouvez modifier le chemin d’accĂšs upload_url_path dans votre configuration WordPress (/wp-admin/options.php) pour le rĂ©pertoire de tĂ©lĂ©chargement cible du CDN (par exemple http://cdn.example.net/wordpress/wp-content/uploads/). Prenez en considĂ©ration que cela ne fonctionne que pour les images tĂ©lĂ©chargĂ©es Ă  partir de ce point, et non pour les images qui ont dĂ©jĂ  Ă©tĂ© tĂ©lĂ©chargĂ©es. Merci Ă  BeautyPirate pour le conseil !

Pourquoi mes polices de caractÚres ne sont-elles pas mises sur le CDN également ?

Autoptimize prend en charge cette fonction, mais elle n’est pas activĂ©e par dĂ©faut car les polices non locales peuvent nĂ©cessiter une configuration supplĂ©mentaire. Mais si vous avez votre politique de requĂȘtes inter-origines en ordre, vous pouvez dire Ă  Autoptimize de mettre vos polices sur le CDN en vous connectant Ă  l’API, en dĂ©finissant autoptimize_filter_css_fonts_cdn Ă  true de cette façon ;

add_filter( 'autoptimize_filter_css_fonts_cdn', '__return_true' );

J’utilise Cloudflare, que dois-je saisir comme rĂ©pertoire racine du CDN ?

Rien, lorsque vous ĂȘtes sur Cloudflare votre CSS/JS AutoptimizĂ© se trouve automatiquement sur le CDN du Cloudflare.

Comment puis-je forcer les fichiers agrĂ©gĂ©s Ă  ĂȘtre statiques en CSS ou JS au lieu de PHP ?

Si votre serveur web est correctement configurĂ© pour gĂ©rer la compression (gzip ou deflate) et l’expiration du cache (expiration et contrĂŽle du cache avec une capacitĂ© de cache suffisante), vous n’avez pas besoin d’Autoptimize pour gĂ©rer cela Ă  votre place. Dans ce cas, vous pouvez cocher l’option « Enregistrer les scripts/CSS concatĂ©nĂ©s sous forme de fichiers statiques », qui obligera Autoptimize Ă  enregistrer les fichiers concatĂ©nĂ©s sous forme de fichiers .css et .js (ce qui signifie qu’aucun PHP n’est nĂ©cessaire pour servir ces fichiers). Ce paramĂštre est dĂ©fini par dĂ©faut Ă  partir de la version 1.8 d’Autoptimize.

Comment fonctionne « l’exclusion de l’optimisation » ?

L’optimisation CSS et JS permet d’éviter que le code soit concatĂ©nĂ© et minimisĂ© en ajoutant des « identifiants » Ă  la liste d’exclusion sĂ©parĂ©e par des virgules. La chaĂźne d’identificateurs exacte Ă  utiliser peut ĂȘtre dĂ©terminĂ©e de cette maniĂšre :

  • si vous souhaitez exclure un fichier spĂ©cifique, par exemple wp-content/plugins/funkyplugin/css/style.css, vous pouvez simplement exclure « funkyplugin/css/style.css ».
  • si vous voulez exclure tous les fichiers d’une extension spĂ©cifique, par exemple wp-content/plugins/funkyplugin/js/*, vous pouvez exclure par exemple « funkyplugin/js/ » ou « plugins/funkyplugin ».
  • si vous souhaitez exclure un code en ligne, vous devrez trouver une chaĂźne spĂ©cifique et unique dans ce bloc de code et l’ajouter Ă  la liste d’exclusion. Exemple : pour exclure <script>funky_data='Won\'t you take me to, Funky Town'</script>, l’identifiant est « funky_data ».

Troubleshooting Autoptimize

Have a look at the troubleshooitng instructions at https://blog.futtta.be/2022/05/05/what-to-do-when-autoptimize-breaks-your-site/

J’ai exclu des fichiers mais ils sont toujours AutoptimizĂ©s ?

AO minifie les JS/CSS exclus si le nom du fichier indique que le fichier n’est pas encore minifiĂ©. Depuis la version 2.5 de l’AO, vous pouvez dĂ©sactiver cette fonction dans l’onglet « JS, CSS & HTML » dans « Options diverses » en dĂ©cochant « Minifier les fichiers CSS et JS exclus ».

À l’aide, j’ai une page blanche ou une erreur de serveur interne aprĂšs avoir activĂ© Autoptimize !

Assurez-vous que vous n’exĂ©cutez pas d’autres extension de minification HTML, CSS ou JS (BWP minify, WP minify…) simultanĂ©ment avec Autoptimize ou dĂ©sactivez cette fonctionnalitĂ© de votre extension de mise en cache des pages (W3 Total Cache, WP Fastest Cache…). Essayez d’activer uniquement l’optimisation CSS ou JS pour voir laquelle des deux provoque l’erreur du serveur et suivez les Ă©tapes de dĂ©pannage gĂ©nĂ©riques pour trouver une solution.

Mais j’ai encore des fichiers CSS ou JS AutoptimizĂ©s vierges !

Si vous utilisez Apache, le fichier .htaccess Ă©crit par Autoptimize peut dans certains cas entrer en conflit avec les paramĂštres AllowOverrides de votre configuration Apache (comme c’est le cas avec la configuration par dĂ©faut de certaines installations Ubuntu), ce qui entraĂźne des « erreurs interne de serveur » sur les fichiers CSS et JS auto-optimisĂ©s. Ce problĂšme peut ĂȘtre rĂ©solu en rĂ©glant les rĂ©glages d’AllowOverrides sur All.

Impossible de se connecter sur les multisites mappés par domaine

Les multisites mappĂ©s par domaine nĂ©cessitent l’option Autoptimize pour ĂȘtre initialisĂ©s Ă  une action WordPress diffĂ©rente, ajoutez cette ligne de code Ă  votre wp-config.php pour qu’elle se branche dans setup_theme par exemple :

define( 'AUTOPTIMIZE_SETUP_INITHOOK', 'setup_theme' );

Je n’ai aucune erreur, mais mes pages ne sont pas du tout optimisĂ©es ?

Autoptimize effectue un certain nombre de contrĂŽles avant d’optimiser rĂ©ellement. Si l’une des conditions suivantes est remplie, vos pages ne seront pas optimisĂ©es :

  • lorsqu’il se trouve dans l’outil de personnalisation
  • s’il n’y a aucune ouverture de balise <html
  • s’il y a <xsl:stylesheet dans la rĂ©ponse (indiquant que la sortie n’est pas HTML mais XML)
  • s’il y a <html amp dans la rĂ©ponse (car les pages AMP sont dĂ©jĂ  optimisĂ©es)
  • si la sortie est un flux RSS (fonction is_feed())
  • si la sortie est une page d’administration WordPress (fonction is_admin())
  • si la page est demandĂ©e avec ?ao_noptimize=1 en annexe Ă  l’URL
  • si le code s’accroche (hook) Ă  Autoptimize pour dĂ©sactiver l’optimisation (voir le sujet sur Visual Composer)
  • si d’autres extensions utilisent le tampon de sortie de maniĂšre incompatible (dĂ©sactivez les autres extensions de maniĂšre sĂ©lective pour identifier le coupable).

Les solutions Visual Composer, Beaver Builder et autres constructeurs de pages similaires sont cassées !

DĂ©sactiver l’option pour avoir Autoptimize active pour les utilisateurs connectĂ©s et devenir fou de glisser-dĂ©poser 😉

À l’aide, la validation de commande ou de paiement de ma boutique ne fonctionne plus !

DĂ©sactiver l’option pour optimiser les pages panier ou commande (fonctionne pour WooCommerce, Easy Digital Downloads et WP eCommerce).

Revolution Slider est cassé !

Assurez-vous que js/jquery/jquery.min.js est dans la liste des exclusions d’optimisation JS sĂ©parĂ©es par des virgules (ceci est exclu dans la configuration par dĂ©faut).

Je reçois des erreurs « jQuery n’est pas dĂ©fini ».

Dans ce cas, vous avez un JavaScript non agrĂ©gĂ© qui nĂ©cessite le chargement de jQuery, vous devrez donc ajouter js/jquery/jquery.min.js Ă  la liste des exclusions d’optimisation JS sĂ©parĂ©es par des virgules.

J’utilise NextGen Galeries et beaucoup de JS ne sont pas concatĂ©nĂ©s ou minifiĂ©s ?

NextGen Galleries fait des trucs sympas pour ajouter du JavaScript. Pour qu’Autoptimize puisse l’agrĂ©ger, vous pouvez soit dĂ©sactiver la gestion des ressources de NextGen Gallery avec ce bout de code add_filter( 'run_ngg_resource_manager', '__return_false' ); ou vous pouvez dire Ă  Autoptimize de lginitialiser plus tĂŽt, en ajoutant ceci Ă  votre wp-config.php : define("AUTOPTIMIZE_INIT_EARLIER", "true");

Qu’est-ce que noptimize ?

À partir de la version 1.6.6 Autoptimize exclut tout ce qui se trouve Ă  l’intĂ©rieur des balises noptimize, par exemple :
<!--noptimize--><script>alert(‘ceci ne sera pas AutoptimizĂ©’);</script><!--/noptimize-->

Vous pouvez le faire dans le contenu de votre page ou publication, dans les widgets et dans vos fichiers de thÚmes (pensez à créer un thÚme enfant pour éviter que votre travail ne soit écrasé par les mises à jour des thÚmes).

Puis-je modifier le répertoire et le nom des fichiers auto-optimisés mis en cache ?

Oui, si vous voulez servir des fichiers provenant par exemple de /wp-content/resources/aggregated_12345.css au lieu de /wp-content/cache/autoptimize/autoptimize_12345.css par défaut, alors ajoutez ceci à wp-config.php :

define('AUTOPTIMIZE_CACHE_CHILD_DIR','/resources/');
define('AUTOPTIMIZE_CACHEFILE_PREFIX','aggregated_');

Est-ce que cela fonctionne avec le WP_CONTENT_URL non standard ?

Non, Autoptimize ne prend pas en charge un WP_CONTENT_URL non standard prĂȘt Ă  l’emploi, mais cela peut ĂȘtre fait en ajoutant quelques lignes de code dans l’API d’Autoptimize.

Le JS/CSS gĂ©nĂ©rĂ© peut-il ĂȘtre prĂ©-gzippé ?

Oui, mais cette fonction est dĂ©sactivĂ©e par dĂ©faut. Vous pouvez l’activer en passant « true » Ă  « autoptimize_filter_cache_create_static_gzip ». Vous devrez Ă©videmment configurer votre serveur web pour utiliser ces fichiers Ă  la place des fichiers non compressĂ©s afin d’éviter la surcharge de la compression Ă  la volĂ©e.

Que fait « Retirer les émojis » ?

Cette nouvelle option dans Autoptimize 2.3 retirer les fichiers CSS en ligne, JS en ligne et JS liĂ©s ajoutĂ©s par le cƓur de WordPress. Cela peut donc avoir un lĂ©ger impact positif sur les performances de votre site.

L’option « Retirer les chaĂźnes de requĂȘte » est-elle utile ?

Bien que certains outils d’évaluation des performances en ligne considĂšrent les « chaĂźnes de requĂȘte pour les fichiers statiques » comme un problĂšme de performance, l’impact de ces derniĂšres est en gĂ©nĂ©ral presque inexistant. Ainsi, depuis la version 2.3, Autoptimize vous permet de faire supprimer la chaĂźne de requĂȘte (ou plus prĂ©cisĂ©ment le paramĂštre « ver »), mais le fait de cocher « Retirer les chaĂźnes de requĂȘte des ressources statiques » n’aura que peu ou aucun impact sur les performances de votre site, mesurĂ©es en (milli-)secondes.

(Comment) devrais-je optimiser les polices de Google ?

Les polices de Google sont gĂ©nĂ©ralement chargĂ©es par un fichier CSS liĂ© Ă  un « blocage du rendu ». Si vous avez un thĂšme et des extensions qui utilisent les Google Fonts, vous risquez de vous retrouver avec plusieurs fichiers CSS de ce type. La fonction d’optimisation automatique (depuis la version 2.3) vous permet dĂ©sormais de rĂ©duire l’impact des polices Google en les supprimant toutes ou en optimisant leur chargement. Il existe deux types d’optimisation : le premier est « combiner et lier », qui remplace toutes les demandes de Google Fonts en une seule, ce qui bloque toujours le rendu mais permet de charger les polices immĂ©diatement (ce qui signifie que vous ne verrez pas les polices changer pendant le chargement de la page). L’alternative est « combiner et charger asynchrone », qui utilise JavaScript pour charger les polices de maniĂšre non bloquante pour le rendu mais qui pourrait provoquer un « flash de texte non stylisé ».

Dois-je utiliser « pré-connexion » ?

La prĂ©-connexion est une fonction quelque peu avancĂ©e qui permet de demander aux navigateurs (s’ils la prennent en charge) d’établir une connexion avec des domaines spĂ©cifiques mĂȘme si la connexion n’est pas immĂ©diatement nĂ©cessaire. Cette fonction peut ĂȘtre utilisĂ©e, par exemple, pour rĂ©duire l’impact des ressources de tiers sur le HTTPS (car la demande DNS, la connexion TCP et la nĂ©gociation SSL/TLS sont exĂ©cutĂ©es de maniĂšre anticipĂ©e). À utiliser avec prĂ©caution, car la prĂ©-connexion Ă  un trop grand nombre de domaines peut ĂȘtre contre-productive.

Quand est-ce que je peux ou ne peux pas asynchroniser JS ?

Les fichiers JavaScript qui ne sont pas AutoptimizĂ©s (parce qu’ils ont Ă©tĂ© exclus ou parce qu’ils sont hĂ©bergĂ©s ailleurs) sont gĂ©nĂ©ralement des fichiers de rendu bloquĂ©s. En les ajoutant dans le champ « async JS » sĂ©parĂ© par des virgules, Autoptimize ajoutera le drapeau async qui provoquera le chargement asynchrone de ces fichiers par le navigateur (c’est-Ă -dire le blocage du rendu). Cela peut cependant casser votre site (page), par exemple si vous asynchronisez « js/jquery/jquery.js » vous obtiendrez trĂšs probablement des erreurs « jQuery n’est pas dĂ©fini ». À utiliser avec prĂ©caution.

Comment fonctionne l’optimisation des images ?

Lorsque l’optimisation des images est activĂ©e, Autoptimize recherche les fichiers png, gif, jpeg (.jpg) dans les balises d’image et dans vos fichiers CSS qui sont chargĂ©s depuis votre propre domaine et change la source (src) en CDN ShortPixel pour ceux-ci. Important : cela ne peut fonctionner que pour les images accessibles au public, sinon le proxy d’optimisation d’image ne pourra pas obtenir l’image pour l’optimiser, de sorte que les pare-feu ou les proxies ou la protection par mot de passe ou mĂȘme la prĂ©vention des hotlinks pourraient casser l’optimisation d’image.

Puis-je utiliser l’optimisation des images pour mon intranet ou mon site protĂ©gé ?

Non : l’optimisation des images dĂ©pend de la capacitĂ© du service externe d’optimisation des images Ă  rĂ©cupĂ©rer l’image originale de votre site, Ă  l’optimiser et Ă  l’enregistrer sur le CDN. Si vos images ne peuvent pas ĂȘtre tĂ©lĂ©chargĂ©es par des visiteurs anonymes (en raison d’un pare-feu, d’un proxy, d’une protection par mot de passe ou d’une protection par hotlinking), l’optimisation des images ne fonctionnera pas.

OĂč puis-je obtenir plus d’informations sur l’optimisation des images ?

Consultez la Foire aux questions de Shortpixel.

Puis-je dĂ©sactiver l’écoute des vidages de cache des pages par AO ?

À partir d’AO 2.4, AO « écoute » les vidages de cache des pages pour vider son propre cache. Vous pouvez dĂ©sactiver ce comportement avec ce filtre ;

add_filter('autoptimize_filter_main_hookpagecachepurge','__return_false');

Certains des caractùres non-ASCII se perdent aprùs l’optimisation

Par dĂ©faut, AO utilise des mĂ©thodes de chaĂźnes non sĂ©curisĂ©es sur plusieurs octets, mais si votre PHP possĂšde l’extension mbstring, vous pouvez activer les fonctions de chaĂźnes sĂ©curisĂ©es sur plusieurs octets avec ce filtre ;

add_filter('autoptimize_filter_main_use_mbstring', '__return_true');

Je n’arrive pas à faire fonctionner Critical CSS

Consultez la FAQ sur l’(ancien) Critical CSS power-up ici, cette information sera intĂ©grĂ©e dans cette FAQ Ă  une date ultĂ©rieure.

Do I still need the Critical CSS power-up when I have Autoptimize 2.7 or higher?

No, the Critical CSS power-up is not needed any more, all functionality (and many fixes/ improvements) are now part of Autoptimize.

Que fait « prendre en charge les solutions de repli pour les erreurs 404 » ? Pourquoi en aurais-je besoin ?

Les caches agrĂ©gĂ©s d’Autoptimize & les CSS/JS optimisĂ©s et les liens vers ces fichiers mis en cache sont stockĂ©s dans le HTML, qui sera stockĂ© dans un cache de page (qui peut ĂȘtre une extension, peut ĂȘtre au niveau de l’hĂŽte, peut ĂȘtre chez un tiers, dans le cache de Google ou dans un navigateur). S’il y a du HTML dans un cache de page qui renvoie Ă  des CSS/JS AutoptimizĂ©s qui ont Ă©tĂ© supprimĂ©s entre-temps (quand le cache a Ă©tĂ© vidĂ©), alors la page du cache n’aura pas l’apparence ou le fonctionnement attendu car les CSS ou JS n’ont pas Ă©tĂ© trouvĂ©s (erreur 404).

Ce rĂ©glage vise Ă  Ă©viter les ruptures en servant des CSS ou JS de « repli ». Les fichiers de repli sont des copies des premiers fichiers CSS & JS auto-optimisĂ©s créés aprĂšs que le cache ait Ă©tĂ© vidĂ© et, en tant que tels, seront basĂ©s sur la page d’accueil. Cela signifie que la migration CSS/JS ne s’applique pas Ă  100 % aux autres pages, mais au moins l’impact des CSS/ JS manquants sera rĂ©duit (souvent de maniĂšre significative).

Lorsque l’option est activĂ©e, Autoptimize ajoute un ErrorDocument 404 au .htaccess (tel qu’utilisĂ© par Apache) et se connecte Ă©galement au cƓur de WordPress template_redirect pour capturer les 404 gĂ©rĂ©s par WordPress. En utilisant NGINX, quelque chose comme ci-dessous devrait fonctionner (je ne suis pas un spĂ©cialiste de NGINX, mais cela fonctionne pour moi) 😉

location ~* /wp-content/cache/autoptimize/.*\.(js|css)$ {
    try_files $uri $uri/ /wp-content/autoptimize_404_handler.php;
}

And this a nice alternative approach (provided by fboylovesyou);

location ~* /wp-content/cache/autoptimize/.*\.(css)$ {
    try_files $uri $uri/ /wp-content/cache/autoptimize/css/autoptimize_fallback.css;
}
location ~* /wp-content/cache/autoptimize/.*\.(js)$ {
    try_files $uri $uri/ /wp-content/cache/autoptimize/js/autoptimize_fallback.js;
}

Quels sont les logiciels/projets open source utilisés dans Autoptimize ?

Les supers projets open source suivants sont utilisés dans Autoptimize sous une forme ou une autre :

OĂč puis-je obtenir de l’aide ?

Vous pouvez obtenir de l’aide sur le forum de support de wordpress.org. Si vous ĂȘtes sĂ»r Ă  100% que votre problĂšme ne peut pas ĂȘtre rĂ©solu en utilisant la configuration Autoptimize et que vous avez en fait dĂ©couvert un bug dans le code, vous pouvez crĂ©er une issue sur GitHub. Si vous recherchez une assistance premium, consultez nos services Support Autoptimize Pro et Optimisation des performances Web .

Je veux sortir, comment dois-je retirer Autoptimize ?

  • DĂ©sactivez l’extension (cela retirera les options et le cache)
  • Retirer l’extension
  • Effacer tout cache qui pourrait encore contenir des pages faisant rĂ©fĂ©rence Ă  des CSS/JS AutoptimizĂ©s (par exemple d’une extension de mise en cache de pages telle que WP Super Cache)

Comment puis-je aider ou contribuer ?

Il suffit de forker Autoptimize sur Github et de coder !

Avis

11 novembre 2025 1 réponse
Today, I received an email from my minification plugin: Autoptimize wanted to tell me that there is sth. wrong with its cache. The plugin created a 900MB of cache data just within a week. No plugin should be doing this. Also, I would never ever want to receive any any emails from my caching or minification plugin without my consent. There is sth. wrong there. Anyways, I don’t want a minification plugin like autoptimize just to still need to additionally install a proper caching plugin as well. Both should be integrated into one. Disappointed.