Was sind die besten Praktiken und Werkzeuge zur Verbesserung der Ladezeiten einer Website in der Webentwicklung?

"Do it like 2000..."

Reine HTML ohne PHP und andere Funktionen, keine Animationen, komprimierte Bilder, keine Videos, so wie zu Zeiten der Modemverbindnungen, wo nur 56k Übertragung max möglich waren. Da wurden Websiten sehr schlank und datensparend programmiert... Die wären heute sehr schnell in den Ladezeiten ^^

Leider kann ich nicht wirklich helfen, aber die heutigen Seiten sind ja wirklich schon oft sehr groß, hier und da Schickimicki usw... Bilder hochauflösend und unkomprimiert... Heutige Seiten bei Modemverbindnungen wären gar nicht mehr denkbar... Da könnte man nen Kaffee kochen, um die Startseite zu laden...

• Bilder komprimieren und zusätzlich zu JPEG in modernen Formaten (WebP, AVIF) anbieten
• Bilder, Videos, Iframes mit loading="lazy" laden, wenn diese "below-the-fold", also unterhalb des Bereiches, der beim ersten Laden sichtbar ist, sind
• Möglichst wenig JavaScript und vor allem keine großen Bibliotheken einsetzen
• HTML, CSS und JS komprimieren
• GZIP oder noch besser brotli verwenden, damit kann man teils 1/5 Größe einsparen
• JavaScript erst nach dem CSS und HTML laden (defer oder async)
• Insgesamt versuchen, die Größe und Anzahl der Ressourcen klein zu halten

Du kannst recht viel einsparen, in dem du wenig auf grossse Libraries setzt. Oder zumindest Libraries nutzt, die named exports anbieten. Somit importierst du nur die Funktionen, welche du wirklich brauchst.

Viele Build System filtern automatisch raus, welcher Code benötigt wird und welcher nicht.

Ansonsten gilt, weniger Code = schnellere Ladezeit.