Javascript "ASYNC"

[mrBurns]

Servus Jungs und Mädels,

Neues Projekt, wie ihr in der SIG seht.
Jetzt kann ich das auch Hauptberuflich machen

Dieses mal geht es um Google in meiner Frage,
responsive webdesign sind gross im kommen und das auch bei Googel und wird
belohnt.
Das "Usererlebnis" hab ich schon optimiert nun geht es um den Page Speed den Google
bemängelt. Am meinst hackt es an Java Scripte, bei mir 25 Stück.
Kann ich diese auch alle "Async" laden ohne das der Shop dann nichtmehr will oder fehler macht?
Die Option "inline" fällt bei der Grösse der Scripte flach.

lg aus Tirol
Bani

 

[x86]

AW: Javascript "ASYNC"

Hallo mrBurns,

sicherlich bietet das asynchrone laden von Javascript viele Vorteile, schnelleren Seitenaufbau, besseren Google Page Rank etc.
Allerdings wird das "async" Attribut vom IE9 nicht interpretiert, ich würde dir empfehlen dein Javascript vorerst als minified einzubinden (falls noch
nicht gesehen) und deine Template spezifischen Scripts (JS) aus dem Header kurz vor deinen Footer zu verschieben, damit diese nichtmehr "above the fold" sind.

Natürlich können auch alle über Javascript einbundenen Javascript Scripte aus dem head entfernt werden,
was dabei enorm wichtig ist: JTL bindet ein dutzend Module für jQuery ein, die Einbindung von jQuery MUSS vor der Einbindung von etwa
simplemodal und simplezoom ein (um nur zwei zu nennen) .
Anschließend würde ich Funktionen wie das Warenkorb Popup (jquery.modal) testen, als auch die Fancybox und den Bestellvorgang (Widerrrufsbelehrung etc.)

Die wohl "beste" und zugleich " gefährlichste" Möglichkeit deine Ergebnisse beim Insight Test von Google zu optimiert
wäre mit bloßen Javascript und dem onload-Event dein komplettes Javascript zu laden, indem in Javascript ein Script-Element "gebaut" wird
mit den Urls deiner Javascript Dateien. Anschließend diese Container deinem DOM hinzufügen


Grüße Stephan

 

[martinwolf]

AW: Javascript "ASYNC"

Das funktioniert soweit, bis Plugins von Drittanbietern mit im Shop laufen. Die sind in der Regel verschlüsselt und laden im Header immer on document.ready und nicht asynchron. Deswegen kannst du schonmal davon ausgehen, dass mindestens jquery und ggf. die migrate Lib immer im Header und nicht asynchron geladen werden müssen.