Autoptimize

Beschreibung

Autoptimize macht das Optimieren deiner Website leicht. Es kann Zusammenfügen, Minimieren, Skripte und Stile cachen, CSS standardmäßig in den head-Bereich der Seite einfügen und es kann Skripte in den Footer verschieben und verzögern. Es minimiert auch den HTML-Code selbst, was deine Seite zu einem Leichtgewicht macht. Es gibt erweiterte Optionen und eine umfangreiche API, die es dir ermöglicht, Autoptimize für jedwede bestimmte Anforderung einer Website anzupassen. Es kann sogar die Leistung deiner Website steigern, wenn du sie mit HTTP/2 betreibst!

Falls dir Geschwindigkeit wichtig ist, solltest du eines der großartigen Caching-Plugins einsetzen, um Seiten zu cachen. Einige gute Kandidaten, die Autoptimize auf diese Weise ergänzen sind z.B. WP Super Cache, HyperCache, Comet Cache oder KeyCDN’s Cache Enabler.

Premium Support
We provide great Autoptimize Pro Support and Web Performance Optimization services, check out our offering on (http://autoptimize.com/)!

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

Installation

Installiere einfach über „Plugins hinzufügen“ in WordPress und alles wird gut sein. Eine manuelle Installation ist ebenfalls sehr unkompliziert:

  1. Lade die zip-Datei hoch und entpacke sie im /wp-content/plugins/ Verzeichnis
  2. Aktiviere das Plugin im „Plugins“-Menü in WordPress.
  3. Gehe zu Einstellungen > Autoptimize und aktiviere die gewünschten Optionen. Normalerweise bedeutet dies „Optimiere HTML/ CSS/ JavaScript“.

FAQ

Installationsanleitung

Installiere einfach über „Plugins hinzufügen“ in WordPress und alles wird gut sein. Eine manuelle Installation ist ebenfalls sehr unkompliziert:

  1. Lade die zip-Datei hoch und entpacke sie im /wp-content/plugins/ Verzeichnis
  2. Aktiviere das Plugin im „Plugins“-Menü in WordPress.
  3. Gehe zu Einstellungen > Autoptimize und aktiviere die gewünschten Optionen. Normalerweise bedeutet dies „Optimiere HTML/ CSS/ JavaScript“.
Was macht das Plugin, um dabei zu helfen meine Website zu beschleunigen?

Es verbindet alle Skripte und Styles, minimiert und komprimiert sie, fügt Expires-Headers hinzu, cacht diese, und verschiebt Styles in den Head der Seite, und Skripte (optional) in den Footer. Es minimiert auch den HTML Code selbst, was deine Seite zu einem richtigen Leichtgewicht macht.

Ich bin schon auf HTTP/2, brauche ich da Autoptimize noch?

HTTP/2 ist sicherlich ein großer Schritt nach vorne, reduziert es doch die Last bei mehreren Anfragen vom selben Server deutlich, indem dieselbe Verbindung mehrere gleichzeitige Anfragen verarbeiten kann. Das Zusammenfügen von CSS/ JS kann noch immer sehr sinnvoll sein, nachzulesen in diesem css-tricks.com-Beitrag und in diesem Blog-Beitrag eines Ebay-Technikers. Die Schlussfolgerung: Konfiguriere, teste, konfiguriere um, teste erneut, verfeinere und finde heraus, was in deinem Kontext am Besten funktioniert. Vielleicht ist es reines HTTP/2, vielleicht HTTP/2 + Zusammenführung und Minimierung, vielleicht HTTP/2 + Minimierung (was AO auch beherrscht).

Wird das mit meinem Blog funktionieren?

Auch wenn Autoptimize ohne jegliche Garantien daherkommt, wird es normalerweise reibungslos laufen, wenn du es korrekt konfigurierst. Siehe „Fehlerbehebung“ unten für Informationen wie du es im Fall von Problemen konfigurierst.

Warum jquery.js nicht optimiert wird

Beginnend mit AO 2.1 wird das jquery.js des WordPress-Core aus dem einfachen Grund nicht optimiert, dass viele beliebte Plugins Inline JS erzeugen, das nicht zusammengefügt wird (wegen möglicher Probleme mit der Cachegröße bei einmaligem Code in Inline JS), welches von jquery abhängig ist. Das Ausschließen von jquery.js stellt sicher, dass die meisten Websites auf Anhieb funktionieren. Falls du möchtest, kannst du auch jquery optimieren, du kannst es von der JS-Optimierungs-Ausschlußliste löschen (Du musst vielleicht „Auch inline JS zusammenfügen“ aktivieren, sowie „Erzwinge JavaScript im head“ ).

Why is Autoptimized JS render blocking?

If not „forced in head“, Autoptimized JS is not render blocking as it has the „defer“ flag added. It is however possible another plugin removes the „defer“-flag. Speed Booster Pack was reported doing this, but the behavior has not been confirmed yet.

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.

Was ist der Nutzen von „inline oder verzögertem CSS“?

CSS sollte üblicherweise im Head des Dokumentes stehen. Seit kurzem empfiehlt unter anderem Google das verzögerte Ausliefern von nicht-essentiellem CSS, während die Styles inline benötigt werden, um die Seite „above the fold“ aufzubauen. Dies ist besonders wichtig, um Seiten auf Mobilgeräten so schnell wie möglich zu rendern. Seit Autoptimize 1.9.0 ist das leicht; wähle „Inline und Defer CSS“, kopiere den „above the fold“-Block in das Eingabefeld (Textfeld) und du kannst loslegen!

Aber wie finde ich heraus was das „above the fold CSS“ ist?

Es gibt keine einfache Lösung, weil der Bereich „above the fold“ von der Bildschirmgröße abhängt. Es gibt trotzdem verfügbare Tools, die versuchen herauszufinden, was „above the fold“ ist. Diese Liste von Tools ist ein guter Startpunkt. http://jonassebastianohlsson.com/criticalpathcssgenerator/ ist eine gute Grundlösung http://criticalcss.com/ ist eine Premium-Lösung desselben Entwicklers. Alternativ kann auch dieses Bookmarklet (nur für Chrome) hilfreich sein.

Oder sollte man alles CSS inline setzen?

Kurze Antwort: Wahrscheinlich nicht.

Früher war CSS-Optimierung leicht; platziere alles CSS in deinen Head, füge alles in eine CSS-Datei pro Medientyp zusammen und du konntest loslegen. Aber seitdem Google Mobilgeräte in PageSpeed Insights integriert hat und damit begann, sich über CSS zu beklagen, dass den Seitenaufbau blockiert, kamen die Dinge durcheinander (siehe „CSS verzögern“ an anderer Stelle der FAQ). Eine der Lösungen ist all dein CSS inline zu setzen, was seit Autoptimize 1.8.0 unterstützt wird.

Das Inlining des gesamten CSS hat einen klaren Vorteil (besseren PageSpeed Wert) und einen großen Nachteil; deine HTML Seite wird signifikant anwachsen und falls du viel CSS einsetzt, wird Pagespeed Insights sich über „roundtrip times“ beschweren. Auch wenn du dir einen Test ansiehst, der mehrere Abrufe (sagen wir 5 Seiten) beinhaltet, wird die Geschwindigkeit niedriger sein, da die CSS-Last immer und immer wieder gesendet wird, währenddessen die ausgelagerten CSS-Dateien nicht mehrmals gesendet werden, da sie sich im Cache befinden.

So the choice should be based on your answer to some site-specific questions; how much CSS do you have? How many pages per visit do your visitors request? If you have a lot of CSS or a high number of pages/ visit, it’s probably not a good idea to inline all CSS.

Du kannst zu diesem Thema mehr Information finden in diesem Blog Post.

Mein Cache wird riesig, leert Autoptimize nicht den Cache?

Autoptimize hat keinen wirksamen Mechanismus für das Leeren des Caches, da dies auch optimiertes CSS/JS entfernen könnte, worauf sich andere Caches noch beziehen, was deine Website unbrauchbar machen würde. Außerdem ist ein schnell wachsender Cache ein Anzeichen für andere zu vermeidende Probleme.

Du kannst die Cachegröße stattdessen auf einem akzeptablen Wert halten entweder durch:

  • Abschalten der Optionen „Inline JS zusammenfügen“- und/oder „Inline CSS zusammenfügen“
  • Ausschluß von JS-Variablen (oder manchmal CSS-Selektoren), welche sich pro Seite ändern (oder Seitenladevorgang). Du erfährst, wie du das tun kannst, in diesem Blog-Beitrag.

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.

Upon updating Autoptimize can’t be reactivated

I have not been able to reproduce this, but had 2 users reporting that they had to temporarily disable W3 Total Cache to be able to re-activate the updated Autoptimize. No idea why this is happening, but this might help if you encounter that problem.

„Clear cache“ doesn’t seem to work?

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.

Moreover don’t worry if your cache never is down to 0 files/ 0KB, as Autoptimize (as from version 2.2) will automatically preload the cache immediately after it has been cleared to speed further minification significantly up.

Can I still use Cloudflare’s Rocket Loader?

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.

I tried Autoptimize but my Google Pagespeed Scored barely improved

Autoptimize is not a simple „fix my Pagespeed-problems“ plugin; it „only“ aggregates & minifies (local) JS & CSS 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, image optimization and your webserver configuration, which will improve real performance (again, load time as measured by e.g. https://webpagetest.org) and your „performance best practise“ pagespeed ratings.

Sollte ich also CSS/JS inline zusammenfügen?

Vor Autoptimize 2.0.0 wurde Inline Code immer optimiert, aller CSS-Code in den head-Bereich verschoben und aller JS-Code mit defer-flag an das Ende. Das hat häufig 2 Probleme verursacht: Die Priorität von Inline CSS ging verloren und Inline CSS konnte seiten- oder Anfrage-spezifischen Code beinhalten, was den Caching-Mechanismus von Autoptimize gestört hat und zu einer zu großen Anzahl gecachter Dateien geführt hat und die Minimierung lief wieder und wieder. Deshalb wird seit AO 2.0 Inline Code standardmäßig nicht optimiert (mit Ausnahme derer, die eine alte Version aktualisieren). Zusätzlich wird js/jquery/jquery.js standardmäßig ausgeschlossen, um Probleme mit Inline JS zu vermeiden, wenn jquery nicht verfügbar ist.

Was kann ich mit der API anfangen?

Eine ganze Menge, es gibt Filter, die du benutzen kannst, um Autoptimize auf Anfrage zu deaktivieren, die CSS- und JS-Ausschlüsse zu ändern, die Grenze für das Inlining für CSS background-Bilder zu ändern, zu definieren, welche JS-Dateien hinter die zusammengefügten geschoben werden, das defer-Attribut der zusammengefügten JS-Skript-Tags zu ändern, … Es gibt Beispiele für einige Filter in der autoptimize_helper.php_example und in diesen FAQ.

Wie kann ich den Code in autoptimize_helper.php_example nutzen?

Auch wenn du diesen Code der functions.php deines Themes hinzufügen kannst, würde er beim nächsten Theme Update überschrieben werden. Daher ist es besser ein eigenes Hilfsplugin zu erstellen oder einfach das Code Snippets Plugin benutzen, um jeglichen eigenen Code zu verwalten.

Wie funktioniert ein CDN?

Seit Version 1.7.0 ist CDN aktiviert sobald das CDN Stammverzeichnis eingegeben wurde (z.B. http://cdn.example.net/wordpress/). Falls dieser URL vorliegt, wird er für alle von Autoptimize generierten Dateien benutzt (z.B. verknüpftes CSS und JS), inklusive Hintergrundbilder innerhalb von CSS (falls du nicht data-uri’s benutzt).

Falls deine hochgeladenen Bilder ebenso auf dem CDN liegen sollen, kannst du den upload_url_path deiner WordPress Konfiguration (/wp-admin/options.php) zum CDN-Upload-Zielverzeichnis ändern (z.B. http://cdn.example.net/wordpress/wp-content/uploads/). Bedenke dass dies nur für Bilder funktioniert die von da an hochgeladen werden, nicht für bereits hochgeladene Bilder. Danke an BeautyPirate für den Tipp!

Warum werden meine Fonts nicht per CDN ausgeliefert?

Autoptimize unterstützt das, aber es ist nicht standardmäßig aktiv, weil nicht lokale Fonts evtl eine extra Konfiguration benötigen. Aber wenn deine cross-origin Anfrage Strategie in Ordnung ist, kannst du Autoptimize anweisen die Fonts dem CDN hinzuzufügen durch Hook in die API, durch Setzen von autoptimize_filter_css_fonts_cdn auf true auf folgende Art;

add_filter('autoptimize_filter_css_fonts_cdn',__return_true);
Ich nutze Clouflare, was sollte ich als CDN-Stammverzeichnis eingeben?

Nichts, wenn du bei Cloudflare bist, ist dein autoptimiertes CSS/JS bei Cloudflare automatisch auf dem Cloudflare-CDN.

Wie kann ich erzwingen, dass die zusammengefügten Dateien statisches CSS oder JS anstelle von PHP sind?

Falls dein Webserver ordentlich konfiguriert ist, um mit Kompression (gzip oder deflate) und cache expiry (Expire und Cache-Steuerung mit ausreichender Cache-Möglichkeit) umzugehen, brauchst du Autoptimize nicht, um das für dich zu regeln. In diesem Fall kannst du die „Zusammengefügte CSS / Skript-Dateien als statische Dateien speichern?“-Option wählen, welche Autoptimize zwingt, die zusammengefügten Dateien als .css und .js-Dateien zu speichern (das bedeutet es wird kein PHP benötigt um diese Dateien auszuliefern). Diese Einstellung ist der Standard seit Autoptimize 1.8.

Wie funktioniert das „Ausschliessen von der Optimierung“?

Sowohl CSS- wie auch JS-Optimierung kann Code von der Zusammenführung und Minimierung auslassen, durch Hinzufügen von „Identifikatoren“ zu der Komma getrennten Ausschlussliste. Die exakte Identifizierungszeichenfolge kann auf folgende Arten bestimmt werden:

  • Falls du nur eine spezifische Datei ausschliessen willst, z.B. wp-content/plugins/funkyplugin/css/style.css, kannst du einfach „funkyplugin/css/style.css“ ausschliessen
  • Falls du alle Dateien eines bestimmten Plugins ausschliessen möchtest, z.B. wp-content/plugins/funkyplugin/js/*, kannst du z.B. „funkyplugin/js/“ oder „plugins/funkyplugin“ ausschliessen
  • Falls du inline code ausschliessen möchtest, musst du eine spezifischen, einzigartige Zeichenfolge in diesem Teil des Codes finden und diesen zu der Ausschlussliste hinzufügen. Beispiel: Um <script>funky_data='Won\'t you take me to, Funky Town'</script> auszuschliessen, wäre der Identifikator „funky_data“.
Konfiguration & Fehlerbehebung von Autoptimize

Nachdem das Plugin installiert und aktiviert ist, kannst du auf einer Einstellungsseite HTML, CSS und JavaScript Optimierungen einschalten. Wenn du magst, kannst du einfach alle davon einschalten, oder wenn du vorsichtiger bist eine nach der anderen.

Falls dein Blog nach dem Einschalten von Autoptimize nicht normal funktioniert, sind hier ein paar Hinweise, um solche Vorkommnisse zu identifizieren & zu lösen, unter Benutzung der „Erweiterten Einstellungen“:

  • Falls alles funktioniert, du aber feststellst, dass dein Blog langsamer ist, stelle sicher, dass du ein Caching Plugin (WP Super Cache oder ähnliche) hast und kontrolliere auch die Informationen über die Cachegröße (Die Lösung für dieses Problem betrifft auch die Geschwindigkeit ungecachter Seiten) in den FAQ.
  • Falls dein Blog seltsam aussieht, z.B. wenn das Layout durcheinander gerät, liegt ein Problem mit der CSS-Optimierung vor. In diesem Fall kann du die Option „Nur im Head nach CSS suchen?“ wählen und schauen, ob dies das Problem löst. Du kannst auch erzwingen, dass CSS nicht zusammengefügt wird, indem du es in deinem Theme oder Widget in noptimize-Tags packst oder den Dateinamen (für externe Style-Dateien) oder die Zeichenfolgen (für Inline-Styles) zu der Ausschlussliste hinzufügst.
  • Falls die Funktionalität deiner Website gestört ist (ein Slider-Karussell, ein Menü, das Suchfeld, …) hast du es vermutlich mit einem Problem bei der Optimierung von JavaScript zu tun. Deaktiviere die Option „Auch inline JS zusammenfügen“ und aktiviere „JavaScript im Head erzwingen?“ und versuche es erneut. Das Ausschliessen von ´js/jquery/jquery.js´ von der Optimierung (siehe unten) und optional das Aktivieren von „Try-Catch Block hinzufügen?„) kann auch helfen. Alternativ – für die Technikversteher – kannst du spezifische Skripte von der Behandlung durch Autoptimize ausschließen (verschieben und/oder zusammenfügen), indem du eine Zeichenfolge hinzufügst, die dem störenden Javascript entspricht oder innerhalb deiner Template-Dateien oder Widgets durch Einschließen des Codes zwischen noptimize-Tags. Das Identifizieren des störenden JavaScript und die Wahl der korrekten Ausschluss-Zeichenfolge kann durch Ausprobieren erfolgen, aber in der Mehrheit der Fälle können Probleme mit der JavaScript Optimierung auf diese Weise behoben werden. Beim Debuggen von JavaScript-Problemen ist die Fehlerkonsole des Browsers das wichtigste Tool, das dir dabei hilft zu verstehen, was vor sich geht.
  • Falls dein Theme oder Plugin jQuery benötigt, kannst du entweder das Laden im Head erzwingen und/oder jquery.js (und jQuery-Plugins falls benötigt) ausschliessen.
  • Falls du keine CSS oder JS Optimierungen zum Laufen bringst, kannst du natürlich immer noch die beiden anderen Optimierungstechniken benutzen.
  • Falls du die obigen Fehlerbehebungs-Tipps versucht hast und du noch immer nicht CSS und JS zum laufen bekommst, kannst du im WordPress Autoptimize Support-Forum nach Hilfe fragen. Weiter unten findest du eine Beschreibung, welche Information du in deinem „Problem-Ticket“ angeben solltest.
Hilfe, ich erhalte eine weiße Seite oder einen „internal server error“ nach dem Aktivieren von Autoptimize!

Als erstes stelle sicher, dass du keine anderen HTML, CSS oder JS Minimierung Plugins (BWP minify, WP minify, …) gleichzeitig mit Autoptimize benutzt oder deaktiviere diese Funktionalität deiner Caching Plugins ab (W3 Total Cache, WP Fastest Cache, …).

In einigen seltenen Fällen stürzt die CSS Minimierungs-Komponente, die Autoptimize derzeit benutzt, aufgrund fehlender Ressourcen ab (siehe detaillierte technische Erklärung hier). In diesem Fall kannst du entweder die CSS-Optimierung deaktivieren, versuchen spezifisches CSS von der Zusammenführung auszuschliessen oder die veralteten Minimieren aktivieren, welche dieses Problem nicht haben. Letzteres kann durch folgende Hinzufügung zu deiner wp-config.php durchgeführt werden:

define("AUTOPTIMIZE_LEGACY_MINIFIERS","true");

Die „veralteten Minimierer“ werden „für immer“ in Autoptimize bleiben und Änderungen der wp-config.php werden nicht durch Core-, Theme- oder Plugin-Upgrades beeinflusst, also sollte es einfach funktionieren.

Aber ich habe immer noch leere autoptimierte CSS oder JS-Dateien!

Falls du Apache laufen hast, kann in manchen Fällen die von Autoptimize geschriebene htaccess-Datei Konflikte mit den AllowOverrides-Einstellungen deiner Apache-Konfiguration auslösen (das ist der Fall bei der Standard-Konfiguration mancher Ubuntu-Installationen), was bei autoptimierten CSS- und JS-Dateien zu „Internen Serverfehlern“ führen kann. Dies kann durch Setzen der AllowOverrides auf All gelöst werden.

Ich bekomme keinen Fehler, aber meine Seiten sind überhaupt nicht optimiert?

Autoptimize macht einige Tests, bevor es tatsächlich optimiert. Wenn eine der folgenden Bedingungen zutrifft, werden deine Seiten nicht optimiert:

  • 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 und ähnliche Page Builder Lösungen sind defekt!!

Deaktiviere diese Option, damit Autoptimize für angemeldete Benutzer aktiv ist und leg los mit „Draggen und Droppen“ 😉

Hilfe, das Bezahlen in meinem Shop funktioniert nicht mehr!!

Deaktiviere diese Option, um die Warenkorb- oder Checkout-Seiten (funktioniert mit WooCommerce, Easy Digital Downloads und WP eCommerce) zu optimieren.

Revolution Slider läuft nicht mehr!

Stelle sicher, dass js/jquery/jquery.js sich in der Komma-separierten Liste von JS-Optimierungs-Ausnahmen befindet (in der Standard-Konfiguration ist es nicht enthalten).

Ich erhalte Fehler „jQuery is not defined“-Fehler

In diesem Fall hast du nicht zusammengeführtes JavaScript, das zum Laden jQuery benötigt. Füge dafür js/jquery/jquery.js zur Komma-separierten Liste von JS-Optimierungs-Ausnahmen hinzu.

Mein autoptimiertes CSS/JS ist defekt nach dem Upgrade von 2.1 auf 2.2!

Eine der größten Änderungen in Autoptimize 2.2 ist, dass es zuerst minimiert und erst dann zusammenführt, was große Leistungsvorteile bringt. Obwohl dies ausgesprochen gründlich getestet wurde, ist es möglich, dass dieses Konzept nicht immer funktioniert. Dieses Vorgehen lässt sich abschalten, indem Du dich wie folgt in die API von Autoptimize einhakst:

add_filter('autoptimize_filter_speedupper','__return_false');
Ich nutze NextGen Galleries und eine Menge JS ist nicht zusammengeführt/ minimiert?

NextGen Galleries tut raffinierte Dinge, um JavaScript hinzuzufügen. Damit Autoptimize in der Lage ist, dies trotzdem zusammenzufassen, kannst du entweder Nextgen Gallerys Ressourcen-Verwaltung mit diesem Codeschnipsel abschalten: add_filter( 'run_ngg_resource_manager', '__return_false' );. Oder du kannst Autoptimize an einem früheren Punkt starten, indem du diesen Code zu deiner wp-config.php hinzufügst: define("AUTOPTIMIZE_INIT_EARLIER","true");

Was ist noptimize?

Seit Version 1.6.6 schließt Autoptimize alles innerhalb von noptimize tags aus, z.B:
<!–noptimize–><script>alert(‚this will not get autoptimized‘);</script><!–/noptimize–>

Du kannst das im Inhalt einer Seite/Beitrag tun, in Widgets und in deinen Theme-Dateien (Bedenke das Erstellen eines Child Themes, um zu verhindern, dass deine Änderungen durch Theme Updates überschrieben werden).

Kann ich den Ordner & Dateinamen der gecachten Autoptimize Dateien ändern?

Ja, falls du Dateien von z.B. /wp-content/resources/aggregated_12345.css anstelle von standardmässig /wp-content/cache/autoptimize/autoptimize_12345.css ausliefern möchtest, dann ergänze folgendes zu der wp-config.php:

define('AUTOPTIMIZE_CACHE_CHILD_DIR','/resources/');
define('AUTOPTIMIZE_CACHEFILE_PREFIX','aggregated_');
Kann das erzeugte JS/CSS mit gzip vorkomprimiert werden?

Ja, doch das ist standardmäßig deaktiviert. Du kannst es aktivieren durch die Übergabe von ´true´ an ´autoptimize_filter_cache_create_static_gzip´. Du musst offenbar auch deinen Webserver für die Benutzung dieser Dateien anstelle der nicht komprimierten konfigurieren, um die Zusatzlast durch on-the-fly-Komprimierung zu verhindern.

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.

Ich will raus, wie sollte ich Autoptimize entfernen?
  • Deaktiviere das Plugin (dies wird alle Einstellungen und den Cache löschen)
  • Entferne das Plugin
  • Lösche jeden Cache der sich evtl. auf Seiten mit Autoptimiertem CSS/JS bezieht (z.B. die eines Caching Plugins wie WP Super Cache)
Wie kann ich helfen/mich beteiligen?

Erstelle einfach einen „Fork“ für Autoptimize auf Github und programmiere los!

Rezensionen

Amazing plugin

By far the best optimization plugin on the wordpress market. If it were premium I would buy it.

Perfect for ClickBank Trust Badge javascript snippet

You deserve 6 stars!!!
That’s crazy!!!
I spent 3 days searching on google and testing many plugin to insert the „ClickBank Trust Badge javascript snippet“ in my pages (CBTB).
No one worked properly showing me the ClikBank banner…I got desperate 🙁

Customer service of clickbank didn’t help me at all. They just said „..for wordpress you have to find a solution on google..“ 🙁 …but are they serious??!!??

I spent 3 days searching and testing many solutions who didn’t work with this javascript code…but finally…

I tried Autoptimize plugin and it worked good immediately!!!

Now the ClickBank Trust Badge appear!!! 😀

I’m so happy!!! Thank you so much guys!!! 🙂

I know this plugin should be to optimize page speed and not to solve javascript visualization problem…. but it solved my javascript visualization problem so, thank you so much!!! 🙂

If some of you have the same problem with this f***ing ClickBank Trust Badge and his javascript code, first of all, install this Autoptimize plugin.

On setting page of Autoptimize plugin, set: optimize HTML, javascript and CSS. Click on „Save“.

Inside WP control panel, open the page where you want to add the javascript code and insert the code inside the „Script“ field of WP. Insert the code inside „Header Scripts“. Upload the page and watch the clickbank banner appear.

A powerful plugin

This plugin indeed does its job.

It is useful for beginners and for advanced users as well. Of course the latter will take more advantage from its functions, but it offer basic optimization of html/css without requiring any particular skill beside the basic html/css notions.

My advice is to enable the settings you need one by one, each time testing if everything is ok with your site and then enable another one, check if things are ok and so on.

Otherwise, you might end up having issues without the ability to easily understand what particular setting is causing them.

Many thanks to the developer(s) for sharing!

Great Plugin And Support

Awesome plugin that works great.

Had a small issue with another plugin clash and the creator helped me fix it straight away.

Highly recommended.

Au top

It is the best free tool for optimize your ressource (CSS and JS)

Lies alle 548 Rezensionen

Mitwirkende & Entwickler

„Autoptimize“ ist Open-Source-Software. Folgende Menschen haben an diesem Plugin mitgewirkt:

Mitwirkende

„Autoptimize“ wurde in 18 Sprachen übersetzt. Danke an die Übersetzerinnen und Übersetzer für ihre Mitwirkung.

Übersetze „Autoptimize“ in deine Sprache.

Interessiert an der Entwicklung?

Durchstöbere den Code, sieh dir das SVN Repository an oder abonniere das Entwicklungsprotokoll per RSS.

Changelog

2.2.2

  • roll-back to previous battle-tested version of the CSS minifier (a.o. fixing a bug where colors in filenames were replaced by hex-values)
  • tweaks to Autoptimize toolbar menu (visual + timeout of „delete cache“ AJAX call)
  • readme update

2.2.1

  • fix for images being referenced in CSS not all being translated to correct path, leading to 404’s as reported by Jeff Inho
  • fix for „[] operator not supported for strings“ error in PHP7.1 as reported by falk-wussow.de
  • fix for security hash busting AO’s cache in some cases (esp. in 2.1.1)

2.2.0

  • new: Autoptimize minifies first (caching the individual snippets) and aggregrates the minified snippets, resulting in huge performance improvements for uncached JS/ CSS.
  • Neu: Option zum An-/Abschalten von AO für angemeldete Benutzer (standardmäßig eingeschaltet).
  • Neu: Option zum De-/Aktivieren von AO im Warenkorb- oder Check-Out-Bereich von WooCommerce, Easy Digital Downloads oder WP eCommerce (standardmäßig aktiv).
  • improvement: switched to rel=preload + Filamentgroup’s loadCSS for CSS deferring
  • improvement: switched to YUI CSS minifier PHP-port 2.8.4-p10 (so not to the 3.x branch yet)
  • improvements to the logic of which JS/ CSS can be optimized (getPath function) increasing reliability of the aggregation process
  • security: made placeholder replacement less naive to protect against XSS and LFI vulnerability as reported by Matthew Barry and fixed with great help from Matthew and Tomas Trkulja. Thanks guys!!
  • API: Lots of extra filters, making AO (even) more flexible.
  • Lots of bugfixes and smaller improvements (see GitHub commit log)
  • tested and confirmed working in WordPress 4.8

2.1.2

  • fix for security hash busting AO’s cache in some cases (esp. in 2.1.1)
  • identical to 2.1.0 except for the security fix backported from 2.2.0

2.1.1

  • identical to 2.1.0 except for the security fix backported from 2.2.0

2.1.0

  • new: Autoptimize now appears in admin-toolbar with an easy view on cache size and the possibility to purge the cache (pass false to autoptimize_filter_toolbar_show filter to disable), a big thanks to Pablo Custo for his hard work on this nice feature!
  • new: An extra „More Optimization“-tab is shown (can be hidden with ´autoptimize_filter_show_partner_tabs´-filter) with information about related optimization tools- and services.
  • new: If cache size becomes too big, a mail will be sent to the site admin (pass false to autoptimize_filter_cachecheck_sendmail filter to disable or pass alternative email to the autoptimize_filter_cachecheck_mailto filter to change email-address)
  • new: power-users can enable Autoptimize to pre-gzip the autoptimized files by passing true to autoptimize_filter_cache_create_static_gzip, kudo’s to (Draikin)[https://github.com/Draikin] for this!
  • improvement: admin GUI updated (again; thanks Pablo!) with some responsiveness added in the mix (not showing the right hand column on smaller screen-sizes)
  • improvement: settings-screen now accepts protocol-relative URL for CDN base URL
  • improvement: new (smarter) defaults for JS (don’t force in head + exclude jquery.js) and CSS optimization (include inline CSS)
  • Misc. bugfixes & small improvements (see commit-log on GitHub)
  • Minimal version updated from 2.7 (!) to 4.0
  • Tested and confirmed working on WordPress 4.6

2.0.2

  • Fehlerbehebung: Verbiete das Verschieben von nicht zusammengefügtem JS per Standard (kann durch die Übergabe von false an autoptimize_filter_js_unmovable reaktiviert werden)
  • Fehlerbehebung: Hook von autoptimize_action_cachepurged in init, um hässliche Fehlermeldungen für Benutzer von ZenCache (CometCache) zu vermeiden
  • Fehlerbehebung, um Autoptimize die Arbeit mit PHP 5.2 zu ermöglichen, (auch wenn du unbedingt upgraden solltest)

2.0.1

  • Improvement: Autoptimize now also tries to purge WP Engine cache when AO’s cache is cleared
  • Improvement: for AMP pages (which are pretty optimized anyway) Autoptimize will not optimize to avoid issues with e.g. „inline & defer“ and with AO adding attributes to link-tags that are not allowed in the subset of HTML that AMP is
  • Improvement: refactored the page cache purging mechanism (removing duplicate code, now nicely hooking into AO’s own autoptimize_action_cachepurged action)
  • Improvement: Re-enable functionality to move non-aggregated JS if „also aggregate inline JS“ is active (can be disabled with autoptimize_filter_js_unmovable filter)
  • Improvement: script tags with data-noptimize attribute will be excluded from optimization
  • Bugfix: Better support for renamed wp-content directories
  • Bugfix: Multiple fixes for late-injected CSS/ JS (changes in those files were not always picked up, fonts or background images were not being CDN’ed, …)
  • Misc. other fixes & improvements, go read the commit-log on GitHub if you’re that curious
  • Tested & confirmed working with WordPress 4.5 (beta 3)

2.0.0

  • On average 30% faster minification (more info in this blogpost)!
  • New: Option to (de-)activate aggregation of inline JS and CSS.
  • New: Option to remove Google Fonts.
  • New: Cache-size will be checked daily and a notice will be shown on wp-admin if cache size goes over 512 MB (can be changed by filter).
  • New: Small autoptimized CSS (less then 256 characters, can be changed by filter) will be inlined instead of linked.
  • New in API: filters to declare a JS and CSS whitelist, where only files in that whitelist are autoptimized and all others are left untouched.
  • New in API: filters to declare removable CSS and JS, upon which Autoptimize will simply delete that code (emoji CSS/JS for example, if you prefer not to dequeue them).
  • New in API: filter to move fonts to CDN as well.
  • lots of small and bigger bugfixes, I won’t bother you with a full list but have a look at the commmit log on GitHub.
  • tested and confirmed working with PHP7

1.9.4

  • bugfix: make sure non-AO CSSmin doesn’t get fed 2 parameters (as some only expect one, which resulted in an internal server error), based on feedback from zerooverture and zamba
  • bugfix: make default add_action hook back into „template_redirect“ instead of „init“ to fix multiple problems as reported by schecteracademicservices, bond138, rickenbacker, Rick Sportel and wizray. If you do need Autoptimize to initialize earlier (e.g. when using Nextgen Galleries), then add this to your wp-config.php:
    define(„AUTOPTIMIZE_INIT_EARLIER“,“true“);

1.9.3

  • improvement: more intelligent CDN-replacement logic, thanks Squazz for reporting and testing
  • improvement: allow strings (comments) to be excluded from HTML-optimization (comment removal)
  • improvement: changed priority with which AO gets triggered by WordPress, solving JS not being aggregated when NextGen Galleries is active, with great help from msebald
  • improvement: extra JS exclude-strings: gist.github.com, text/html, text/template, wp-slimstat.min.js, _stq, nonce, post_id (the latter two were removed from the „manual“ exclude list on the settings-page)
  • new in API: autoptimize_filter_html_exclude, autoptimize_filter_css_defer, autoptimize_filter_css_inline, autoptimize_filter_base_replace_cdn, autopitmize_filter_js_noptimize, autopitmize_filter_css_noptimize, autopitmize_filter_html_noptimize
  • bugfix: remove some PHP notices, as reported by dimitrov.adrian
  • bugfix: make sure HTML-optimalization does not gobble a space before a cite as proposed by ecdltf
  • bugfix: cleaning the cache did not work on non-default directories as encountered by NoahJ Champion
  • upgraded to yui compressor php port 2.4.8-4
  • added arabic translation, thanks to the ekleel team
  • tested with WordPress 4.2 beta 3

1.9.2

First of all; Happy holidays, all the best for 2015!!

  • New: support for alternative cache-directory and file-prefix as requested by a.o. Jassi Bacha, Cluster666 and Baris Unver.
  • Improvement: hard-exclude all linked-data json objects (script type=application/ld+json)
  • Improvement: several filters added to the API, e.g. to alter optimized HTML, CSS or JS
  • Bugfix: set Autoptimize priority back from 11 to 2 (as previously) to avoid some pages not being optimized (thanks to CaveatLector for investigating & reporting)
  • Bugfix (in YUI-CSS-compressor-PHP-port): don’t convert bools to percentages in rotate3D-transforms (cfr. bugreport on Github)
  • Bugfix: background images with a space in the path didn’t load, reported by johnh10.
  • Bugfix: SVG image with fill:url broken after CSS optimization as reported by Tkama
  • Updated translation for Swedish, new translation for Ukrainian by Zanatoly of SebWeo.com
  • Updated readme.txt
  • Confirmed working with WordPress 4.1

1.9.1

1.9.0

  • „Inline and defer CSS“ allows one to specify which „above the fold CSS“ should be inlined, while the normal optimized CSS is deferred.
  • Inlined Base64-encoded background Images will now be cached as well and the threshold for inlining these images has been bumped up to 4096 bytes (from 2560).
  • Separate cache-directories for CSS and JS in /wp-content/cache/autoptimize, which should result in faster cache pruning (and in some cases possibly faster serving of individual aggregated files).
  • Autoptimized CSS is now injected before the -tag, JS before (and after when forced in head). This can be overridden in the API.
  • Some usability improvements of the administration-page
  • Multiple hooks added to the API a.o. filters to not aggregate inline CSS or JS and filters to aggregate but not minify CSS or JS.
  • Updated translations for Dutch, French, German, Persian and Polish and new translations for Brazilian Portuguese (thanks to Leonardo Antonioli) and Turkish (kudo’s Baris Unver)
  • Multiple bugfixes & improvements
  • Tested with WordPress 4.0 rc3

1.8.5

  • Updated to lastest version of CSS minification component
  • Improvement: for multi-sites the cache is now written to separate directories, avoiding one site to clean out the cache for the entire installation. Code contributed by Joern Lund, kudo’s Joern!!
  • Improvement: add WordPress plugin header to autoptimize_helper.php_example to make it easier to enable it as a module
  • Improvement: nonce and post_id are added to default configuration for JS exclusion
  • Improvement: explicitely exclude wp-admin from being Autoptimized
  • Bugfix: plupload.min.js, syntaxhighlighter and „adsbygoogle“ are excluded from JS aggregation.
  • Bugfix: avoid double closing body-tags when Autoptimize adds JS to HTML as reported by Can
  • Bugfix: make .htaccess compatible with both Apache 2.2 and 2.4 (https://wordpress.org/support/topic/feature-request-support-generating-htaccess-files-for-apache-24?replies=3)

1.8.4

  • Bugfix: code in inline JS (or CSS) can be wrapped inside HTML-comments, but these got removed since 1.8.2 as part of a bugfix.

1.8.3

1.8.2

  • Improvement: more graceful failure when minifier classes exist but method does not, based on bug-report by Franck160
  • Improvement: deferred CSS is also outputted in noscript-tags
  • Improvement: differentiate between Apache version in .htaccess file as suggested by iMadalin
  • Improvement: also aggregate protocol-less CSS/JS URI’s (as suggested by Ross)
  • Improvement: disable autoptimization based on parameter in querystring (for debugging)
  • Bugfix: some CSS-imports were not being aggregated/ minified
  • Bugfix: add CSS before <title instead of to avoid breakage when title includes other attributes (e.g. itemscope)
  • Bugfix: make sure javascript or css between comments is not aggregated as reported by Milap Gajjar
  • Tested with WordPress 3.9 (beta 1)
  • Updates in FAQ

1.8.1

  • bugfix: CSS in conditional comments was not excluded from aggregation as reported by Rolf and bottapress

1.8.0

  • New: Option to inline all CSS as suggested by Hamed
  • New: set of filters to provide a simple API to change Autoptimize behavior (e.g. replace „defer“ with „async“, disabling Autoptimization on certain pages, specificy non-aggregatable script to be moved after aggregated one (cfr. https://wordpress.org/support/topic/feature-request-some-extra-options?replies=14), size of image to be data-urized). More info in the included autoptimize_helper.php_example.
  • Improvement: exclude (css in) noscript-tags as proposed by belg4mit
  • Improvement: switch default delivery of optimized CSS/JS-files from PHP to static files
  • Updated upstream CSS minifier
  • Improvement (force gzip of static files) and Bugfix (force expiry for dynamic files, thanks to Willem Razenberg in .htaccess
  • Improvement: fail gracefully when things go wrong (e.g. CSS import resulting in empty aggregated CSS-files reported by Danka or when the theme is broken as seen by Prateek Gupta)
  • Updated translations and Polish added (thanks to Jakub Sierpinski).
  • Bugfix: stop import-statements in CSS comments to be taken into acccount hat tip to Josef from blog-it-solutions.de
  • Bugfix: fix for blur in CSS breakeage as reported by Chris of clickpanic.com

1.7.3

  • improvement: remove cache + options on uninstall as requested by Gingerbreadmen
  • improvement: set .htaccess to allow PHP execution in wp-content/cache/autoptimize when saving optimized files as PHP, as suggested by (David Mottershead of bermuda4u.com)[http://www.bermuda4u.com/] but forbid PHP execution when saving aggregated script/css as static files (except for multisite).
  • bugfix: avoid Yoast SEO sitemaps going blank (due optimization of Yoast’s dynamically built XML/XSL) as reported by Vance Hallman and Armand Hadife. More info on this issue can be found on my blog.
  • smaller changes to readme.txt

1.7.2

  • improvement: extra checks in CSS @import-handling + move import rules to top of CSS if not imported successfully, based a.o. on bug reports by ozum and by Peter Stolwijk
  • improvement: check if JS and CSS minifier classes exist and only load if they don’t to avoid possible conflicts with other themes or plugins that already loaded minifiers
  • tested and approved for WordPress 3.8 (beta1)

1.7.1

1.7.0

1.6.6

  • Neu: Schalte Autoptimization ab, indem du Teile des HTML-, JS- oder CSS-Codes zwischen noptimize-Tags setzt, z.B:
    alert(‚Dies wird nicht von Autoptimize optimiert‘);
  • Added extra check to prevent plugin-files being called outside of WordPress as suggested in this good article on security.
  • Added small notice to be displayed after installation/ activation to ask user to configure the plugin as well.
  • Added Persian translation, thanks to Hamed T.

1.6.5

  • new javascript-debug option to force the aggregated javascript file in the head-section of the HTML instead of at the bottom
  • YUI compression & CDN are now deprecated functionality that will be removed in 1.7.0

1.6.4

1.6.3

  • fix for IE-hacks with javascript inside, causing javascript breakage (as seen in Sampression theme) as reported by Takahiro of hiskip.com
  • fix for escaping problem of imported css causing css breakage (as seen in Sampression theme) as reported by Takahiro as well
  • fix to parse imports with syntax @import ‚custom.css‘ not being parsed (as seen in Arras theme), again as reported by Takahiro
  • fix for complex media types in media-attribute as reported by jvwisssen
  • fix for disappearing background-images that were already datauri’s as reported by will.blaschko
  • fix not to strip out comments in HTML needed by WP Super Cache or W3 Total Cache (e.g. mfunc)
  • added check to clean cache on upgrade
  • updated FAQ in readme with information on troubleshooting and support
  • tested with WordPress 3.6 beta

1.6.2

  • Yet another emergency bugfix I’m afraid: apache_request_headers (again in config/delayed.php) is only available on … Apache (duh), breaking non-Apache systems such as ngnix, Lighttpd and MS IIS badly. Reported by multiple users, thanks all!

1.6.1

  • fixed stupid typo in config/delayed.php which broke things badly (april fools-wise); strpos instead of str_pos as reported by Takahiro.

1.6.0

  • You can now specify scripts that should not be Autoptimized in the admin page. Just add the names (or part of the path) of the scripts in a comma-separated list and that JavaScript-file will remain untouched by Autoptimize.
  • Added support for ETag and LastModified (essentially for a better pagespeed score, as the files are explicitely cacheable for 1 year)
  • Autoptimizing for logged in users is enabled again
  • Autoptimize now creates an index.html in wp-content/cache/autoptimize to prevent snooping (as proposed by Chris)
  • bugfix: removed all deprecated functions (reported by Hypolythe and diff by Heiko Adams, thanks guys!)
  • bugfix for HTTPS-problem as reported by dbs121
  • bugfix for breakage with unusual WordPress directory layout as reported by Josef from blog-it-solutions.de.

1.5.1

  • bugfix: add CSS before opening title-tag instead of after closing title, to avoid CSS being loaded in wrong order, as reported by fotofashion and blogitsolutions (thanks guys)

1.5

  • first bugfix release by futtta, thanks for a great plugin Turl!
  • misc bug fixes, a.o. support for Twenty Twelve theme, admin bar problem in WP3.5, data-uri breaking CSS file naming

1.4

  • Add support for inline style tags with CSS media
  • Fix WordPress top bar

1.3

  • Add workaround for TinyMCEComments
  • Add workaround for asynchronous Google Analytics

1.2

  • Add workaround for Chitika ads.
  • Add workaround for LinkWithin widget.
  • Belorussian translation

1.1

  • Add workarounds for amazon and fastclick
  • Add workaround for Comment Form Quicktags
  • Fix issue with Vipers Video Quicktags
  • Fix a bug in where some scripts that shouldn’t be moved were moved
  • Fix a bug in where the config page wouldn’t appear
  • Fix @import handling
  • Implement an option to disable js/css gzipping
  • Implement CDN functionality
  • Implement data: URI generation for images
  • Support YUI CSS/JS Compressor
  • Performance increases
  • Handle WP Super Cache’s cache files better
  • Update translations

1.0

  • Add workaround for whos.among.us
  • Support preserving HTML Comments.
  • Implement „delayed cache compression“
  • French translation
  • Update Spanish translation

0.9

  • Add workaround for networkedblogs.
  • Add workarounds for histats and statscounter
  • Add workaround for smowtion and infolinks.
  • Add workaround for Featured Content Gallery
  • Simplified Chinese translation
  • Update Spanish Translation
  • Modify the cache system so it uses wp-content/cache/
  • Add a clear cache button

0.8

  • Add workaround for Vipers Video Quicktags
  • Support tags without media.
  • Take even more precautions so we don’t break urls in CSS
  • Support adding try-catch wrappings to JavaScript code
  • Add workaround for WordPress.com Stats
  • Fix a bug in where the tags wouldn’t move
  • Update translation template
  • Update Spanish translation

0.7

  • Add fix for DISQUS Comment System.

0.6

  • Add workaround for mybloglog, blogcatalog, tweetmeme and Google CSE

0.5

  • Support localization
  • Fix the move and don’t move system (again)
  • Improve url detection in CSS
  • Support looking for scripts and styles on just the header
  • Fix an issue with data: uris getting modified
  • Spanische Übersetzung

0.4

  • Write plugin description in English
  • Set default config to everything off
  • Add link from plugins page to options page
  • Fix problems with scripts that shouldn’t be moved and were moved all the same

0.3

  • Disable CSS media on @imports – caused an infinite loop

0.2

  • Support CSS media
  • Fix an issue in the IE Hacks preservation mechanism
  • Fix an issue with some urls getting broken in CSS

0.1

  • First released version.