WordPress

Word­Press startete im Jahr 2004 als Open Source Blog-Sys­tem und wird heute ver­mehrt als CMS einge­set­zt [Wikb]. Mit einem Mark­tan­teil von 34,58 Prozent ist Word­Press das meist genutzte Con­tent-Man­age­ment-Sys­tem in Deutsch­land [Cms15]. Die Ver­bre­itung des Word­Press-Sys­tems führt zu ein­er umfassenden Unter­stützung durch kosten­freie sowie kostenpflichtige Erweiterun­gen. Diese stellen ergänzende Funk­tio­nen bere­it, die das Sys­tem nicht vorge­se­hen hat, wie beispiel­sweise ein Kon­tak­t­for­mu­lar. Neben diesen Funk­tion­ser­weiterun­gen wer­den fer­tig aus­gestal­tete und pro­gram­mierte Web­de­signs in Form von Themes ange­boten, die sich ohne Pro­gram­mierken­nt­nisse instal­lieren lassen.

Optimierungen bei der Installation und Konfiguration

Im Rah­men der Per­for­manceop­ti­mierung dieser Arbeit wurde Word­Press in der Ver­sion 4.3 einge­set­zt. Im Gegen­satz zu den Sys­te­men Con­tao und TYPO3 wird bei der Instal­la­tion von Word­Press keine HTAC­CESS-Datei bere­it­gestellt. Diese musste per Hand angelegt wer­den und die entsprechen­den Def­i­n­i­tio­nen erfol­gten anhand der opti­mierten HTAC­CESS-Datei des sta­tis­chen Tem­plate. Die Stan­dard­instal­la­tion von Word­Press bietet keine weit­eren Ansatzpunk­te zur Opti­mierung an.

Die Über­nahme der HTAC­CESS-Datei brachte bei dem Abruf über einen Desk­top-Rech­n­er mit­tels Web­Pagetest eine Ver­ringerung der wahrgenomme­nen Ladezeit um 13 Prozent, von 1,5 Sekun­den auf 1,3 Sekun­den, wie aus der Abbil­dung 4.7 her­vorge­ht. Darüber hin­aus kon­nte eine Reduzierung der Ladezeit des Doc­u­ment Com­plete um 25 Prozent, von 1,6 Sekun­den auf 1,2 Sekun­den, erre­icht wer­den (siehe Tabelle 4.21).

Tabelle 4.21: Aus­liefer­ung der Start­seite durch Word­Press mit und ohne HTAC­CESS-Datei

Metrik	Nor­mal	Opti­miert	Verbesserung
Visu­al­ly Com­plete	1,5 Sekun­den	1,3 Sekun­den	0,2 Sekun­den	13 %
SpeedIn­dex	1367	1290	77	6 %
Doc­u­ment Com­plete	1,6 Sekun­den	1,2 Sekun­den	0,4 Sekun­den	25 %
Page­speed Insights	77 / 89	79 / 93	2 / 4	-
YSLOW	87 / B	92 / A	5	-
Ping­dom	90	99	9	-

Die Bew­er­tun­gen anhand der regel­basierten Kri­te­rienkat­a­loge von Page­Speed Insights, YSLOW und Ping­dom verbesserten sich mod­er­at. Für weit­ere Opti­mierun­gen der Ladezeit­en ist die Inte­gra­tion von Erweiterun­gen zur Ergänzung der Funk­tio­nen des Sys­tems erforder­lich.

Integration von Erweiterungen

Word­Press set­zt zur Anpas­sung und Ergänzung der Grund­funk­tio­nen des Sys­tems auf die Ver­wen­dung von exter­nen Erweiterun­gen. Diese kön­nen über die Admin­is­tra­tionsober­fläche des Sys­tems automa­tisiert instal­liert und anschließend kon­fig­uri­ert wer­den.

Um die Möglichkeit­en zur Verbesserung der Ver­ar­beitungszeit durch Caching zu testen, wur­den die Auswirkun­gen der Erweiterun­gen W3 Total Cache und WP Super Cache in einem Ver­such näher betra­chtet. WP Super Cache bietet nach der Instal­la­tion kaum Ein­stel­lungsmöglichkeit­en, während sich W3 Total Cache umfan­gre­ich kon­fig­uri­eren lässt. In der Kon­fig­u­ra­tion von W3 Total Cache wur­den zu Beginn der Opti­mierung alle Caches, die Kom­prim­ierung der zu gener­ieren­den HTML-Doku­mente und die Nutzung client­seit­iger Brows­er-Caches aktiviert.

Aus der Abbil­dung 4.8 geht her­vor, dass beim Abruf der Start­seite mit einem Desk­top-Rech­n­er durch Web­Pagetest die Caching-Erweiterung WP Super Cache mehr Zeit zur Aus­liefer­ung der Inhalte im sicht­baren Bere­ich benötigt, als der Abruf ohne Caching.

