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

问题描述

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

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

• 浏览器：谷歌浏览器

• 内存：8GB该页面使用javascript和以下插件：

  • jQuery的
  • 引导程序
• 背景图片尺寸为：1440 x 540

问题的一些可能原因：

• 图像太大，无法使用transition和缓动功能进行渲染。
• 我不应该为此使用background-image ，而是创建一个新的<img/>作为背景。
• 我不知何故只使用在Chrome中打开的开发人员工具进行了检查，以增加分配的内存。
• 不是导致问题的图像，而是我使用过渡和缓动功能同时与背景图像同时滚动的Web字体。

我想补充一点，也许这甚至根本不是问题，只是我从未见过内存分配超过300MB的页面。