Autoptimize

Descripción

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/!

(Imagen de Speed-surfing bajo creative commons por LL Twistiti)

Instalación

Sólo instálalo desde la pantalla de «Plugins > Añadir nuevo» de tu WordPress y estará hecho. La instalación manual también es muy sencilla:

  1. Sube el archivo zip y descomprímelo en el directorio /wp-content/plugins/
  2. Activa el plugin desde el menú «Plugins» de WordPress
  3. Ve a Ajustes > Autoptimize y activa las opciones que quieras. Generalmente esto significa «Optimizar HTML/ CSS/ JavaScript».

FAQ

¿Qué hace el plugin para ayudar a la velocidad de mi sitio?

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.

Pero tengo HTTP/2, entonces ¿no necesito usar Autoptimize?

Sin duda, HTTP/2 es un gran paso adelante, ya que reduce significativamente el impacto de múltiples solicitudes del mismo servidor al utilizar la misma conexión para realizar varias solicitudes simultáneas y, por esta razón, en nuevas instalaciones, Autoptimize ya no añadirá archivos CSS y JS. Dicho esto, combinar CSS y JS todavía puede tener mucho sentido, como se describe en este artículo de css-tricks.com y esta entrada de blog de uno de los ingenieros de eBay. La conclusión: configurar, probar, reconfigurar, volver a probar, retocar y ver qué funciona mejor en tu contexto. Quizá solo necesites HTTP/2, tal vez HTTP/2 más combinar y minimizar, tal vez HTTP/2 y minimizar (algo que Autoptimize también puede hacer, simplemente desmarca las opciones «combinar archivos JS» y/o «combinar archivos CSS»). Por último, Autoptimize puede hacer mucho más que «solo» optimizar tu JS y CSS por supuesto 😉

¿Esto funcionará con mi blog?

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, el archivo «jquery.min.js» del núcleo de WordPress no está optimizado por la sencilla razón de que muchos plugins populares inyectan JS integrado que tampoco está añadido (debido a posibles problemas de tamaño de la caché con código único en el JS integrado) y que depende de que jQuery esté disponible, por lo que la exclusión de «jquery.min.js» asegura que la mayoría de los sitios funcionarán sin hacer nada. Si también quieres optimizar jQuery, puedes eliminarlo de la lista de exclusión de optimización de JS (podrías tener que activar «añadir también el JS integrado» o cambiar a «forzar JS en la cabecera»).

Why is Autoptimized JS render blocking?

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

Why is the autoptimized CSS still called out as render blocking?

With the default Autoptimize configuration the CSS is linked in the head, which is a safe default but has Google PageSpeed Insights complaining. You can look into «inline all CSS» (easy) or «inline and defer CSS» (better) which are explained in this FAQ as well.

¿Cuál es el uso de «Incrustar y retrasar CSS»?

CSS in general should go in the head of the document. Recently a.o. Google started promoting deferring non-essential CSS, while inlining those styles needed to build the page above the fold. This is especially important to render pages as quickly as possible on mobile devices. As from Autoptimize 1.9.0 this is easy; select «inline and defer CSS», paste the block of «above the fold CSS» in the input field (text area) and you’re good to go!

¿Pero cómo uno puede averiguar cuál es el CSS «antes de hacer scroll»?

There’s no easy solution for that as «above the fold» depends on where the fold is, which in turn depends on screensize. There are some tools available however, which try to identify just what is «above the fold». This list of tools is a great starting point. The Sitelocity critical CSS generator and Jonas Ohlsson’s criticalpathcssgenerator are nice basic solutions and http://criticalcss.com/ is a premium solution by the same Jonas Ohlsson. Alternatively this bookmarklet (Chrome-only) can be helpful as well.

¿O deberías poner incrustado todo el CSS?

The short answer: probably not. Although inlining all CSS will make the CSS non-render blocking, it will result in your base HTML-page getting significantly bigger thus requiring more «roundtrip times». Moreover when considering multiple pages being requested in a browsing session the inline CSS is sent over each time, whereas when not inlined it would be served from cache. Finally the inlined CSS will push the meta-tags in the HTML down to a position where Facebook or Whatsapp might not look for it any more, breaking e.g. thumbnails when sharing on these platforms.