Die Gener­ierung und Aus­liefer­ung der HTML-Doku­mente prof­i­tierte in dem Ver­such am meis­ten von der Erweiterung W3 Total Cache. Diese reduzierte die Gesamt­ladezeit der Start­seite um 0,2 Sekun­den und verbesserte auch die wahrgenommene Ladezeit, wie in Abbil­dung 4.9 dargestellt, um 0,2 Sekun­den. Die Bew­er­tun­gen anhand der regel­ba-sierten Kri­te­rienkat­a­loge von Page­Speed Insights, YSLOW und Ping­dom verbesserten sich nicht durch die Nutzung der Erweiterun­gen zum inter­nen Caching. Auf­grund dieser Ergeb­nisse wurde W3 Total Cache zur Verbesserung der Per­for­mance von Word­Press einge­set­zt. Im weit­eren Ver­lauf kon­nten mit Hil­fe der Optio­nen der Erweiterung zudem die CSS-Def­i­n­i­tio­nen für den kri­tis­chen Ren­der­ing Pfad inte­gri­ert wer­den.

Um Respon­sive Images mit Word­Press nutzen zu kön­nen, ist zurzeit die Erweiterung RICG Respon­sive Images von den Entwick­lern von Word­Press und der Respon­sive Images Com­mu­ni­ty Group (RICG) erforder­lich. In der Word­Press Ver­sion 4.4, die im Dezem­ber 2015 erscheint, ist die Ein­bindung von Respon­sive Images in den Stan­dard-funk­tio­nen des Word­Press-Sys­tems vorge­se­hen [Mcg15]. Nach der Instal­la­tion erstellt die Erweiterung RICG Respon­sive Images während des Hochladens von Bildern auto-matisch, anhand zuvor fest­gelegter Bild­größen, ver­schiedene Auflö­sun­gen. In den Ein-stel­lun­gen der Erweiterun­gen kann unter dem Menüpunkt Medi­en die Bre­ite der Bilder angegeben wer­den. Hier wur­den die von dem sta­tis­chen Tem­plate vorgegebe­nen Auf-lösun­gen der Bilder mit ein­er Bre­ite von 720 Pix­eln und 990 Pix­eln gewählt. Weit­ere Auflö­sun­gen lassen sich in der Kon­fig­u­ra­tions­datei functions.php des Themes durch die Angabe von add_image_size definieren [Gre15].

Die Erweiterung EWWW Image Opti­miz­er opti­miert die beste­hen­den Bilder in der Mediathek von Word­Press durch eine erneute Kom­prim­ierung und die Ent­fer­nung von Meta­dat­en. Darüber hin­aus wer­den nach der Instal­la­tion der Erweiterung alle Bilder beim Hochladen in die Mediathek automa­tisch opti­miert, um Auswirkun­gen auf die Ladezeit, durch eine fehler­hafte Kom­pres­sion der Bilder, zu ver­mei­den.

Zur Steuerung der Aus­liefer­ung bes­timmter Ele­mente für mobile Endgeräte, nach dem in Kapi­tel 3.5.1 vorgestell­ten Ansatz RESS, erfol­gte in Word­Press die Instal­la­tion der Erweiterung Mob­ble. Diese iden­ti­fiziert anhand des User Agent das Endgerät und berück­sichtigt in den Tem­plates Ausze­ich­nun­gen mit der Def­i­n­i­tion is_mobile().

if (is_mobile()) {
  the_post_thumbnail(‚medium’);
} else {
  the_post_thumbnail(‚large’);
}

Fol­glich wur­den für die Aus­liefer­ung der Web­site an mobile Endgeräte die Web Fonts und der Con­tent-Slid­er auf der Start­seite ent­fer­nt. Durch diese Maß­nah­men kon­nte das Daten­vol­u­men der Start­seite von 297 Kilo­byte auf 52 Kilo­byte reduziert und die Ladezeit um 2 Sekun­den ver­ringert wer­den (siehe Abbil­dung 4.10).

Bei der Ver­wen­dung von Erweiterun­gen in Word­Press-Sys­te­men ist zu beacht­en, dass sich diese, durch eine Steigerung der Anzahl von Daten­bank­abfra­gen, nachteilig auf die Per­for­mance der Web­site auswirken kön­nen. Laut Mar­cus Tay­lor wer­den Prob­leme bei der Ladezeit von Word­Press-Instal­la­tio­nen vor­wiegend durch zu langsame Web­serv­er, eine hohe Anzahl an Erweiterun­gen oder über­ladene Tem­plates verur­sacht [Tay14]. Die Bere­ini­gung der Daten­bank sollte daher zur Sys­tempflege von Word­Press gehören und kann mit der Erweiterung WP-Opti­mize in regelmäßi­gen Inter­vallen automa­tisiert vorgenom­men wer­den, um die Per­for­mance der Daten­bank aufrechtzuer­hal­ten [Tay14].

Bewertung von WordPress

