Nachdem Google Developer Day 2011 habe ich mich vermehrt mit Google Produkten beschäftigt. Man kann also sagen, dass die Marketing-Aktion funktioniert hat :). Mit diesem Post möchte ich euch die Möglichkeit vorstellen, die Google App Engine als CDN für statische Files zu nutzen.

Die Idee zu dieser Variante gab mir der Artikel Alternative Use of Google App Engine for Optimizing WordPress, bei dem allerdings von einem Linux Betriebssystem ausgegangen wird. Ich habe Windows 7 Ultimate verwendet und bin auch ein wenig anders vorgegangen.

Vorteile, die die Google App Engine als CDN bietet

Zunächst einmal kann jeder die App Engine nutzen und sitzt in der Grundversion kostenlos. Grundversion beinhaltet ein gewisses Kontingent an CPU-Zeit, Bandbreite, etc. Kommt man über diese Grenzen, fallen geringe Kosten an. Dazu mehr in den Nachteilen.

Das CDN (Content Delivery Network) sind auf der ganzen Welt verteilte Rechenzentren, auf denen die Daten gespiegelt werden. Durch die dezentrale Struktur kann das Rechenzentrum mit der kürzesten Entfernung für den Besucher angesteuert werden. Die Latenzzeiten werden somit so gering wie möglich gehalten.

Durch die dezentrale Struktur eines CDNs wird letztendlich auch die Problematik umgegangen, dass ein Webhoster meistens in der Regel nur Rechenzentren in einer bestimmten Region hat.

Wenn man z.B. eine englischsprachige Webseite bei seinem Webhoster des Vertrauens betreibt, der z.B. in Deutschland sein Rechenzentrum hat, so werden alle Verbindungen aus der gesamten Welt bei diesem Rechenzentrum auflaufen.

Ein amerikanischer Besucher baut somit bei jedem Besuch eine Verbindung nach Deutschland auf, was natürlich zu einer erhöhten Latenzzeit führt. Diese Problematik wird mit einem CDN und seinem, ich nenne es mal, Lokalitätsprinzip wunderbar umgegangen.

Ein bekanntes Problem des HTTP-Protokolls ist, dass nur zwei parallele Verbindungen je Domain aufgebaut werden können. Um dieses Nadelöhr zu umgehen könnte man u.a. verschiedene Subdomains einrichten.

So könnte man für die statische Dateien, wie z.B. CSS- oder JS-Dateien, eine Subdomain static.domain.de einrichten und für die Bilder eine Subdomain in der Form images.domain.de.

Problematisch wird es allerdings, wenn der gesamte Webserver unter Last steht. Selbst dann haben die verschiedene Subdomains keinen Nutzen mehr, da auch diese Subdomains erhöhte Reaktionszeiten haben.

Verwendet man jetzt die Google App Enginge als CDN so umgeht man zum einen die Problematik der zwei parallelen Zugriffe auf eine Domain und zum anderen verteilt man die Last auf zwei verschiedene Webserver bzw. Rechenzentren.

Wo Vorteile sind, sind auch Nachteile

Bleiben wir im Kontext Google App Engine als CDN für WordPress. Ein Nachteil bei höher frequentierten Webseiten ist die Limitierung der freien Bandbreite. Aktuell ist 1 GB Traffic inklusive.

Solltet ihr über die Limitierung geraten, so fallen entsprechend der Google Information zur App Engine geringe Kosten an.

Sollte sich eine der statischen Dateien ändern oder ihr wollt eine neues Bild hinzufügen, muss jedes Mal die Datei in die Cloud kopiert werden, was zusätzlichen Aufwand bedeutet.

Schritt für Schritt zum Erfolg