Mi caché es cada vez más grande, ¿no vacía Autoptimize la caché?

Autoptimize does not have its proper cache purging mechanism, as this could remove optimized CSS/JS which is still referred to in other caches, which would break your site. Moreover a fast growing cache is an indication of other problems you should avoid.

Instead you can keep the cache size at an acceptable level by either:

  • disactivating the «aggregate inline JS» and/ or «aggregate inline CSS» options
  • excluding JS-variables (or sometimes CSS-selectors) that change on a per page (or per pageload) basis. You can read how you can do that in this blogpost.

Despite above objections, there are 3rd party solutions to automatically purge the AO cache, e.g. using this code or this plugin, but for reasons above these are to be used only if you really know what you’re doing.

¿«Vaciar la caché» parece no funcionar?

When clicking the «Delete Cache» link in the Autoptimize dropdown in the admin toolbar, you might to get a «Your cache might not have been purged successfully». In that case go to Autoptimizes setting page and click the «Save changes & clear cache»-button.

Además, no te preocupes si tu caché nunca baja de 0 archivos/ 0KB, ya que Autoptimize (a partir de la versión 2.2) precargará automáticamente la caché inmediatamente después de haberla limpiado para acelerar significativamente la minimización.

¡Mi sitio aparece roto cuando purgo la caché de Autoptimize!

When clearing AO’s cache, no page cache should contain pages (HTML) that refers to the removed optimized CSS/ JS. Although for that purpose there is integration between Autoptimize and some page caches, this integration does not cover 100% of setups so you might need to purge your page cache manually.

¿Puedo seguir usando Rocket Loader de Cloudflare?

Cloudflare Rocket Loader is a pretty advanced but invasive way to make JavaScript non-render-blocking, which Cloudflare still considers Beta. Sometimes Autoptimize & Rocket Loader work together, sometimes they don’t. The best approach is to disable Rocket Loader, configure Autoptimize and re-enable Rocket Loader (if you think it can help) after that and test if everything still works.

At the moment (June 2017) it seems RocketLoader might break AO’s «inline & defer CSS», which is based on Filamentgroup’s loadCSS, resulting in the deferred CSS not loading.

He probado Autoptimize pero mi puntuación de Google PageSpeed apenas ha mejorado