Word­Press bietet in der Grund­kon­fig­u­ra­tion, abge­se­hen von den Def­i­n­i­tio­nen mit­tels HTAC­CESS-Datei, keine weit­eren Ansatzpunk­te für die Maß­nah­men zur Opti­mierung der Ladezeit. Zur Real­isierung weit­er­er Per­for­manceop­ti­mierun­gen ist die Instal­la­tion von Erweiterun­gen erforder­lich. Diese haben den Nachteil, dass eine Abhängigkeit zu Drit­tan­bi­etern entste­ht, die diese Erweiterun­gen entwick­eln und bere­it­stellen. Die Inte­gra­tion von Erweiterun­gen erfol­gte für das sys­tem­interne Caching, die Ein­bindung von Respon­sive Images, zur Opti­mierung der über Word­Press hochge­lade­nen Bilder und zur Aus­liefer­ung spez­i­fis­ch­er Ele­mente sowie Ressourcen für mobile Endgeräte.

Tabelle 4.22: Start­seite aus­geliefert durch Word­Press beim Abruf über einen Desk­top-Rech­n­er

Metrik	Nor­mal	Opti­miert	Verbesserung
Visu­al­ly Com­plete	1,5 Sekun­den	1,3 Sekun­den	0,2 Sekun­den	13 %
SpeedIn­dex	666	790	124	19 %
Doc­u­ment Com­plete	1,4 Sekun­den	1,1 Sekun­den	0,3 Sekun­den	21 %
Page­speed Insights	77 / 89	100 / 93	23 / 4	-
YSLOW (Punk­te / Note)	86 / B	94 / A	8	-
Ping­dom	90	99	9	-

Die Opti­mierun­gen von Word­Press bewirk­ten eine Reduzierung der Gesamt­ladezeit, die sich wiederum auf die wahrgenommene Ladezeit auswirk­te. Aus den Tabellen 4.22 und 4.23 geht her­vor, dass die Ergeb­nisse der regel­basierten Kri­te­rien verbessert wur­den.

Tabelle 4.23: Unter­seite aus­geliefert durch Word­Press beim Abruf über einen Desk­top-Rech­n­er

Metrik	Nor­mal	Opti­miert	Verbesserung
Visu­al­ly Com­plete	0,8 Sekun­den	0,6 Sekun­den	0,2 Sekun­den	25 %
SpeedIn­dex	604	493	111	18 %
Doc­u­ment Com­plete	0,9 Sekun­den	0,9 Sekun­den	-	-
Page­speed Insights	78 / 90	100 / 93	22 / 3	-
YSLOW (Punk­te / Note)	89 / B	95 / A	6	-
Ping­dom	92	99	7	-

Wie schon in den Ver­suchen mit Con­tao und TYPO3, wirk­ten sich bei Word­Press die Maß­nah­men zur Opti­mierung der Ladezeit ins­beson­dere auf die Aus­liefer­ung an mobile Endgeräte aus. Für die Darstel­lung der Inhalte in dem sicht­baren Bere­ich eines mobilen Endgerätes kon­nten Ladezeit­en von 1,6 Sekun­den für die Start­seite und 1,4 Sekun­den für eine Unter­seite gemessen wer­den (siehe Tabelle 4.24 und 4.25 auf der fol­gen­den Seite).

Tabelle 4.24: Start­seite aus­geliefert durch Word­Press beim Abruf über ein 3G-Daten­netz

Metrik	Nor­mal	Opti­miert	Verbesserung
Visu­al­ly Com­plete	3,3 Sekun­den	1,6 Sekun­den	1,7 Sekun­den	52 %
SpeedIn­dex	2387	1312	1075	45 %
Doc­u­ment Com­plete	4,7 Sekun­den	2,7 Sekun­den	2,0 Sekun­den	43 %
Anfra­gen	13	6	7	54 %
Daten­vol­u­men	297 KB	52 KB	245 KB	82 %

Tabelle 4.25: Unter­seite aus­geliefert durch Word­Press beim Abruf über ein 3G-Daten­netz

Metrik	Nor­mal	Opti­miert	Verbesserung
Visu­al­ly Com­plete	3,3 Sekun­den	1,4 Sekun­den	1,9 Sekun­den	58 %
SpeedIn­dex	2822	1154	1668	59 %
Doc­u­ment Com­plete	3,8 Sekun­den	3,1 Sekun­den	0,7 Sekun­den	18 %
Anfra­gen	11	8	3	27 %
Daten­vol­u­men	230 KB	188 KB	42 KB	18 %

Die Berück­sich­ti­gung des kri­tis­chen Ren­der­ing Pfades, durch die Ein­bindung von CSS-Def­i­n­i­tio­nen als Inlinestyling, führte auf der Unter­seite zu ein­er Verbesserung der Zeit des Visu­al­ly Com­plete von 58 Prozent. Das erzielte Ergeb­nis ist beacht­enswert, da das Daten­vol­u­men der Unter­seite durch die Opti­mierung lediglich um 18 Prozent ver­ringert wer­den kon­nte.