critical css gulp workflow für eine bessere Benutzer Erfahrung

Wenn es um den Kritischen Rendering Pfad geht, ist das Ziel, dass insbesondere mobile Browser sehr schnell mit dem Rendering der Website anfangen können. Dem Besucher kommt die Reaktion der Website dann schneller vor, als wenn der Browser erst das gesamte CSS lädt und danach die Website rendert. Gerade bei Verbindungen jenseits von LTE, ist ein Render blockender Abruf von CSS, Webfonts, JS ein wahrer Dämpfer des Seitenaufbaus.

Irgendwann im Laufe der Zeit stellte das Web zum Beispiel fest, dass Javascript gar nicht im <head> geladen werden muss, sondern es völlig ausreicht das meiste Javascript vor dem </body> einzubinden. Bis dahin darf der Browser den DOM und das CSSOM erstellen.

Dank Google Pagespeed oder dem schickeren TestMySite rückt jetzt das CSSOM in den Fokus des Rendering.

Weiterlesen