molily: Gesonderte CSS-Datei für IE6,7,8

Beitrag lesen

Hallo,

Dann könnte sich das Layout bei Änderung der Viewportgröße (d.h. auch bei Drehen des Smartphones oder Tablets) nicht in Echtzeicht anpassen, sondern es verginge eine gefühlte Ewigkeit, bis das benötigte Stylesheet nachgeladen werden würde.

In der Praxis bringt die Änderung der Viewportgröße meistens das Laden von Inhalten mit sich: Seien es angepasste CSS-Hintergrundbilder, picture-Elemente oder sogar Textinhalte, die per Ajax geladen werden, weil mehr Inhalte parallel angezeigt werden können.

Das ist eher ein Feature von Responsive Design als ein Antipattern. Dass der Browser Stylesheets vorlädt, beschleunigt den Wechsel natürlich etwas. Letztlich ist es Abwägungssache: Die Browserhersteller haben sich entschieden, mehr potentiell unnötigen Traffic erzeugen, um die Performance eines bestimmten Anwendungsfalls zu verbessern.

Gibt es irgendeinen nachvollziehbaren, plausiblen Grund für die Entwickler, unnötig Dateien zu erstellen?

Wieso unnötig? Man muss doch hier unterscheiden:

Auf der einen Seite:

  • Beim Entwickeln sind viele kleine Dateien gut zu warten. CSS-Prozessoren machen es einfach, daraus mehrere Stylesheets nach gewissen Kriterien zu generieren, z.B. um die Mobile-First-Styles von denen für große Viewports zu trennen. Ein Smartphone müsste letzteres Stylesheet nie laden.
  • Das Nicht-Übertragen von nicht benötigten Daten und Inhalten ist grundsätzlich sinnvoll.
  • Also spricht vieles dafür, mehrere Stylesheets zu generieren, die vom Browser wahlweise geladen werden.

Auf der anderen Seite:

  • Bei HTTP 1.1 und den derzeitigen High-Latency-Mobilverbindungen sind viele HTTP-Ressourcen und dementsprechend -Requests schlecht. Das ist so ziemlich der einzige Grund, warum Lazy Loading so wenig verwendet wird und man lieber initial Megabytes an Inhalte pusht.

Letzteres sind Umstände, die sich eher früher als später mit HTTP 2.0 ändern werden.

Mathias