Fieser Bug bei externen SVG-Sprites

Das war es dann wohl erst einmal mit extern geladenen SVG-Sprites, dank Apple. Nico Brünjes hat herausgefunden, dass die aktuellen Safari auf dem Desktop und iOS für jedes Icon das externe Spritesheet erneut anfordern. Das kann zu enormen Übertragungen führen und geht bei mobilen Geräten direkt ins Geld. Die Reaktion bei ZEIT Online, wo Nico arbeitet, ist nun die Einbettung der SVG-Datei. Dadurch wird der Bug umgangen. Leider entfällt so auch das Caching der Datei. Mit jeder Seite wird das Set an Icons immer mitgeladen. Auf der anderen Seite spart diese Lösung Polyfills für einige Browser ein.

Da Apple betroffen ist, ist die Chance auf eine schnelle Lösung des Problems gleich Null. Der Konzern hat in den letzten Jahren klar gemacht, dass er sich für seinen Browser nur rudimentär interessiert und Kommunikation mit der Community sowieso ablehnt.

Der Bug im Safari ist einfach zu heftig, als dass man ihn ignorieren könnte. Die Auswirkungen gehen beim Endnutzer direkt ins Geld. Das können wir nicht wollen. Nico weist in seinem zweiten Artikel darauf hin, dass Apple sogar SVG-Features aus den modernen Safari entfernt hat. Das macht keine Hoffnung. Auf absehbare Zeit sollten wir die Option „externes SVG-Spritesheet“ aus unseren Projekten streichen.

7 Responses to “Fieser Bug bei externen SVG-Sprites”

  1. Tim sagt:

    Irgendwie traurig sowas… Zumal es alles andere als einfach ist, einen Safari zu testen, wenn man kein Apple-Gerät besitzt. Für IE Uralt gibt es ja wenigstens virtuelle Maschinen, Programme wie IETester etc.

    • Stimmt, da habe ich gar nicht dran gedacht, weil ich an einem Mac sitze 🙂 Microsoft hat nach vielen Jahren der Ignoranz den richtigen Weg eingeschlagen und überschlagt sich mittlerweile. Allerdings begegnen Entwickler noch immer dieser Firma mit allzu großer Vorsicht und Ablehnung. Apple erfährt diese Ablehnung seltsamerweise nicht, obwohl sie alles dafür tun. Es muss was mit dieser „Quasi-Religion“ zu tun haben 🙂

      Wär echt gut, wenn es kostenlose OSX-Images zum Testen gäb, wie bei Microsoft. Wobei mich selber als Apple-Nutzer der Safari nicht interessiert. Und für iOS braucht man eher ein Device, als eine Testumgebung.

  2. Ja, der Bug ist ärgerlich, insbesondere, weil man bei Apple wohl eher nicht mit einem zeitnahen Fix rechnen darf. Aber deswegen gleich die ganze Technik pauschal zu verdammen ist mir zu kurzsichtig.

    Ich habe z.B. ein Projekt, in dem das optimierte SVG-Sprite 1,4 KB wiegt und drei Icons enthält, von denen zwei auf jeder Seite je einmal benutzt werden und eines nach Bedarf, aber auch dann nur einmal pro Seite. Das macht im übelsten Fall 2,8 KB pro Seite, die nicht nötig wären, und *das* kann ich mit Inline-SVG oder anderen Techniken eher nicht kompensieren.

    • Da hast Du Recht. In einem solchen Fall müssen dann die Safari-Nutzer den Nachteil in Kauf nehmen. Und wenn Apple den Bug dann in drei Jahren beseitigt hat (oder SVGs ganz deaktiviert hat) …. 🙂

  3. Mat sagt:

    Mit https://www.browserstack.com gibt es ja durchaus die Möglichkeit Safari auf anderen Systemen zu testen. Sicher nicht so komfortabel wie mit einem echten Gerät, aber das ist auch eine Win-Virtualisierung auch nicht. Und für mich in den meisten Fällen auch die schnellste Möglichkeit Win-Systeme vom Mac aus zu testen ohne gleich die fette Virtualisierung starten zu müssen.
    Zum Punkt, dass Apple an Safari sonderlich interessiert ist, hätte ich dir noch vor ein paar Monaten recht gegeben. In den letzten Monaten ist aber endlich wieder Bewegung in die Entwicklung gekommen. Nicht nur die Website https://webkit.org wurde überholt, auch im Blog wird wieder transparenter kommuniziert und es gibt nun wie bei allen anderen üblich endlich auch eine Tech Preview. Und noch wichtiger: Es gab seit Jahren endlich auch weg vom üblichen 1-Jahres-OS-Rhythmus Safari-Updates (9.1 / 9.2) für OS X und iOS samt neuer Funktionen (picture, CSS Variablen, …), die endlich auch wieder etwas hoffen lassen.

  4. Tim Tepaße sagt:

    Andererseits kann man beim Webkit-Projekt nachgucken, was die da machen:

    • [Bug 156368](https://bugs.webkit.org/show_bug.cgi?id=156368)
    • [Changeset 199881](http://trac.webkit.org/changeset/199881) von heute, welches den Bug wohl beseitigt.

    Im worst case wird der fix wohl mit der nächsten major Revision von OS X beseitigt, das wäre dann September. Allerdings ist das Webkit-Team wohl proaktiver nach aussen geworden, insofern wäre ich hoffnungsfroh. Gucken wir mal in zwei Wochen in den lila Safari.

  5. Tilman sagt:

    Der Bug scheint nur dann aufzutreten, wenn die Icons als SVG external content integriert werden (). Werden die Icons als Hintergrundbilder von z.B. Pseudo-Elementen integriert, wird das Sprite lediglich einmal geladen.

    Dass Apple hier zurück baut ist schade, bzw. den Eindruck entstehen lässt, dass das so sein könnte. Mir fällt spontan kein Grund ein, warum sie daran ein Interesse haben sollten oder kein Interesse haben sollten, die Technologie nicht zu unterstützen.

    SVG-Sprites kann man also weiterhin verwenden ohne den Traffic von iOS-Nutzern in die Höhe zu treiben.