我有两个SVG图像,它们一起有大约8000行,由几个带渐变的形状组成.没有图案,过滤器,文本,只有带笔划的基本图形元素,简单或渐变填充.
目前,它们在生成时被内联注入HTML,因此源代码变得安静.这是否会降低动画的性能,因此最好不同地嵌入svg？
嵌入svg时是否有一般的经验法则？
问候菲律宾
如果您使用 HTML5 SVG 标签嵌入 SVG 内联，这不仅会增加 html 文件大小，还会使 DOM 和浏览器渲染器保持忙碌。
如果您使用 iframe，您并不真正知道它何时被加载或渲染，至少对于所有浏览器来说是这样。
HTML5 为您提供了 JavaScript，这可能是解决方案。只需等待主体加载，然后注入 SVG。
您可以使用body-onLoad或 jQueries read()-funktion
下面是它在 jQuery 中的实现方式：
<!DOCTYPE html>
<html>
<body>
<div id="svg-01" class="placeholder"></div>
<script src="path/to/jQuery.js"></script>
<script>
$(document).ready(function(){
$("#svg-01").replaceWith('<svg><!--// some svg //--></svg>');
});
</script>
</body>
</html>
我什至会更进一步，将其替换为 iframe 和gziped SVG，如此处所述。