jquery 中 DOM 元素的手动垃圾回收是否可以提高浏览器性能？
在性能范围内，删除不再需要的元素是否有意义？或者浏览器是否对代码中未进一步引用的 dom 元素执行自动垃圾收集？
$('some_element').fadeOut(1000, function(el){
$(el).remove(); // <-- does this make sense at all?
});
with scope on performance, does it make any sense to remove elements that are not longer needed? or do browsers perform auto garbage collection on dom elements, that are not further referenced in code?
$('some_element').fadeOut(1000, function(el){
$(el).remove(); // <-- does this make sense at all?
});
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
此代码：
告诉浏览器您已完成该元素，并且在 DOM 中不再需要它。如果您的 javascript 中没有对该元素的任何其他引用，则垃圾收集器将释放它使用的内存。
如果您不删除它，那么只要该网页显示，DOM 元素就会保留在您的网页中。它永远不会被垃圾收集，因为浏览器无法知道您是否打算将其保留在页面中。
手动删除不再需要的 DOM 元素是一个很好的做法。
但是，在 99% 的情况下，这并不重要，因为与网页使用的总体内存相比，一个 DOM 元素使用的内存是微不足道的。无论如何，当用户转到另一个网页时，网页中的所有内容都将被释放。
释放这样的东西确实会产生重大影响的主要时间是当你一遍又一遍地执行相同的操作时（在一个大循环中，在计时器上，等等......）。在这种情况下，您不希望对象随着页面的使用而堆积并消耗越来越多的内存。
This code:
tells the browser that you are done with that element and no longer need it in the DOM. If you don't have any other references in your javascript to that element, the garbage collector will then free the memory that it uses.
If you do not remove it, then the DOM element stays in your web page for as long as that web page is displayed. It will never be garbage collected because the browser has no way of knowing whether you intend for it to stay in the page or not.
It is a good practice to manually remove DOM elements that are no longer needed.
But, in 99% of the cases, it will not matter in any way because the memory used by one DOM element is trivial compared to the overall memory used by a web page. Everything in the web page will be freed when the user goes to another web page anyway.
The main time that it does make a significant difference to free something like this is when you are doing the same operation over and over again (in a big loop, on a timer, etc...). In that case, you do not want objects to pile up and consume increasing amounts of memory as the page is used.
是的，这是有道理的。
仅当没有对 DOM 元素的引用时，GC 才会启动。虽然它仍然是 DOM 的一部分（
display: none实际上并没有删除它），但它会消耗内存，从 DOM 部分到事件处理程序等。如果您的意图是淡出元素 和 删除该元素（可能不再需要或删除 DOM 混乱），然后使用示例中的代码。
Yes, it makes sense.
GC should only kick in when there are no references to the DOM element. Whilst it is still a part of the DOM (
display: nonedoesn't actually remove it), it will consume memory, from the DOM portion to event handlers, etc.If your intention is to fade out the element and remove the element (possibly no longer needed or removal of DOM clutter), then use the code in your example.
fadeOut不会删除该元素。有趣的是，它所做的就是将其淡出。它执行一个将不透明度样式降低到0的动画。浏览器不会显示该元素，但它仍然存在于内存中。所以，是的，执行remove可能会节省一点内存，因为未附加的、未引用的 DOM 元素将通过垃圾收集来清理。话虽如此，您可能不需要费心，除非页面上有大量元素，或者您的页面将打开很长时间而无需重新加载页面（例如 AJAXy Web 应用程序）。
与往常一样，除非确实需要，否则不要花费大量精力进行优化。
另请注意，如果您确实非常想要优化，也可以在回调中执行此操作：
使用 DOM 元素而不是选择器字符串构造 jQuery 对象要快很多倍。
fadeOutdoes not remove the element. All it does is, funnily enough, fade it out. It does an animation that reduces theopacitystyle to0. The browser doesn't display the element, but it is still present in memory. So yes, doingremovewill probably save a little memory, because unattached, unreferenced DOM elements will be cleaned up with garbage collection.With that said, you probably don't need to bother, unless you have very large numbers of elements on the page, or if you have a page that will be open a long time without a page reload (e.g. an AJAXy webapp).
As always, don't go to lots of effort to optimise until you actually need to.
Note also that if you really, really want to optimise, you can also do this within the callback:
Constructing the jQuery object with a DOM element rather than a selector string is many times faster.
是的，它确实有意义，因为
remove方法负责删除附加在元素上的所有事件，并且它肯定会释放元素使用的内存。但是，浏览器会在超出范围时释放未使用的资源，例如导航到另一个页面或刷新页面。
Yes, it does makes sense because
removemethod takes care of removing all the events attached on the element and it definitely releases the memory utilized by the elements.However browser takes care of releasing unused resources one it is out of scope like you navigate to another page or refresh the page.