console.log 会导致内存泄漏吗

console.log 会导致内存泄漏吗

经常看到一些文章说 console.log 会导致内存泄漏,这是真的吗?那以后是不是不能用 console.log 了?

这些说法多少有些以偏概全。先说结论:

  1. nodejs 中 console.log 不会导致内存泄漏
  2. 浏览器中使用 console.log 打印对象时,会导致内存泄漏(无论打不打开开发者工具)
  3. 少量的内存泄漏根本就不在乎,如果是循环中打印大量的对象,就要注意了

打印基本类型的数据时肯定不会造成内存泄漏。而在浏览器控制台打印对象时,由于需要保存对象的引用(以便随时查看对象的详细信息),因此表面上我们在程序中不再使用这个对象,但是控制台中还有这个对象的引用,导致对象无法被回收,从而造成内存泄漏。

html 复制代码
<body>
  <button>打印</button>

  <script>
    const btn = document.querySelector('button')
    btn.addEventListener('click', () => {
      // 大概 4MB 大小的数组
      console.log(new Array(1024 * 1024).fill(0))
    })
  </script>
</body>

上面代码中,每次点击按钮都会打印一个 4MB 大小的数组,打开浏览器任务管理器(shift + Esc),观察网页所占用的内存,

可以看到,不管打不打开浏览器开发者工具,内存都会持续增长,这就是内存泄漏。

那以后到底用不用 console.log 呢?其实很简单,开发环境用无所谓,生产环境借助打包工具自动帮助我们删除代码中的 console.log 即可。

以 vite 为例,只需要安装 terser,并在 vite.config.js 中配置 build 选项即可:

javascript 复制代码
export default {
  build: {
    minify: 'terser',
    terserOptions: {
      compress: {
        // 删除 console 语句
        drop_console: true,
        // 删除 debugger
        drop_debugger: true,
      },
    },
  },
}

不要轻视内存泄漏,但也不要害怕内存泄漏!全局变量不会被 gc 回收,某种意义上也相当于内存泄漏,那会有人因此不用全局变量吗?

所以说 console.log 导致的内存泄漏压根就不是事儿!

参考

相关推荐
m0_74824780几秒前
Flutter Intl包使用指南:实现国际化和本地化
前端·javascript·flutter
qq_433554547 分钟前
C++ 面向对象编程:+号运算符重载,左移运算符重载
开发语言·c++
数据小爬虫@26 分钟前
如何高效利用Python爬虫按关键字搜索苏宁商品
开发语言·爬虫·python
ZJ_.28 分钟前
WPSJS:让 WPS 办公与 JavaScript 完美联动
开发语言·前端·javascript·vscode·ecmascript·wps
Narutolxy33 分钟前
深入探讨 Go 中的高级表单验证与翻译:Gin 与 Validator 的实践之道20241223
开发语言·golang·gin
Hello.Reader41 分钟前
全面解析 Golang Gin 框架
开发语言·golang·gin
禁默1 小时前
深入浅出:AWT的基本组件及其应用
java·开发语言·界面编程
Code哈哈笑1 小时前
【Java 学习】深度剖析Java多态:从向上转型到向下转型,解锁动态绑定的奥秘,让代码更优雅灵活
java·开发语言·学习
joan_851 小时前
layui表格templet图片渲染--模板字符串和字符串拼接
前端·javascript·layui
程序猿进阶1 小时前
深入解析 Spring WebFlux:原理与应用
java·开发语言·后端·spring·面试·架构·springboot