Autoptimize is not a simple «fix my Pagespeed-problems» plugin; it «only» aggregates & minifies (local) JS & CSS and images and allows for some nice extra’s as removing Google Fonts and deferring the loading of the CSS. As such Autoptimize will allow you to improve your performance (load time measured in seconds) and will probably also help you tackle some specific Pagespeed warnings. If you want to improve further, you will probably also have to look into e.g. page caching and your webserver configuration, which will improve real performance (again, load time as measured by e.g. https://webpagetest.org) and your «performance best practice» pagespeed ratings.

¿Qué puedo hacer con la API?

A whole lot; there are filters you can use to conditionally disable Autoptimize per request, to change the CSS- and JS-excludes, to change the limit for CSS background-images to be inlined in the CSS, to define what JS-files are moved behind the aggregated one, to change the defer-attribute on the aggregated JS script-tag, … There are examples for some filters in autoptimize_helper.php_example and in this FAQ.

¿Cómo funciona una CDN?

Starting from version 1.7.0, CDN is activated upon entering the CDN blog root directory (e.g. http://cdn.example.net/wordpress/). If that URL is present, it will used for all Autoptimize-generated files (i.e. aggregated CSS and JS), including background-images in the CSS (when not using data-uri’s).

If you want your uploaded images to be on the CDN as well, you can change the upload_url_path in your WordPress configuration (/wp-admin/options.php) to the target CDN upload directory (e.g. http://cdn.example.net/wordpress/wp-content/uploads/). Do take into consideration this only works for images uploaded from that point onwards, not for images that already were uploaded. Thanks to BeautyPirate for the tip!

Why aren’t my fonts put on the CDN as well?

Autoptimize supports this, but it is not enabled by default because non-local fonts might require some extra configuration. But if you have your cross-origin request policy in order, you can tell Autoptimize to put your fonts on the CDN by hooking into the API, setting autoptimize_filter_css_fonts_cdn to true this way;

add_filter( 'autoptimize_filter_css_fonts_cdn', '__return_true' );

I’m using Cloudflare, what should I enter as CDN root directory

Nothing, when on Cloudflare your autoptimized CSS/ JS is on the Cloudflare’s CDN automatically.

¿Cómo puedo forzar que los archivos unificados sean CSS o JS estático en lugar de PHP?

If your webserver is properly configured to handle compression (gzip or deflate) and cache expiry (expires and cache-control with sufficient cacheability), you don’t need Autoptimize to handle that for you. In that case you can check the «Save aggregated script/css as static files?»-option, which will force Autoptimize to save the aggregated files as .css and .js-files (meaning no PHP is needed to serve these files). This setting is default as of Autoptimize 1.8.

¿Cómo funciona «excluir de la optimización»?

Both CSS and JS optimization can skip code from being aggregated and minimized by adding «identifiers» to the comma-separated exclusion list. The exact identifier string to use can be determined this way:

  • if you want to exclude a specific file, e.g. wp-content/plugins/funkyplugin/css/style.css, you could simply exclude «funkyplugin/css/style.css»
  • if you want to exclude all files of a specific plugin, e.g. wp-content/plugins/funkyplugin/js/*, you can exclude for example «funkyplugin/js/» or «plugins/funkyplugin»
  • if you want to exclude inline code, you’ll have to find a specific, unique string in that block of code and add that to the exclusion list. Example: to exclude <script>funky_data='Won\'t you take me to, Funky Town'</script>, the identifier is «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/

¿He excluido los archivos, pero aun están siendo optimizados?

AO minifies excluded JS/ CSS if the filename indicates the file is not minified yet. As of AO 2.5 you can disable this on the «JS, CSS & HTML»-tab under misc. options by unticking «minify excluded files».

Help, I have a blank page or an internal server error after enabling Autoptimize!!

Asegúrate que no estas ejecutando otros plugins de minimización de HTML, CSS o JS (BWP minify, WP minify, …) simultaneamente con Autoptimize o desactiva esa funcionalidad en tu plugin de caché de páginas (W3 Total Cache, WP Fastest Cache, …). Prueba a activar solamente la optimización de CSS o la de JS para ver cuál es la causa del error del servidor y sigue los pasos genéricos del diagnóstico para encontrar una solución.

But I still have blank autoptimized CSS or JS-files!

If you are running Apache, the .htaccess file written by Autoptimize can in some cases conflict with the AllowOverrides settings of your Apache configuration (as is the case with the default configuration of some Ubuntu installations), which results in «internal server errors» on the autoptimize CSS- and JS-files. This can be solved by setting AllowOverrides to All.

Can’t log in on domain mapped multisites

Domain mapped multisites require Autoptimize to be initialized at a different WordPress action, add this line of code to your wp-config.php to make it so to hook into setup_theme for example:

define( 'AUTOPTIMIZE_SETUP_INITHOOK', 'setup_theme' );

I get no error, but my pages are not optimized at all?

Autoptimize does a number of checks before actually optimizing. When one of the following is true, your pages won’t be optimized:

  • when in the customizer
  • if there is no opening <html tag
  • if there is <xsl:stylesheet in the response (indicating the output is not HTML but XML)
  • if there is <html amp in the response (as AMP-pages are optimized already)
  • if the output is an RSS-feed (is_feed() function)
  • if the output is a WordPress administration page (is_admin() function)
  • if the page is requested with ?ao_noptimize=1 appended to the URL
  • if code hooks into Autoptimize to disable optimization (see topic on Visual Composer)
  • if other plugins use the output buffer in an incompatible manner (disable other plugins selectively to identify the culprit)

Visual Composer, Beaver Builder and similar page builder solutions are broken!!

Disable the option to have Autoptimize active for logged on users and go crazy dragging and dropping 😉

¡Ayuda, el pago de mi tienda no funciona!

Desactiva la opción para optimizar las páginas del carrito / pago (funciona para WooCommerce, Easy Digital Downloads y WP eCommerce).

¡Revolution Slider está roto!

Make sure js/jquery/jquery.min.js is in the comma-separated list of JS optimization exclusions (this is excluded in the default configuration).

I’m getting «jQuery is not defined» errors

In that case you have un-aggregated JavaScript that requires jQuery to be loaded, so you’ll have to add js/jquery/jquery.min.js to the comma-separated list of JS optimization exclusions.

I use NextGen Galleries and a lot of JS is not aggregated/ minified?

NextGen Galleries does some nifty stuff to add JavaScript. In order for Autoptimize to be able to aggregate that, you can either disable Nextgen Gallery’s resourced manage with this code snippet add_filter( 'run_ngg_resource_manager', '__return_false' ); or you can tell Autoptimize to initialize earlier, by adding this to your wp-config.php: define("AUTOPTIMIZE_INIT_EARLIER","true");

¿Qué es noptimize?

Starting with version 1.6.6 Autoptimize excludes everything inside noptimize tags, e.g.:
<!--noptimize--><script>alert(‘this will not get autoptimized’);</script><!--/noptimize-->

You can do this in your page/ post content, in widgets and in your theme files (consider creating a child theme to avoid your work being overwritten by theme updates).

Can I change the directory & filename of cached autoptimize files?

Yes, if you want to serve files from e.g. /wp-content/resources/aggregated_12345.css instead of the default /wp-content/cache/autoptimize/autoptimize_12345.css, then add this to wp-config.php:

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

¿Funciona esto con WP_CONTENT_URL no predeterminado?

No, Autoptimize no admite una WP_CONTENT_URL no predeterminada, pero esto se puede lograr con un par de líneas de código conectadas a la API de Autoptimize.

Can the generated JS/ CSS be pre-gzipped?

Yes, but this is off by default. You can enable this by passing ´true´ to ´autoptimize_filter_cache_create_static_gzip´. You’ll obviously still have to configure your webserver to use these files instead of the non-gzipped ones to avoid the overhead of on-the-fly compression.

¿Qué hace «Eliminar los emojis»?

This new option in Autoptimize 2.3 removes the inline CSS, inline JS and linked JS-file added by WordPress core. As such is can have a small positive impact on your site’s performance.

¿Es útil «quitar las cadenas de consulta»?

Although some online performance assessment tools will single out «query strings for static files» as an issue for performance, in general the impact of these is almost non-existant. As such Autoptimize, since version 2.3, allows you to have the query string (or more precisely the «ver»-parameter) removed, but ticking «remove query strings from static resources» will have little or no impact of on your site’s performance as measured in (milli-)seconds.

¿(Cómo) debería optimizar las Google Fonts?

Las Google Fonts se cargan normalmente mediante un archivo CSS enlazado que bloquea la carga. Si tienes un tema y plugins que utilizan Google Fonts, es posible que acabes con varios de estos archivos CSS. Autoptimize (desde la versión 2.3) ahora te permite reducir el impacto de las Google Fonts eliminándolas por completo u optimizando la forma en que se cargan. Hay dos tipos de optimización: la primera es «combinar y enlazar», que reemplaza todas las solicitudes de Google Fonts por una sola solicitud, que seguirá bloqueando la carga, pero permitirá que las fuentes se carguen inmediatamente (lo que significa que no verás que las fuentes cambien mientras se esté cargando la página). La alternativa es «combinar y cargar asíncronamente», lo que utiliza JavaScript para cargar las fuentes de una manera que no bloquee la carga, pero que podría causar un «flash de texto sin estilo».

¿Debería usar la «preconexión»?

Preconnect is a somewhat advanced feature to instruct browsers (if they support it) to make a connection to specific domains even if the connection is not immediately needed. This can be used e.g. to lessen the impact of 3rd party resources on HTTPS (as DNS-request, TCP-connection and SSL/TLS negotiation are executed early). Use with care, as preconnecting to too many domains can be counter-productive.

When can(‘t) I async JS?

JavaScript files that are not autoptimized (because they were excluded or because they are hosted elsewhere) are typically render-blocking. By adding them in the comma-separated «async JS» field, Autoptimize will add the async flag causing the browser to load those files asynchronously (i.e. non-render blocking). This can however break your site (page), e.g. if you async «js/jquery/jquery.min.js» you will very likely get «jQuery is not defined»-errors. Use with care.

¿Cómo funciona la optimización de imágenes?

Cuando la optimización de imágenes está activada, Autoptimize buscará archivos png, gif, jpeg (.jpg) en las etiquetas de las imágenes y en los archivos CSS que se cargan desde tu propio dominio y cambiará el «src» (origen) al ShortPixel CDN para ellas. Importante: esto solo puede funcionar para imágenes disponibles públicamente, de lo contrario, el proxy de optimización de imágenes no podrá obtener la imagen para optimizarla, por lo que, los corta fuegos, proxies, la protección por contraseña o, incluso, la prevención de enlazado, podrían romper la optimización de las imágenes.

¿Puedo usar la optimización de imágenes para mi intranet/sitio protegido?

No, la optimización de la imagen depende de la capacidad del servicio externo de optimización de imágenes para obtener la imagen original de tu sitio, optimizarla y guardarla en el CDN. Si tus imágenes no pueden ser descargadas por visitantes anónimos (debido a un cortafuegos/proxy/protección por contraseña/protección de enlazado), la optimización de las imágenes no funcionará.

¿Dónde puedo saber más sobre optimización de imágenes?

Echa un vistazo a la FAQ de ShortPixel.

¿Puedo desactivar la escucha de Autoptimize sobre las purgas de la caché de páginas?

As from AO 2.4 AO «listens» to page cache purges to clear its own cache. You can disable this behavior with this filter;

add_filter('autoptimize_filter_main_hookpagecachepurge','__return_false');

Algunos de los caracteres no ASCII se pierden después de la optimización

By default AO uses non multibyte-safe string methods, but if your PHP has the mbstring extension you can enable multibyte-safe string functions with this filter;

add_filter('autoptimize_filter_main_use_mbstring', '__return_true');

No puedo conseguir que Critical CSS funcione

Check the FAQ on the (legacy) «power-up» here, this info will be integrated in this FAQ at a later date.

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.

¿Qué hace «activar fallbacks 404»? ¿Por qué necesitaría esto?

Autoptimize almacena en caché los archivos agregados y CSS/ JS optimizados y los enlaces a esos archivos almacenados en caché se guardan en el HTML, que se almacenará en una caché de página (que puede ser un plugin, puede ser a nivel de host, puede ser de terceros, en la caché de Google, en un navegador). Si hay HTML en la caché de una página que enlaza con CSS/ JS autooptimizados que se han eliminado mientras tanto (cuando se vació la caché), la página de la caché no se verá/funcionará como se esperaba, ya que el CSS o el JS no se encontraron (un error 404).

This setting aims to prevent things from breaking by serving «fallback» CSS or JS. The fallback-files are copies of the first Autoptimized CSS & JS files created after the cache was emptied and as such will based on the homepage. This means that the CSS/ JS migth not apply 100% on other pages, but at least the impact of missing CSS/ JS will be lessened (often significantly).

When the option is enabled, Autoptimize adds an ErrorDocument 404 to the .htaccess (as used by Apache) and will also hook into WordPress core template_redirect to capture 404’s handled by WordPress. When using NGINX something like below should work (I’m not an NGINX specialist, but it does work for me);

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

Y este es un buen enfoque alternativo (proporcionado por 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;
}

¿Qué software / proyectos de código abierto se utilizan en Autoptimize?

Los siguientes grandes proyectos de código abierto se utilizan en Autoptimize de una forma u otra:

Where can I get help?

You can get help on the wordpress.org support forum. If you are 100% sure this your problem cannot be solved using Autoptimize configuration and that you in fact discovered a bug in the code, you can create an issue on GitHub. If you’re looking for premium support, check out our Autoptimize Pro Support and Web Performance Optimization services.

No quiero seguir usándolo, ¿cómo debería eliminar Autoptimize?

  • Desactivar el plugin (esto eliminará las opciones y la caché)
  • Eliminar el plugin
  • Clear any cache that might still have pages which reference Autoptimized CSS/JS (e.g. of a page caching plugin such as WP Super Cache)

¿Cómo puedo ayudar/ contribuir?

Just fork Autoptimize on Github and code away!

Reseñas

19 de febrero de 2024 1 respuesta
With Autoptimize the performance of my websites improves and in case of problems their assistance is very helpful.
12 de febrero de 2024 1 respuesta
Not that much to add. It's simply the best (free) plugin to optimize and speed up your website. It works well and has a lot of feature to go deeper and optimize even more. Plus: the support here on the wordpress.org forum is one of the best out here. Keep up the good work!
2 de febrero de 2024 1 respuesta
I was having a plugin conflict because of an unrelated plugin and the Autoptimize plugin author was extremely quick to reply to my support thread and help me work out an extensive series of steps to best optimize the website and work around this conflict. I deeply appreciated this selfless support that went above and beyond any initial expectations. I am happy to have Autoptimize working and speeding things up!
1 de febrero de 2024 1 respuesta
It does the opposite of what it purports to do. It made my site way slower.
Leer todas las 1.402 reseñas

Colaboradores y desarrolladores

«Autoptimize» es un software de código abierto. Las siguientes personas han colaborado con este plugin.

Colaboradores

«Autoptimize» está traducido en 32 idiomas. Gracias a los traductores por sus contribuciones.

Traduce «Autoptimize» a tu idioma.

¿Interesado en el desarrollo?

Revisa el código , echa un vistazo al repositorio SVN o suscríbete al registro de desarrollo por RSS.

Registro de cambios

3.1.11

3.1.10

  • improvement: with «don’t aggregate but defer» and «also defer inline JS» on, also defer JS that had the async flag to avoid the (previously) asynced JS from executing before the inline JS has ran.
  • improvement: show option to disable the default on «compatibility logic».
  • fix for regression in 3.1.9 which caused JetPack Image optimization not working even if image optimization was off in AO.
  • API: some extra hooks in critical CSS to enable others (and AOPro) to act on changes in critical CSS rules
  • some other minor changes/ improvements/ filters, see the GitHub commit log.

3.1.9

  • improvement: activate JS, CSS & HTML optimization upon plugin activation (hat tip to Adam Silverstein (developer relations engineer at Google))
  • improvement: also defer asynced JS (to ensure execution order remains intact; asynced JS should not execute before deferred inline JS which it might depend upon)
  • improvement: exclude images from being lazyloaded if they have fetchpriority attribute set to high (as done by WordPress core since 6.3)
  • bugfix: disable spellcheck on CSS textarea’s (above the fold CSS/ critical CSS) which in some cases caused browser issues
  • add tab to explain Autoptimize Pro.
  • confirmed working with WordPress 6.4 (beta 3)
  • some other minor changes/ improvements/ filters, see the GitHub commit log.

3.1.8.1

  • urgent fix for PHP error, sorry about that!

3.1.8

  • Images: improve optmization logic for background images
  • Critical CSS: don’t trigger custom_post rule if not is_singular + adding debug logging for rule selection
  • some other minor changes/ improvements/ filters, see the GitHub commit log.

3.1.7

  • security: improve validation (import) and sanitization (output) of critical CSS rules, to fix a medium severity Admin+ Stored Cross-Site Scripting vulnerability as reported by WP Scan Security.

3.1.6

  • CSS: removing trailing slashes in <link tags for more W3 HTML validation love
  • Extra: also dequeue WooCommerce block CSS if «remove WordPress block CSS» option is active
  • imgopt: also act on non-aggregated inline CSS
  • imgopt: added logic to warn users if Shortpixel can’t reach their site
  • backend: AO toolbar JS/ CSS is finally minified as well.
  • explicitly disable optimization of login pages
  • some other minor changes/ improvements/ filters, see the GitHub commit log.

3.1.5

  • improvements to JSMin by Robert Ehrenleitner (big thanks Robert!).
  • do not consider jquery.js as minified any more (WordPress now uses jquery.min.js by default and jquery.js is the unminified version).
  • fix for «undefined array key» PHP errors in autoptimizeCriticalCSSCron.php
  • some other minor changes/ improvements/ filters, see the GitHub commit log.

3.1.4

  • Improvement: when all CSS is inlined, try doing so after SEO meta-tags (just before ld+json script tag which most SEO plugins add as last item on their list).
  • Img opt: also optimize images set in data-background and data-retina attributes (+ filter to easily add other attributes)
  • CSS opt: filter to enable AO to skip minification of calc formulas in CSS (as the CSS minifier on rare occasions breaks those)
  • Multiple other filters added
  • Some other minor changes/ improvements/ filters, see the GitHub commit log.

3.1.3

  • Multiple fixes for metabox LCP image preloads (thanks Kishorchand for notifying & providing a staging environment to debug on).
  • Fix in revslider compatibility (hat tip Waqar Ahmed for reporting & helping out ).
  • No image optimization or criticalcss attempts on localhost installations any more + notification of that fact if localhost detected.
  • Some other minor changes/ improvements/ filters, see the GitHub commit log.

3.1.2

  • Google Fonts: some more removal logic
  • fix for 404 fallback bug (hat tip to Asif for finding & reporting)
  • Some other minor changes/ improvements/ filters, see the GitHub commit log.

3.1.1.1

  • Quick workaround for an autoload conflict with JetFormBuilder (and maybe other Crocoblock plugins?) that causes a critical error on the AO settings page.

3.1.1

  • images: when optimizing images and lazyloading is on, then by default do not set an LQIP (low quality image placeholder) any more (reason: it might look nice but it comes with a small-ish perf. penalty). This can be re-enabled by returning true to the autoptimize_filter_imgopt_lazyload_dolqip filter.
  • security: further improvements to critical CSS settings page (again with the great assistance of WPScan Security).
  • some other minor changes/ improvements/ filters, see the GitHub commit log.

3.1.0

  • new HTML sub-option: «minify inline CSS/ JS» (off by default).
  • new Misc option: permanently allow the «do not run compatibility logic» flag to be removed (which was set for users upgrading from AO 2.9.* to AO 3.0.* as the assumption was things were working anyway).
  • security: improvements to the critical CSS settings page to fix authenticated cross site scripting issues as reported by WPScan Security.
  • bugfix: «defer inline JS» of very large chunks of inline JS could cause server errors (PCRE crash actually) so not deferring if string is more then 200000 characters (filter available).
  • some other minor changes/ improvements/ hooks, see the GitHub commit log

3.0.4

  • fix for «undefined array key ao_post_preload” on post/ page edit screens
  • fix for image optimization altering inline JS that contains an <img tag if lazyload is not active
  • improvements to exit survey
  • confirmed working with WordPress 6.0

3.0.3

  • fix for images being preloaded without this being configured when lazyload is on and per page/post settings are off.
  • ensure critical CSS schedule is always known.
  • when deferring non-aggregated JS, make the optimatization exclusions take the full script-tag into account instead of just the src URL.

3.0.2

  • rollback automatic «minify inline CSS/ JS» which broke more then expected, this will come back as a separate default off option later and can now be enabled with a simple filter: add_filter( 'autoptimize_html_minify_inline_js_css', '__return_true'); .
  • fix for «Call to undefined method autoptimizeOptionWrapper::delete_option()» in autoptimizeVersionUpdatesHandler.php

3.0.1

  • fix for minification of inline script with type text/template breaking the template (e.g. ninja forms), hat tip to @bobsled.
  • fix for regression in import of CSS-files where e.g. fontawesome CSS was broken due to being escaped again with help of @bobsled, thanks man!

3.0.0

  • fundamental change for new installations: by default Autoptimize will not aggregate JS/ CSS any more (HTTP/2 is ubiquitous and there are other advantages to not aggregating esp. re. inline JS/ CSS and dependancies)
  • new: no API needed any more to create manual critical CSS rules.
  • new: «Remove WordPress blocks CSS» option on the «Extra» tab to remove block- and global styles (and SVG).
  • new: compatibility logic for «edit with elementor», «revolution slider», for non-aggregated inline JS requiring jQuery even if not excluded (= auto-exclude of jQuery) and JS-heavy WordPress blocks (Gutenberg)
  • new: configure an image to be preloaded on a per page/ post basis for better LCP.
  • improvement: defer inline now also allowed if inline JS contains nonce or post_id.
  • improvement: settings export/ import on critical CSS tab now takes into account all Autoptimize settings, not just the critical CSS ones.
  • technical improvement: all criticalCSS classes were refactored, removing use of global variables.
  • technical improvement: automated unit tests on Travis-CI for PHP versions 7.2 to 8.1.
  • fix: stop Divi from clearing Autoptimize’s cache which is pretty counter-productive.
  • misc smaller fixes/ improvements, see the GitHub commit log

older