是否可以减少Google Chrome为我的网页分配的内存量？

Question

我正在尝试制作一个极简主义感觉的网站，因此我将全屏图片放在background-image body的背景上。我将transition: background-position 1s设置为body的CSS规则和缓动函数，以便在转到同一HTML文件中的其他页面时创建平滑的滚动效果（我没有实际的滚动条，只有导航元素）。我注意到的是，一旦我开始滚动，页面保留的内存从77MB小到超过500MB！我在Firefox中对此进行了测试，但似乎没有发生（因为页面没有单独的进程或内存分配的工作方式不同，我想）。为什么这会在Google Chrome中发生，而在其他浏览器中却不会发生？如何减少页面保留的大量内存？

提供一些有关我正在使用的信息：

• 浏览器：Google Chrome

• RAM：8GB该页面使用javascript 以下插件：

  • jQuery
  • 自举
• 背景图片尺寸为：1440 x 540

问题的几个可能原因：

• 图片太大，无法使用transition和缓动功能进行渲染。
• 我不应该使用background-image，而是创建一个新的<img/>作为背景。
• 我只是用Chrome中打开的开发工具检查了它，增加了分配的内存。
• 这不是造成问题的图像，而是我使用转换和缓动功能同时滚动背景图像的网页字体。

我想补充一点，也许这毕竟不是问题，只是我从来没有看到一个页面超过300MB的内存分配。

Answer 1

不确定是否应该将其作为评论发布，但是：

你无能为力。 Chrome交易RAM以提高性能。 例如，每个chrome选项卡都在其自己的进程上运行。

我有一个案例，当一个YouTube选项卡占用超过1.5GB的内存和放大器虚拟内存。 即使是空白标签也需要45mb内存。

因此，您的代码根本没有问题。