From 161fe594127d0f8abe1cb328c560fd2ece6f03d9 Mon Sep 17 00:00:00 2001 From: Thomas Dannenberg Date: Mon, 6 Oct 2025 20:13:53 +0000 Subject: [PATCH] Kapitel 9/Premium Rohtext.md aktualisiert --- Kapitel 9/Premium Rohtext.md | 104 +++++++++++++++++++++++------------ 1 file changed, 68 insertions(+), 36 deletions(-) diff --git a/Kapitel 9/Premium Rohtext.md b/Kapitel 9/Premium Rohtext.md index c0e3be7..41bc0a2 100644 --- a/Kapitel 9/Premium Rohtext.md +++ b/Kapitel 9/Premium Rohtext.md @@ -336,49 +336,81 @@ Für alle Einträge **Force SSL** aktivieren und Zertifikate anfordern. Jede neue Seite benötigt einen eigenen Projektordner, eine eigene `.conf`-Datei und eine eigene Subdomain. Diese klare Trennung verhindert Konflikte und erleichtert Wartung und Sicherheit. -## 5. CDN-Integration +## 5. Statische Inhalte beschleunigen -Ein **Content Delivery Network (CDN)** beschleunigt die Auslieferung von statischen Dateien wie Bildern, CSS- und JavaScript-Dateien. -Gerade bei internationalen Besuchern oder grafiklastigen Projekten verbessert ein CDN die Ladezeiten erheblich und entlastet den eigenen Webspace-Container. +Statische Inhalte wie Bilder, CSS- und JavaScript-Dateien ändern sich selten, werden aber bei jedem Seitenaufruf neu vom Server geladen. +Damit diese Dateien schneller ausgeliefert werden und den Webspace-Container nicht unnötig belasten, richten wir ein **lokales Caching** ein. +Für größere Projekte mit sehr vielen Medien empfehlen wir später den Einsatz eines eigenen **Asset-LXC** (siehe Kapitel 12). -### Ziel der Integration -- **Schnellere Ladezeiten:** Dateien werden über weltweit verteilte Server ausgeliefert. -- **Weniger Serverlast:** Der Webspace muss weniger Daten direkt bereitstellen. -- **Bessere Nutzererfahrung:** Besucher erleben kürzere Ladezeiten und stabilere Performance. +### Schritt 1 – Cache-Module aktivieren +Öffne die Konsole des Webspace-Containers und installiere die benötigten Apache-Module: -### Schritt 1 – Geeigneten CDN-Anbieter wählen -Für die meisten Projekte reicht ein kostenloser Dienst wie **Cloudflare CDN**, der statische Inhalte zwischenspeichert und gleichzeitig DDoS-Schutz bietet. -Wer nur Bilder und Videos optimieren möchte, kann auch **Bunny CDN** oder ähnliche Dienste nutzen. +```bash +apt update +apt install -y libapache2-mod-cache libapache2-mod-cache-disk libapache2-mod-deflate +a2enmod cache cache_disk deflate expires headers +systemctl restart apache2 +``` + +👉 Screenshot geeignet: Konsole nach erfolgreicher Installation und Aktivierung der Module + +Diese Module sorgen dafür, dass häufig verwendete Dateien zwischengespeichert und komprimiert übertragen werden. + +### Schritt 2 – Cache-Regeln für statische Dateien einrichten +Öffne die Konfigurationsdatei deiner Live-Seite, z. B.: + +```bash +nano /etc/apache2/sites-available/webproject-prod.conf +``` + +Füge innerhalb des ``-Blocks vor `` Folgendes hinzu: + +```apache + + ExpiresActive On + ExpiresByType image/jpg "access plus 1 month" + ExpiresByType image/jpeg "access plus 1 month" + ExpiresByType image/png "access plus 1 month" + ExpiresByType image/gif "access plus 1 month" + ExpiresByType text/css "access plus 1 month" + ExpiresByType application/javascript "access plus 1 month" + + + + Header set Cache-Control "public, max-age=2592000" + +``` + +👉 Screenshot geeignet: geöffnete Apache-Konfigurationsdatei mit eingefügten Cache-Regeln + +Die Regeln teilen Browsern und Apache mit, dass Bilder und Skripte bis zu 30 Tage lang aus dem Cache geladen werden dürfen. + +### Schritt 3 – Apache neu laden +Übernimm die Änderungen mit: + +```bash +systemctl reload apache2 +``` + +👉 Screenshot geeignet: Konsole nach erfolgreichem Reload + +### Schritt 4 – Funktion prüfen +Öffne die Entwicklertools deines Browsers (F12 → Netzwerk-Tab) und lade die Seite neu. +Bei den statischen Dateien sollte nun ein Cache-Header mit Ablaufdatum angezeigt werden. + +👉 Screenshot geeignet: Browser-Netzwerkanzeige mit Cache-Headern für Bilder und CSS [!TIP] -Cloudflare ist für die meisten Einsteiger ideal, da es leicht einzurichten ist und viele Basisfunktionen kostenfrei bereitstellt. +Wenn du eine Datei ersetzt und die Änderung sofort sichtbar sein soll, leere den Browser-Cache mit **Strg + F5**. +Falls nötig, kannst du auch den Apache-Cache im Container löschen: -### Schritt 2 – DNS auf das CDN umstellen -Melde dich beim gewählten CDN-Anbieter an und folge dem dortigen Einrichtungsassistenten. -In der Regel ersetzt der Anbieter die Nameserver deiner Domain durch eigene (z. B. bei Cloudflare). -Nach der Umstellung laufen alle Anfragen automatisch über das CDN. +```bash +rm -rf /var/cache/apache2/* +``` -👉 Screenshot geeignet: Cloudflare-Dashboard mit aktivierten CDN- und SSL-Optionen - -### Schritt 3 – HTTPS und Weiterleitungen prüfen -Da alle Aufrufe künftig über das CDN gehen, prüfe anschließend die HTTPS-Einstellungen: - -- Im CDN-Dashboard **„Always Use HTTPS“** aktivieren -- Sicherstellen, dass im Nginx Proxy Manager weiterhin **Force SSL** aktiv ist -- Testen, ob die Seiten weiterhin automatisch auf `https://` umleiten und ein gültiges Zertifikat anzeigen - -### Schritt 4 – Caching und Performance optimieren -Passe im CDN die Caching-Regeln für statische Dateien an, z. B.: - -- HTML-Dateien: kurze Cache-Dauer (z. B. 10 Minuten) -- Bilder, CSS, JS: lange Cache-Dauer (z. B. 1 Monat) - -Damit werden Änderungen an der Seite zeitnah sichtbar, während selten geänderte Dateien länger im Cache bleiben. - -👉 Screenshot geeignet: CDN-Einstellungen für Cache-Dauer - -[!IMPORTANT] -Nach jeder Layout- oder Inhaltsänderung ggf. den CDN-Cache leeren („Purge Cache“), damit Besucher sofort die aktuelle Version der Webseite sehen. +Für wachsende Projekte mit vielen Medieninhalten lohnt sich ein eigener **Asset-LXC**. +Damit werden große Dateien separat ausgeliefert, die Performance steigt und der Webspace-Container wird entlastet. +Die Einrichtung eines solchen Asset-Containers behandeln wir ausführlich in **Kapitel 12**. ## 6. Sicherheitsmaßnahmen