Detailseite mit Bildern sehr langsam

[Philipp96]

Hallo,

ich bin gerade dabei meine Webseite zu überarbeiten und bin quasi in den letzten Zügen. Leider habe ich noch Probleme mit den Ladezeiten, besonders bei meinen News-Detailseiten, wo ich relativ viele Bilder zeige, da ich Hobbyfotograf bin.

Es geht um folgende Seite: xxx

Die normalen Inhaltsseiten gehen zügiger, nur bei den Detailseiten lädt es beim ersten Mal noch sehr lang und ich weiß absolut nicht mehr woran das liegen kann. Ich habe schon diverse Sachen optimiert. Dazu zählen:

- Responsive Images überall eingesetzt für diverse Auflösungen
- Lazyload installiert und wird bei allen Bildern inkl. Hintergrundbildern genutzt. Ich habe das Speed Bundle von heimrichhannot installiert.
- max_execution_time auf 360 Sekunden und memory_limit auf 128M gesetzt
- JS und CSS wird alles am Ende der Seite geladen und es wird alles lokal eingebunden.
- Skripte-Komprimierung ist aktiv.
- Alle Bilder, die ich hochgeladen habe sind maximal 400 kB groß.

Ich nutze Bootstrap, Headroom.js für die Navigation, Font Awesome und Google Fonts, alles lokal eingebunden. Ich habe Contao 4.4 installiert, habe es auch mal mit der 4.6 probiert, was nichts brachte. PHP 7.1 ist aktiv.

Folgende Erweiterungen sind installiert:
- codefog/contao-news_categories
- contao-bootstrap/bundle
- contao-dd/advanced-classes-bundle
- do-while/contao-backupdb-bundle
- heimrichhannot/contao-speed-bundle
- jrgregory/m17-sticky-backend-footer
- netzmacht/contao-font-awesome-inserttag
- pdir/social-feed-bundle
- terminal42/contao-folderpage

Hosting-Anbieter ist All-Inkl und ich habe das Privat-Paket. Die habe ich auch bereits kontaktiert, die konnten mir aber auch nicht weiterhelfen.

Ich habe die Seite auch mal bei web.dev getestet und dabei kam beim Punkt Perfomance folgende Meldung: Reduce server response times (TTFB). Wegen dieser Meldung habe ich bei All-Inkl auch bereits gefragt ob es vielleicht am Server liegen kann, aber können da auch nicht weiterhelfen. Ansonsten kommt bei Perfomance noch folgende Meldung "Serve images in next-gen formats", wobei ich auch nicht so recht weiß wie ich das beheben könnte und ob das relevant ist.

Bei dem Test kamen jetzt folgende Ergebnisse:
First Contentful Paint 0.8 s
First Meaningful Paint 0.9 s
Speed Index 7.6 s (!)
First CPU Idle 7.1 s (!)
Time to Interactive 7.6 s (!)
Estimated Input Latency 80 ms (!)

Vielleicht habt ihr Tipps was ich da noch machen könnte oder woran das liegt. Vielleicht sollte ich auch statt dem Privat-Paket das Premium-Paket nehmen, da sich dort dann statt 100 nur 50 Kunden den Server teilen. Ich wäre euch sehr dankbar.

EDIT: All-Inkl veranlasst jetzt erstmal einen Wechsel auf einen neueren Privat-Server, mal sehen ob das etwas bringt.

[planepix]

Hallo Philipp,

zuerst: Tolle Seite und wunderbare Fotos!

Teste auch mal mit dem Tool: https://tools.pingdom.com/

Wenn ich hier die Website ein zweites Mal aufrufe erhalte ich schon andere Werte.
Getestet mit dem Standort Frankfurt / Main.

Deine Ergänzung zum Umzug auf einen anderen Server wäre mein nächster Vorschlag gewesen - das hatte ich ein paar Mal schon, das brachte eine Verbesserung. Ob der Wechsel auf ein größeres Paket mehr Speed bringt… bin ich mir nicht sicher in wieviel Prozent sich das auswirkt…

Sammeln wir mal die Erfahrungen.

[MacKP]

Hallo Philipp96,
ich glaub das sind einfach mehrere Dinge, die da bei dir zusammen spielen:
1. Die Summe der Teile ist dann schon recht hoch.
2. Alleine JS ist schon eine Datei mit 1.2 MB dabei, und da JS nicht einfach nur runtergeladen, sondern vom Browser interpretiert und umgesetzt werden muss, ist das dann noch mal ein größerer Zeitfresser
3. Die Einzelnen Bilder müssen auch erst mal verarbeitet und erstellt bzw. beim Lazy-Load dann erst mal angezeigt werden, wenn die dann wirklich im Viewport sind.

