Gestern hat Oliver in seiner Artikelserie Blog-Optimierung einen weiteren Artikel verfasst. In diesem Artikel geht es speziell um JavaScript (komprimieren, auslagern, cachen, zusammenlegen).
In diesem Zusammenhang habe ich die geladen Scripte hier im Blog mit Firebug analysiert. Dabei vielen mir die Scripte von Contact Form 7 und Comment Form Quicktags speziell negativ auf, da sie immer (auch wenn nicht benötigt) geladen wurden.
Die JavaScript Datei von Contact Form 7 wurde auf jeder Seite, nicht nur im Kontaktformular geladen. Dies wollte ich nicht so lassen, da die Ladezeit unnötig negativ beeinflusst wurde.
Dabei blieben mir zwei Möglichkeiten:
- Ersatz suchen.
- Plugin-Code anpassen.
Schlussendlich habe ich mich für die erste Methode entschieden und einen Ersatz für Contact Form 7 gesucht.
Es ging nicht lange und ich bin auf Tiny Contact Form gestoßen. Wie der Name bereits sagt, ist es ein sehr kompaktes Kontaktformular, welches ohne JavaScripte auskommt.
Die Konfiguration kann nach dem Aktivieren bequem über den Admin-Bereich vorgenommen werden:
Das Kontaktformular lässt sich anschliessend bequem per Shortcode auf einer Seite oder in einem Artikel einfügen.
Das Problem mit dem Kontaktformular hat sich somit erledigt und es wurde eine JavaScript-Datei weniger.
Nun gab es ja noch das Problem mit dem Plugin Comment Form Quicktags, welches ebenfalls überall geladen wurde.
Da hat mir Oliver geholfen den Aufruf des JavaScripts auf die single.php zu begrenzen. Dies hat soweit auch super funktioniert, doch leider musste ich feststellen, dass das Plugin an sich bereits sehr träge ist.
Ich entschloss mich, Comment Form Quicktags zu deaktivieren, was sich schlussendlich positiv auf die Blog-Ladezeit auswirkte. Es wird also (zumindest vorerst) keine Formatleiste mehr für das Kommentar-Feld geben.
Fazit: Wer Optimieren will, muss neben dem Zeitaufwand auch auf das eine oder andere Plugin verzichten. Doch ich für meinen Fall muss sagen, dass es sich gelohnt hat. An dieser Stelle auch nochmal ein Herzliches Dankeschön an Oliver für die super Artikelserie und die Hilfe!
Frage: Wie sieht es bei euch im Blog aus ? Musstet ihr auch schon auf das eine oder andere Plugin verzichten ?
Hey Jeffrey – herzlichen Dank für die Benennung.
Was das Kontaktformular betrifft, so komme ich ganz ohne Plugin aus. Dank Google-Form und -Spreadsheets.
Kannst es Dir ja mal anschauen. Vielleicht ist es auch eine Alternative für dich. Auch eine Benachrichtigungsfunktion kannst du da auf diese Weise einrichten.
Hmm, danke für den Tipp mit Contact Form 7. Ist mir bislang noch gar nicht aufgefallen, dass es auf allen Seiten eingebunden wird.
Teste dann jetzt auch mal Tiny Contact Form. :)
@Oliver:
Gerne gemacht :)
Das mit Google-Form habe ich ebenfalls einmal bei dir gelesen, hätte ich eigentlich auch verwenden können. Mal schauen, wenn Tiny Contact Form weiterhin gut funktioniert, lasse ich es erstmal so.
@Björn:
Mir wurde das ganze auch erst wieder durch den Beitag von Oliver bewusst.
Tiny Contact Form funktioniert bei mir super. Ich musste nur einige “br” im Plugin-Code einbauen, da mein Theme die Formularfelder alle auf eine Linie gesetzt hat.
Tiny Contact Form hab ich auch am Start, seit mich CF7 wegen des Overhead gestört hat. Ich kann nur Gutes berichten ;-)
Ich habe wegen Javascript und ähnlichen Scherzen schon öfter auf Plugins verzichtet, bzw. sie erst gar nicht installiert. Das erste das mir dazu einfällt war das WP Polls Plugin…
@Stephan:
Dann kann ich ja zuversichtlich sein, dass es auch bei mir weiterhin gut funktioniert :)
@Tanja:
Ich werde nun in Zukunft auch vermehrt auf dieses Java-Script Kriterium achten, das spart eine Menge Ärger und Geduld!
Jetzt brauchste eigentlich nur GZIP für die *.js und *.css Dateien, hat ja ebenfalls Oliver schon in einen Blogpost behandelt, dann denk ich ist dein Blog ganz gut optimiert. ;)
Btw: Ich sehe gerade, dass dein Header-Bild 62 KB groß ist und ungünstigerweise als JPEG gespeichert ist. Wenn du das als GIF speicherst, ist es nur noch 20 KB groß.
@embee:
Das mit dem GZIP muss ich mir in nächster Zeit auch mal noch anschauen, bin leider noch nicht dazu gekommen.
Bezüglich Header-Bild:
Lösche einmal bitte deinen Browser Cache für die Seite (CTRL + F5), dann sollte auch bei dir der neue Banner erscheinen, der ist nur noch 15 KB gross :)
…ich hätte noch ne Frage dazu:
Ich find die Anpassung dieses tollen Plugins echt nicht leicht. Es ist zwar toll, kann man dabei direkt Stylesheets eingeben und muss nicht umständlich zuerst auf die eigene style gehen, aber ich kann einfach nicht auf alle Classes in der PHP-Datei zugreiffen – für mich, komischerweise.
Ich hab jetzt die folgenden Classes resp. IDs gesetzt, die sich zumindest nicht gegenseitig aufheben. Damit sieht es schon etwas individueller aus.
.contactform
.contactform label
.contactform input
.contactform textarea
.contactform_respons
.contactform_error
#tcf_captcha
#contactsubmit
Aber gibt es noch ne weiter Class (oder ID) dazu, die sich nicht mit meinen beisst?! Ich hab keine mehr gefunden… Um es richtig toll zu machen (natürlich Geschmacksfrage) müsste ich mit “background”-Bildern arbeiten, was ich aber nicht möchte. Gibt es keine anderen Formen mehr?
Thx in front,
Dan.
@Dan:
Also TinyContactForm ist dazu da, ein einfaches Kontaktformular zu erstellen, dabei stehen dir halt auch nur die von dir erwähnten Klassen zur Verfügung.
Weitere Klassen müsstest du selber im PHP-Code des Plugins einbauen.
hallo zusammen, wie ich ein kontaktformular erstelle, glaube ich zu wissen. Jedoch weiß ich nicht, wie ich diesem Formular sinngemäß sagen kann, dass es ausgefüllt an meine eMail-Adresse gesendet werden soll/muss. Dazu fehlt mir doch etwas Intelligenz. Über eine Antwort oder auch mehrere würde ich mich sehr freuen… Sonnige Vatertagsgrüße Munky1968
@Munky:
Das Versenden kannst du anschliessend beispielsweise mit der PHP Funktion mail erledigen.
Das könnte helfen: http://php.net/manual/de/function.mail.php
Oder einfach mal nach “Kontaktformular – PHP” bei Google suchen :)