Die Vor- und Nachteile wurden jetzt ausführlich diskutiert. Kommen wir jetzt zum spannenden Teil: Wie bekomme ich Dateien über die App Engine in die Cloud und wie binde ich diese Dateien in meine WordPress Instanz ein?

  1. Einen Google Account solltet ihr bereits besitzen. Jeder Google Account kann sich für die App Engine unter http://appengine.google.com anmelden.
  2. Nachdem ihr euch für die AppEngine registriert habt, könnt ihr eure erste Application anlegen. Der Application Name bildet gleichzeitig euren Identifkator und eure Subdomain, über die ihr die Inhalte später erreichen könnt.
  3. Als nächstes solltet ihr Python 2.6 installieren, zu finden unter: http://www.python.org/download/releases/2.6.7/. Außerdem benötigt ihr das PIL-Modul, dass ihr unter folgender URL erreicht: http://www.pythonware.com/products/pil/.
  4. Ebenfalls muss das Google App Engine SDK für Python und Windows (bzw. dem Betriebssystem eurer Wahl) installiert werden.
  5. Jetzt kann auf dem lokalen System ein Ordner, z.B. appengine/myproject, angelegt werden.
  6. Nach diesen Vorbereitungen kann der Google AppEngine Launcher gestartet werden. Dieser sollte sich nach der Installation des AppEngine SDKs auf dem Desktop befinden.

    Jetzt kann über File -> Create New Application eine neue Application eingerichtet werden. Dazu gebt ihr lediglich den Application Namen, den ihr beim Anlegen der Application im Webinterface von der Google AppEngine eingetragen habt, ein und wählt den Pfad zum Projektordner aus.

    Neue Application anlegen

    Neue Application anlegen

  7. Jetzt ist in der lokalen Ordnerstruktur ein weiterer Unterordner im Projektordner erstellt worden. Der Unterordner hat den Namen der Application. In den neu erstellten Unterordner können jetzt die statischen Dateien kopiert werden.

    Ebenfalls könnt ihr innerhalb des automatisch erstellen Unterordner weitere Ordner, wie z.B. /images/ für Bilder und/oder /css/ für CSS-Dateien, anlegen.

    Damit ihr als Favicon nicht das Google App Engine Icon habt, könnt ihr noch die Datei favicon.ico mit dem Favicon eurer Webseite ersetzen.

  8. Bevor die lokalen Dateien jetzt in die Cloud kopiert werden, muss noch die Datei app.yaml im Application Root Ordner (/appengine/myproject/application-name/) angepasst werden. Für jeden erstellen Ordner muss jetzt unter handlers folgendes eingetragen werden:


    handlers:
    - url: /images
    static_dir: images
    [...]

  9. Nachdem alle Dateien kopiert wurden und Ordner in die app.yaml wurden, kann das Project über den Google AppEngine Launcher deployed werden. Dazu einfach das richtige Projekt auswählen und den Deploy-Button klicken.

    Es öffnet sich nach dem Klicken ein Fenster, in dem ihr die Anmeldedaten für euren Google Account, auf dem Google App Engine registriert ist, eintragen müsst.

    Google Account Login

    Google Account Login

  10. Nachdem die Dateien in die Cloud kopiert wurden, können sie jetzt in eurem WordPress Blog verwendet werden. Die Dateien sind dann unter der URL

    http://application-name.appspot.com/

    erreichbar.

    Ich habe bis jetzt erst einige wenige statischen Dateien, wie z.B. das Twitter- und RSS-Icon aus der Sidebar, über die AppEngine eingebunden. Die Dateien haben folgende URL.

    http://static-blogrammierer.appspot.com/images/rss_48.png

    http://static-blogrammierer.appspot.com/images/twitter_48.png

Fazit

Eine sehr gute Möglichkeit seine statischen Dateien auszulagern. Gerade für Dateien wie Logos, Javascript oder CSS-Dateien eignet sich diese Variante hervorragend, da sich diese nicht laufen verändern.

Allerdings sollte die Auslagerung vorsichtig angegangen werden, wenn z.B. CSS-/JS-Dateien, die über ein WordPress-Plugin wie CSS-JS-Booster komprimiert werden, ausgelagert werden sollen.

Solange der kostenlose Rahmen der AppEngine nicht überschritten wird, ist eine sehr lukrative Alternative statische Dateien schnell und performant einzubinden und so der Webseite wieder etwas mehr Speed zu verschaffen.