Ladezeit verbessern .. aber wieso ist die Wartezeit so lange?
Redaktionelle Einordnung
Diese archivierte Diskussion behandelt Ladezeit verbessern .. aber wieso ist die Wartezeit so lange? aus Sicht der Rubrik OnPage Optimierung.
Technische Performance sollte heute mit Core Web Vitals, Renderbarkeit und realer Nutzererfahrung bewertet werden, nicht nur mit historischen Einzelmetriken.
Sinnvoll nutzbar bleibt der Thread vor allem als historischer Kontext, für typische Fragestellungen und zur Einordnung älterer Empfehlungen.
Einige im historischen Thread genannte Tools, Dienste oder externe Links könnten heute nicht mehr verfügbar oder inhaltlich überholt sein. Nutzen Sie sie bitte nur mit zusätzlicher Prüfung.
Startbeitrag
Originaler Foreninhalt in modernisierter Darstellung.
Hallo, ich habe mir mal die Ladezeit meiner Website mit
angeschaut. Beim Starten der Seite, und beim Laden der Bilder ist die Wartezeit sehr lange, an was liegt so was? Kann man da was ändern?
LG
Andi
Antworten
10 BeiträgeHallo Andi
Anzahl der Dateien veringern.
Javascipt , CSS zusammenfassen wenn möglich.
Oder alternativ Einsatz von dataurl wenn die gewählte Browserunterstützung es ermöglicht.
Bilder minimieren und/oder halt eben in einer CSS Sprite zusammenfassen. Alternative auch hier dataurl abhängig von der Browserunterstützung.
whitespaces reduzieren
Gruß
Jörg
Hallo Jörg,
joerg schrieb:
Bilder minimieren und/oder halt eben in einer CSS Sprite zusammenfassen. Alternative auch hier dataurl abhängig von der Browserunterstützung.
hierzu mal ein interessanter Test zu Data-URL:
cup.wpcoder.de/data-url-performance/
Gruß
hansen
Nepal Rundreisen
Hallo Hannelore
Was dieser Test meiner Ansicht nach nicht berücksichtigt ist die Dateigrösse der Bilder die man in eine dataurl umwandelt.
Sorry ab einer bestimmten Dateigrösse macht das keinen Sinn eine dataurl einzusetzen.
Da trifft auf die Fälle zu wenn der Datentransfer massiv zulegt gegenüber der normalen Datei.
Solange das aber ungefähr gleich ist was die Datenmenge betrifft dann ist der Einsatz absolut legitim.
Momentan setze ich dataurl in der Regel dazu ein kleinere Bilder so einzufügen.
Was natürlich keinen Sinn macht das Bild dann mehrfach so einzubauen das ist auch kontraproduktiv.
Und dann halt für die Korrekturen des CSS Seitenspezifisch.
Gruß
Jörg
Hallo Hannelore,
hansen schrieb:
hierzu mal ein interessanter Test zu Data-URL:
Man kann jede Technologie zu Tode testen.
Am schlimmsten aber sind jene Tests, wie der von dir Verlinkte, die die Technologie nicht verstehen (wollen).
Data-URL waren nie für die Übertragung großer Bilder gedacht, sondern immer nur für kleine Grafiken, die an verschiedenen Stellen einer Webseite benötigt werden.
Zitat aus der RfC 2397, Absatz 2. Description:
[quote]The "data:" URL scheme is only useful for short values.[/Quote]
Servus,
Klaus
Hallo Jörg,
joerg schrieb:
Sorry ab einer bestimmten Dateigrösse macht das keinen Sinn eine dataurl einzusetzen.
die Seite von Andi, um die ging es ja, enthält 10 Grafiken, da wäre er mit CSS-Sprites besser dran. Daher habe ich auch diesen Teil als Zitat gewählt:
Bilder minimieren und/oder halt eben in einer CSS Sprite zusammenfassen. Alternative auch hier dataurl abhängig von der Browserunterstützung.
Beim Rest stimme ich Dir voll zu.
@Klaus
Wegen der Menge an Grafiken von Andis Seite ist der Link meiner Meinung nach als Beispiel nicht schlecht.
Gruß
hansen
Nepal Rundreisen
Hallo Hannelore
Ohne mir jetzt mal die 10 Bilder anzuschauen. Als Ergänzung.
CSS Sprites sind geeignet für Hintergrundbilder. Nur welches Bild ich nun zu Designzwecken einsetze oder zu Zwecken der Struktur /Semantik das muss man dann von Fall zu Fall unterscheiden.
Wir sind schon schlimm das ganze Wissen zwar im Hinterkof dazu aber die ganzen Einzelheiten gehen dann dabei unter.
So ich hoffe das reicht jetzt um die Sache rund zu machen oder fehlt noch was?
Gruß
Jörg
Wenn du Wordpress als CMS für deinen Seite nutzt, dann kann ich dir das Plugin Total Cache empfehlen. Damit kannst du deine Performance um einiges steigern. Du kannst unter anderem festlegen, welche Skripte wann ausgeführt werden sollen und wie stark du Datein wie z.B. die CSS komprimieren möchtest...
Vielen Dank,
ich versuche gerade die Bilder mit CSS-Sprites einzubinden.
Hier stoße ich auch ein Problem.
Auf der Seite (Wordpress) wird eine Plugin Slideshow mit 4 Bildern verwendet. Diese werden beim Start der Seite geladen und sind damit 4 Requests.
Kann man diese denn auch mit CSS-Sprites einbinden. Oder gibt es sogar Wordpress Plugins die dies bereits integriert haben?
CU
Andi
Hallo Andi
Das geht sogar schon alleine mit CSS.
[css]
@keyframes time{
0%{background-position:0 0;}
100%{background-position:-2530px 0;}
}
#time{animation:time 60s infinite steps(23);
background:url("bild.jpg") no-repeat 0 0;
width:110px;height:78px;}
[/css]
Problem ist dann nur das ältere Browser wenn man diese unterstützen möchte einen Fallback mit Javascript benötigen.
Im einfachsten Fall sieht der Fallback so aus das ältere Brower nur das erste Bild sehen und es eben keine Slide Show gibt.
Gruß
Jörg
Danke Jörg ..
ich habe die Slideshow mal in CSS umgesetzt .. wieso für sowas ein Plugin nutzen
Macht es denn Sinn auch Bilder in der Größe (275 x 185 px ) durch Sprites zu laden .. oder ist es her nur kleine Icons sinnvoll?
CU
Andi