Ich habs mir jetzt nicht genauer angeschaut, aber eventuell solltest du noch mal schauen ob du am JS etwas machen kannst (etwas einsparen oder andere Scripte nehmen).
Dazu auf jeden Fall den Server Cache nehmen, da die Bilder sich ja z.B. nicht so häufig ändern. Da werden ja eher welche dazu kommen.

Dein Hosting Paket ist nicht gerade das Speed-Paket glaube ich. Ich hab jetzt nur keinen Vergleich von zwei unterschiedlichen Paketen bei All-Inkl um da abschätzen zu können ob ein größeres Paket besser wird. Eventuell kannst du das ja Ausprobieren und ggf. wieder zurück gehen.

Probiere auf jeden Fall mal PHP7.2 aus. Auch Contao 4.6 mit PHP7.2 sollte dann auch noch mal was bringen glaube ich (bin mir gerade nicht sicher, aber ich glaube Contao hat da noch mal ein wenig was dabei für neuere PHP-Versionen, was den Cache angeht).

Ansonsten könnte es schon schlimmer sein, was die Geschwindigkeit angeht. Das ist schon mal um längen besser als andere Seiten mit weniger Bildern die ich gesehen habe ;-)

Viele Grüße

[Philipp96]

Vielen Dank schonmal für die Hilfe. Ich werde mir das morgen nochmal genauer anschauen und gucken ob ich noch was optimieren kann.

Vielleicht liegt es auch ein bisschen an meiner Internetverbindung, die ist nicht die Beste. Teilweise hat das bei mir 10 Sekunden gedauert bis der Beitrag da war. Wenn gar nichts hilft kann ich das Premium-Paket ja mal ausprobieren, kann ja später wieder zurückgehen, falls das nichts bringen sollte. Ein Versuch wäre das wert.

[MacKP]

OK, wenn ich bei mir 3G einstelle, dann warte ich auch länger (ca. 11 Sekunden bei einer Detailseite die ich mir angeschaut habe).

Die meiste Zeit wartet mein Browser aber auch erst mal auf die HTML-Datei.

Viele Grüße

[stefan-at-work]

all-inkl bietet mittlerweile schon php 7.3


Gesendet von iPhone mit Tapatalk

[planepix]

Oh in meinem Paket noch nicht…

Ok, vor 3 Stunden noch nicht - jetzt aber. Danke!

[Philipp96]

Also den Umzug zu einem neueren Privat-Server hat All-Inkl letzte Nacht vollzogen, allerdings hat das in Bezug auf die Geschwindigkeit nichts gebracht. Habe da teilweise immer noch Ladezeiten über 10 Sekunden bei Beiträgen, die ich noch nicht vorher angeklickt habe.

Auf Contao 4.6 habe ich geupdatet und auch auf PHP 7.3 umgestellt. Dann werde ich es wohl mal mit einem besseren Hosting-Paket probieren.

[Physiklehrer]

- Responsive Images überall eingesetzt für diverse Auflösungen

Ich sehe vor allem hier das Problem. Für jede Auflösung muss der Server eine entsprechende Bildversion berechnen, deswegen kommt erstmal gar keine Antwort.

Was hilft: weniger verschiedene Bildgrößen und Auflösungen verwenden und Server-Cache. Bei Contao 4.6 kann man ja dank der neuen Technik auch bedenkenlos auf "1 Jahr" Cachezeit stellen. Ich weiß allerdings nicht, ob sich das auch auf den Bildercache auswirkt oder nur auf den Seitencache. Beim allerersten Besuch einer Seite wird es aber trotzdem immer lange dauern.

[Philipp96]

Servercache ist an. Und weniger Bildgrößen habe ich jetzt auch verwendet, ein paar für mobil muss ich aber dennoch setzen. Auf der Detailseite habe ich jetzt auch nur 3 verschiedene Bildgrößen (Headerbild, einspaltige und zweispaltige Galerie).

Langsam ist es aber immer noch. Selbst bei einem Beitrag wo ich ganze 5 Bilder auf der Seite eingesetzt habe, zeigt er mir im Perfomance-Test bei web.dev noch teilweise mehr als 5 Sekunden beim Speed-Index an. Dieser z. B.: https://neu.philippseibt.com/details/schloss-t.html

[tab]

Ohne Cache 1,34 Sekunden bis alles fertig ist und 0,8 Sekunden mit Cache (Javascript wird nicht gecached?!)

[Philipp96]

Ohne Cache 1,34 Sekunden bis alles fertig ist und 0,8 Sekunden mit Cache (Javascript wird nicht gecached?!)

Also bei mir laden die Beiträge um die 10 Sekunden, ohne Cache. Manchmal weniger, manchmal mehr, je nachdem wie viele Bilder zu sehen sind.

EDIT: Jetzt lädt es bei mir auch schneller. Ich werde es mal die nächsten Tage beobachten.