Schnellere Bildladezeiten
Eingetragen von fhe_sol (14)am 22.07.2016 - 09:20 Uhr in
Hallo Community,
habe eine kleine Frage und vielleicht hat jemand darauf ja einen guten Rat und zwar:
Ich habe einen Node mit Inhalt und einem Fullwidth Header Image. Das Bild wird über Views eine Blockregion über dem INhalt fullwidth angezeigt.
Leider passiert es dass das Bild zum Teil beim Laden der Seite erst nach dem Text angezeigt wird.
Performanceverbesserungen Caching, Aggregration, Boost und Tinypng habe ich bereits alles verwendet und installiert jedoch passiert dieses Ereigniss immer wieder. Hat jemand da einen Rat wie das Bild schneller oder zumindestens zeitgleich geladen werden kann?
Viele Grüße & Danke
- Anmelden oder Registrieren um Kommentare zu schreiben
Verwendest Du das Modul ais?
am 24.07.2016 - 13:00 Uhr
Hallo,
probier das mal aus. Hier der Link: https://www.drupal.org/project/ais
Viele herzliche Grüße
Marita Betz
Halllo,hmm der Browser
am 25.07.2016 - 11:55 Uhr
Halllo,
hmm die Browser funktionieren nun mal so, dass Images asynchron geladen werden.
Stell Dir mal vor Du müsstest warten bis alle Images geladen werden, bevor die ganze Seite
angezeigt wird.
Also die HTML Seite mit dem DOM Tree wird geladen,
dann werden alles Ressourcen im HTML asynchron geladen.
Der Effekt das die Bilder langsam geladen werden tritt eigentlich,
nur auf, wenn der User das erste mal auf die Seite geht.
Wurde die Seite einmal gerendert, sollten eigentlich alle Ressourcen
vom lokalen Browser Cache geladen werden (Das geht sehr schnell!).
Ich kenne eigentlich nur einen Weg die Bilder aus Drupal schneller ausliefern zu lassen:
Du müsstest die Bilder von einem anderen Webserver (light httpd?) aus laden lassen,
welcher keinen PHP Interpreter hat und nur die Images von Drupal Verzeichnis ausliefert
Dadurch muss kein PHP Interpreter geladen werden um Bilder zum Browser zu senden.
MfG
Robert
PHP liefert in der Regel nur bei private files diese aus
am 25.07.2016 - 13:08 Uhr
Ich kenne eigentlich nur einen Weg die Bilder aus Drupal schneller ausliefern zu lassen:
Du müsstest die Bilder von einem anderen Webserver (light httpd?) aus laden lassen,
welcher keinen PHP Interpreter hat und nur die Images von Drupal Verzeichnis ausliefert
Dadurch muss kein PHP Interpreter geladen werden um Bilder zum Browser zu senden.
Es ist richtig, daß lighttp oder nginx reine Files schneller ausliefern kann als der Apache-Webserver. Letzteren kann man zwar oft auch tunen und z.B. diue Verarbeitung von ".htaccess"-Anweisungen verbieten, wenn man die relevanten Regeln direkt in die Config übernimmt. Aber die PHP-Verarbeitung hat nur dann einen Einfluss, wenn Drupal explizit de Files per PHP ausliefert. Das geschieht in der Regel nur bei private Files. Hier möchte man eigentlich auch dies nicht umgehen mit anderen Technologien, die wiederum nicht überprüfen (können), ob der Zugriff auf ein File erlaubt ist.
Bei Bildern sollte man immer zunächst mal diese optimieren bezüglich Auflösung und Komprimierung und/oder Farbtiefe, bevor man die Webanwendung misstrauisch anschaut. Je kleiner die Datei um so besser. In modernen Browsern kann man Bilder, die ohnehin auf Vektoren basieren bei den Grafikern (oft bei Logos) dann per SVG (auch noch mal auf notwendige Pfade reduziert) ganz kleine Datenmengen bekommen.
Im Frontend kann man dann viele Tricks anwenden, um massenhafte Datei-Abfragen zu reduzieren mit CSS/JS-Aggregation und z.B. manuell mit CSS-Sprites. Es gibt auch die Möglichkeit, kleinere Bilder (z.B. Icons) direkt als Bild-Informationen ins CSS zu bekommen.
Mein Kooperationspartner Walter Ebert hält zum Thema Frontende Performance insbesondere auch über Bild-Einindung regelmäßig Vorträge auch in der Drupal-Community. Seine Slides hat er auf seiner Website verlinkt: http://walterebert.de/
Zitat:C_Logemann
am 25.07.2016 - 15:28 Uhr
C_Logemann schrieb
Aber die PHP-Verarbeitung hat nur dann einen Einfluss, wenn Drupal explizit de Files per PHP ausliefert. Das geschieht in der Regel nur bei private Files. Hier möchte man eigentlich auch dies nicht umgehen mit anderen Technologien, die wiederum nicht überprüfen (können), ob der Zugriff auf ein File erlaubt ist.
Dem kann ich nur bedingt zustimmen:
Man muss es einfach richtig konfigurieren:
https://www.nginx.com/resources/wiki/start/topics/recipes/drupal/
Der NGIX läuft ja als Reverse Proxy und soll nur statischen content ausliefern.
Ein direkter Zugriff den URL eines Files würde auch hier direkt auf NGIX(der ja auf einem anderen Port läuft) einen 403 auslösen.
Dies wird vorwiegend gemacht um das Apache " c10k problem" zu lösen.
Und kann z.B: durch Load Blancing sehr hoch skaliert werden.
Es bringt zwar weniger als bei public files aber es bringt etwas!
Man darf nicht vergessen dass NGIX stqatischen content besser cached, schneller ausliefert und besser skalierbar ist als .Apache.
Ausserdem reduziert er die Requests und Bandbreite(wenn anderer Server) auf dem Server wo Drupal läuft.
Oben geht leider nicht hervor ob er ein public oder private Filesystem nutzt
und um wieviele Images bzw. gleichzeitige Benutzer es geht.
Grüsse
Robert
PS: Da gibt es auch ein Drupal Modul für NGIX https://www.drupal.org/project/nginx_accel_redirect