New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Safari greater 9 (desktop and mobile) downloads the external svg file for every icon on page #110

Closed
codecandies opened this Issue Mar 30, 2016 · 15 comments

Comments

Projects
None yet
9 participants
@codecandies

codecandies commented Mar 30, 2016

This may be a safari bug, but maybe you can dig into this better than me…

In this testcase http://phpscripts.zeit.de/svg-use-testcase/ you can see the problem, by loading and examining it with Chrome and a Safari greater 9 (exact version mentioned on the testcase). The problem is also seen in iOs safari, since 9.2 i guess (inspected with Charles proxy).

The problem

For every combination of the code

<svg class="svg-symbol" role="img" aria-labelledby="title">
    <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="icons.svg#svg-search"></use>
</svg>

the svg file icons.svg is (re-)downloaded by safari browsers. Additionally the file is not cached in the browser or ever served from cache, and the developer tools see this file not as image/svg+xml but as other.

This leads to extreme high content downloads, which is especially on mobile and may not a good development for svg for everybody, I guess. :(

@stefangrund

This comment has been minimized.

Show comment
Hide comment
@stefangrund

stefangrund Apr 5, 2016

Yep, we're experiencing the same bug on every website we're using external SVG sprites in Safari 9+...

stefangrund commented Apr 5, 2016

Yep, we're experiencing the same bug on every website we're using external SVG sprites in Safari 9+...

@martinwolf

This comment has been minimized.

Show comment
Hide comment
@martinwolf

martinwolf Apr 5, 2016

Yep, same here.

martinwolf commented Apr 5, 2016

Yep, same here.

@bjankord

This comment has been minimized.

Show comment
Hide comment
@bjankord

bjankord Apr 21, 2016

Here are some screenshots from the network panel in Chrome v50 and Safari v9.1

chrome-version50

safari-version9 1

bjankord commented Apr 21, 2016

Here are some screenshots from the network panel in Chrome v50 and Safari v9.1

chrome-version50

safari-version9 1

@martinwolf

This comment has been minimized.

Show comment
Hide comment
@martinwolf

martinwolf Apr 21, 2016

I also made a screencast (in german) showcasing the problem (and a different svg sprite solution).
https://www.youtube.com/watch?v=OAbmDlnq1UE

martinwolf commented Apr 21, 2016

I also made a screencast (in german) showcasing the problem (and a different svg sprite solution).
https://www.youtube.com/watch?v=OAbmDlnq1UE

@bjankord

This comment has been minimized.

Show comment
Hide comment
@elrumordelaluz

This comment has been minimized.

Show comment
Hide comment
@elrumordelaluz

elrumordelaluz Apr 21, 2016

There are open bugs, (maybe | probably) related, like this or this with comments like:

to my knowledge nobody is working on this at the moment

There is also this one with status: RESOLVED WONTFIX 🤔

However, maybe @dirkschulze knows something.

elrumordelaluz commented Apr 21, 2016

There are open bugs, (maybe | probably) related, like this or this with comments like:

to my knowledge nobody is working on this at the moment

There is also this one with status: RESOLVED WONTFIX 🤔

However, maybe @dirkschulze knows something.

@hexalys

This comment has been minimized.

Show comment
Hide comment

hexalys commented Apr 21, 2016

@dirkschulze

This comment has been minimized.

Show comment
Hide comment
@dirkschulze

dirkschulze Apr 25, 2016

@elrumordelaluz This particular issue was closed because it was filed against Chromium. Chromium doesn't use WebKit anymore but the fork Blink.

dirkschulze commented Apr 25, 2016

@elrumordelaluz This particular issue was closed because it was filed against Chromium. Chromium doesn't use WebKit anymore but the fork Blink.

@codecandies

This comment has been minimized.

Show comment
Hide comment
@codecandies

codecandies Apr 25, 2016

https://bugs.webkit.org/show_bug.cgi?id=156368 got a patch meanwhile, so a fix seems on the way, just not sure when it will land in (mobile) Safari.

codecandies commented Apr 25, 2016

https://bugs.webkit.org/show_bug.cgi?id=156368 got a patch meanwhile, so a fix seems on the way, just not sure when it will land in (mobile) Safari.

@dirkschulze

This comment has been minimized.

Show comment
Hide comment
@dirkschulze

dirkschulze Apr 25, 2016

@codecandies On Twitter I read that branching for WWDC was done yesterday. Usually there is another branch for the shipping product later. In any way it should get into the next version of mobile Safari.

dirkschulze commented Apr 25, 2016

@codecandies On Twitter I read that branching for WWDC was done yesterday. Usually there is another branch for the shipping product later. In any way it should get into the next version of mobile Safari.

@bjankord

This comment has been minimized.

Show comment
Hide comment
@bjankord

bjankord Apr 26, 2016

In terms of a fix for this issue in svg4everybody, I'm guessing an addition to the UA detection for the versions of Safari / Mobile Safari? cc/ @jonathantneal

bjankord commented Apr 26, 2016

In terms of a fix for this issue in svg4everybody, I'm guessing an addition to the UA detection for the versions of Safari / Mobile Safari? cc/ @jonathantneal

@fephil

This comment has been minimized.

Show comment
Hide comment
@fephil

fephil Jun 15, 2016

This was fixed in Safari 9.1.1/IOS 9.3.2. See: https://www.smashingmagazine.com/2016/05/safari-svg-sprite-bug/

Tested it with my projects and can confirm.

fephil commented Jun 15, 2016

This was fixed in Safari 9.1.1/IOS 9.3.2. See: https://www.smashingmagazine.com/2016/05/safari-svg-sprite-bug/

Tested it with my projects and can confirm.

@shawnbot

This comment has been minimized.

Show comment
Hide comment
@shawnbot

shawnbot Jun 15, 2016

Collaborator

Cool, so good to close then?

Collaborator

shawnbot commented Jun 15, 2016

Cool, so good to close then?

@fephil

This comment has been minimized.

Show comment
Hide comment
@fephil

fephil commented Jun 15, 2016

@shawnbot Yep.

@shawnbot

This comment has been minimized.

Show comment
Hide comment
@shawnbot

shawnbot Jun 15, 2016

Collaborator

Sweet, thanks everyone!

Collaborator

shawnbot commented Jun 15, 2016

Sweet, thanks everyone!

@shawnbot shawnbot closed this Jun 15, 2016

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment