Performance 隐藏屏幕外SVG元素

我使用D3渲染几百个svg元素。但是，在视口中同时可见的对象很少

所以我想我可能可以通过删除屏幕外的元素，并在它们被卷回视图时重新创建它们来提高性能

这是一个合理的假设吗

---

有什么工具可用于这样的事情吗？

更一般地说，请查看并了解元素或组重用。例如，您可以生成对象的“池”，并应用平移将其定位在视口内部或外部

如果您只是担心它们不可见，您可以在元素的边界之外实例化不需要的，然后

转换（“translate（x，y）”）

在需要时将它们转换到视图中

---

如果您不希望它们在需要之前存在，请将它们的属性（包括初始位置和您需要的任何其他属性）存储在对象数组中，并在屏幕上的初始位置实例化它们。这将提供更好的性能优势。

对于任何要隐藏的SVG元素，您只需将

display

属性设置为

none

document.getElementById（“不需要的”）.style.display=`none`

谢谢。不过，我的目标是减少dom元素的数量，据我所知，使用“use”仍然会渲染元素……是的，这就是我的想法。你知道有哪家图书馆会这样做吗？这就是通过只保留可见的元素和删除不可见的元素来减少dom元素的数量？@Ofri如果您能够将不需要的dom元素指定为独立于您希望可见的元素（例如，给它们一个单独的类），则可以使用jQuery删除它们。我的目标是保存dom元素。将“显示”设置为“无”有助于提高性能吗？啊，对不起。我知道我没有正确地阅读你的问题。有可能
display:none
可能会有所帮助，但我希望大多数SVG实现都会检查元素是否在屏幕上。有可能你做了大量的工作，却没有任何好处，甚至没有多少成本。