使用JavaScript卸载HTML上的资源

我正在开发一个HTML5游戏，它已经上线了，但是它现在很小，一切都很好

事情是，随着它的发展，它将加载很多很多图像、音乐、音效等等。在玩游戏15分钟后，可能已经加载了至少100种不同的资源。因为它是一款HTML5应用程序，所以在游戏过程中它从不刷新页面，所以它们都堆叠在后台

我注意到，一旦我将

和

删除到CSS中，我加载的每个资源（至少在WebKit上，使用Web Inspector）都会保留在那里。我猜它还在记忆中，只是没有被使用，对吗

这最终会消耗大量RAM，并导致性能下降，特别是在iOS和Android手机上（我在当前版本中已经略微注意到了），它们的资源比台式电脑更为有限

我的问题是：是否可以通过JavaScript完全卸载资源，释放RAM中的空间？无需刷新整个页面即可“清理”

最糟糕的情况：通过删除一个框架，使用框架是否有助于释放这些框架的资源

---

谢谢大家!

你说的最糟糕的情况是：通过删除一个框架，使用框架是否有助于释放这些框架的资源

---

使用框架是很好的。是的，它可以通过删除帧来释放资源。

您所能做的就是依赖JavaScript内置的垃圾收集机制

当没有提及你的形象时，这会起作用

因此，假设每个图像都有一个参考指针，如果使用：

img.destroy()

或

值得一看：

此外：

编辑

下面是一些允许您将图像加载到var的代码

<script language = "JavaScript">


var heavyImage = new Image(); 
heavyImage.src = "heavyimagefile.jpg";

......

heavyImage = null; // removes reference and frees up memory

</script>

var heavyImage=新图像（）；
heavyImage.src=“heavyimagefile.jpg”；
......
heavyImage=null；//删除引用并释放内存

这比使用JQuery.load（）更好，因为它可以让您更好地控制图像引用，如果引用不存在，它们将从内存中删除（

null

）

摘自：

---

希望有帮助

您的描述意味着您已经完全删除了对资源的所有引用。因此，您看到的行为只是垃圾收集器没有被调用来清理空间，这在javascript实现中很常见，直到“必要”时才被调用。设置为

null

或调用

delete

通常不会有什么效果

通常情况下，您可以在场景加载/卸载期间调用

CollectGarbage（）

，以强制执行收集过程。这通常是为游戏“阶段”加载数据时的最佳解决方案，因为这是一个非时间关键的时间。您通常不希望收集器在游戏过程中调用，除非它不是一个非常实时的游戏

---

如果您想为常见游戏控件保留某些资源，框架通常是一个困难的解决方案。你需要考虑是否刷新整个资源或只是某些资源。

好的，所以我已经通过将3个不同的HTML加载到<文章>标签中进行了测试。每个HTML都有许多巨大的图像。每个“页面”大约有15幅巨大的图像

因此，我使用jQuery.load（）函数将每个元素插入标记中。还有一个额外的HTML，只有一个

，用来查看没有图像的页面替换上一页时发生了什么

嗯，当你开始滚动的时候，内存会变大，当你浏览一个特别大的图像时，内存会上升（尺寸和大小一样大，而不仅仅是大小）。但一旦你把它抛在脑后，屏幕上就会出现更亮的图像，内存消耗实际上会下降。每当我用JS替换页面内容时，当它占用大量内存时，内存消耗就会下降。虚拟内存一直很高，很少下降

所以我猜浏览器在处理资源方面相当聪明。如果你把它放在那里很长一段时间，它似乎不会卸载它们，但一旦你开始加载其他页面或滚动，它就会开始加载/释放

我想我根本没什么好担心的

---

谢谢大家！=）

除了普通的

src=“data:image/jpeg；base64，/9j/MASSIVE-STRING…”之外，还有两种更好的加载图像的方法。

使用此方法后，您当然希望使用其他答案中讨论的方法删除此节点。（我不知道如何生成这个base64字符串，试试谷歌或视频）

---

您可以尝试做的一件事是将相应的资源句柄设置为

null

。只要资源不再从任何地方引用，它使用的内存就应该由javascript引擎进行垃圾收集。我要试试！谢谢你介意和我分享一个关于如何访问浏览器加载的资源的示例链接吗？我很难在Google=/Firefox和Chrome上发现，当切换到另一个选项卡时，垃圾收集器似乎在运行。我不确定这对你有多有用，但是如果用户没有继续玩，你应该相信垃圾收集器。它能工作吗？至少这是一个故障保护。例如，我可以在一个帧中加载整个战斗，一旦完成，就杀死它。我会试试看它的反应如何。我不鼓励使用框架。他们实际上删除了HTML5中的

标签，我不喜欢框架。这就是为什么我不想使用它们，因为每个部分都是通过jQuery.load（）加载的，jQuery.load（）插入带有标记的HTML以及其他内容。事实上，一切都是这样。通过删除它们，它们仍然可以在Web检查器中看到。你的意思是我应该从JavaScript中加载每个图像，以便能够从JavaScript中“卸载”它们吗？听起来很棒。尽管如此，通过这种媒介实现游戏中的所有内容都会让人失望

<script language = "JavaScript">


var heavyImage = new Image(); 
heavyImage.src = "heavyimagefile.jpg";

......

heavyImage = null; // removes reference and frees up memory

</script>