堆内存申请失败？可能是这些原因在作怪

你有没有遇到过网页卡死、浏览器直接崩溃的情况？尤其是打开几个复杂页面或运行大型 Web 应用时，控制台突然弹出一条错误：‘堆内存申请失败’。听起来挺吓人，其实这背后的原因并不神秘，搞清楚之后能帮你快速定位问题。

系统可用内存不足

最直接的原因就是电脑本身内存快被吃光了。比如你一边开着 Chrome 浏览十几个标签页，一边跑着 PS 和视频会议软件，系统剩余内存所剩无几。这时候浏览器再想申请堆内存，操作系统根本拿不出空间，自然就失败了。

这种情况在老款笔记本或者 8GB 内存以下的设备上特别常见。特别是当你打开像 Figma、Notion 这类重型 Web 应用时，它们在后台会大量分配 JavaScript 对象，瞬间推高内存占用。

浏览器内存限制被触及

很多人不知道，浏览器对每个进程都有内存上限。以 Chrome 为例，V8 引擎对 32 位进程的堆内存限制大约是 700MB～1.4GB，64 位会更高，但也不是无限的。一旦页面中的对象太多没释放，比如不断生成 DOM 节点却没移除，堆内存就会持续增长，最终触发 Allocation failed - JavaScript heap out of memory 错误。

内存泄漏拖垮页面

代码写得不注意，很容易造成内存泄漏。比如你在事件监听时绑定了匿名函数，后来忘了取消；或者全局变量不断累积数据，像缓存没做清理机制。时间一长，本该回收的对象一直被引用，垃圾回收器（GC）也无能为力。

举个例子：

let cache = [];
setInterval(() => {
    cache.push(new Array(100000).fill('leak'));
}, 100);

这段代码每 100 毫秒就往 cache 里塞一大块数据，而且 never 清理，堆内存迟早爆掉。

扩展程序暗中捣乱

浏览器插件也是潜在元凶。有些广告拦截工具或脚本管理器会在每个页面注入大量逻辑，尤其当你访问结构复杂的网站时，它们可能反复创建闭包和监听器。个别质量差的扩展甚至存在内存泄漏，多开几个页面就拖慢整个浏览器。

可以尝试在隐身模式下打开相同页面，如果问题消失，那基本可以锁定是某个扩展惹的祸。

大文件处理不当

现在很多人用浏览器处理大体积 JSON、图片批量上传、甚至本地视频编辑。这类操作如果不分块处理，而是直接把整个文件读进内存，很容易超出堆限制。比如用 FileReader 一次性加载一个几百 MB 的日志文件，JavaScript 堆瞬间就被撑爆。

合理的做法是使用流式处理或分片读取，避免单次申请过大内存块。