浏览器会话导致事件监听器增加

Question

我有一个页面，用于检查用户是否已登录，如果用户未登录，则会将其重定向到登录页面，并且我一直在使用Chrome开发工具中的事件监听器计数出现一些奇怪的行为。

当用户被重定向到登录页面时，成功登录，然后重定向回主页，事件监听器计数大约为6000.

当用户关闭选项卡时，然后导航回主页（这次跳过登录屏幕，因为他们的会话仍处于活动状态）事件监听器计数仅为4000。

什么可能导致事件监听器数量的巨大差异？同时加载同一页面，唯一的区别是会话已经建立......

有什么关于已经有一个活动会话导致事件监听器计数下降这么多？

Answer 1

时间轴选项卡显示选项卡内存的当前状态，而不是页面内存。这意味着它不一定只包含当前网站分配的内存。如果您使用相同的选项卡访问了几个页面，则前一页中的垃圾可能仍在选项卡内存中。

这就是为什么在新标签中你有预期的4000个听众，而在“旧”标签中，你曾经访问'home page'->'login page'->'home page'，你可以看到6000个听众。

您可以使用devtools左下角的“垃圾箱”按钮强制进行垃圾回收。单击它后，您会看到监听器数量下降。

BTW 您在网页上有4000多个事件监听器？这是很多。我没有看到一个有超过1000个听众的页面（这个页面有80个，twitter有200个，gmail有1000个）。如果你没有处理一些超级复杂的webapp（比gmail复杂4倍）那么你做错了什么。如果您使用的是jQuery，请确保您知道$('ul').on('click','li',function(){})的作用。如果您使用的是vanilla JS，请确保您已阅读有关事件冒泡以及它如何帮助您减少侦听器数量的信息。