iOS Safari中SVG文件的大小限制

Question

iOS Safari中SVG文件的大小限制

6

我正在开发一个移动网站，使用IMG标签显示SVG文件。SVG文件大小约为500 kB。在Android版本的Firefox和Chrome中，图像呈现正常。然而，在iOS Safari中，我只能看到一个带有问号的微小蓝色框，这是一种令人恐惧的情况。

我知道iOS对图像文件大小有限制。根据苹果公司的Safari Web Content Guide：

最大解码GIF、PNG和TIFF图像的大小为3百万像素，适用于RAM小于256 MB的设备；对于RAM大于或等于256 MB的设备，最大解码大小为5百万像素。也就是说，确保宽度*高度≤3*1024*1024适用于RAM小于256 MB的设备。请注意，解码后的大小远大于图像的编码大小。

我想SVG文件的大小有一定的限制，但由于它们是矢量化的，用解码像素来描述它们的大小并没有太多意义。有人知道SVG文件的限制是如何确定的吗？

附注：当我直接浏览SVG文件而不是通过HTML页面时，我能够查看图像。我也能够在IFRAME中查看SVG文件。但不能使用IMG标签。

- David G.

在幕后，浏览器仍会呈现矢量图形，并将其视为带有图像标签的位图，因此相同的约束条件适用。您的SVG尺寸是多少？您的SVG中是否嵌入了数据URI？ - methodofaction

在我的情况下，呈现的SVG文件的大小是根据视口的尺寸确定的。在iPhone上，它可能是600x600左右。在iPad上，它可能更接近1500x1500。通过我的计算，这些尺寸仍符合我上面发布的限制。 - David G.

是的，那些尺寸不会给你带来麻烦，所以你可以放弃它。然而，500 KB 的向量图像太大了，你有嵌入位图图像吗？ - methodofaction

我同意500 KB很大。虽然没有位图，但这是一张非常复杂的图片。有很多细节，但大部分只有在用户放大时才能看到。 - David G.

这些限制是否仍适用于更近期的iOS Safari版本？ - trysis

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- David G. · Accepted Answer

我制作了一些不同尺寸的SVG测试文件。它们看起来像这样：

<?xml version="1.0"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="2000" height="2000" xmlns="http://www.w3.org/2000/svg">
    <text x="100" y="100" font-size="50">2000x2000</text>
</svg>

使用BrowserStack模拟iPhone 5和第三代iPad时，我发现故障点在2200x2200和2400x2400像素之间。 500万像素限制对应于2289x2289的图像，因此这与Duopixel's comment声称呈现大小是重要的一致。