如题所述，目前公司有一个 vue2 后台管理项目，代码量非常大，功能也非常多，大部分页面是列表+详情的组合，现在客户反馈打开我们的网页，开的 tab 多了之后，浏览器容易闪退，我自己试了下，内存占用可以到七八百兆。 目前看了一些内存优化的文章和分享，但是里面的垃圾代码是在太多，有大佬做过类似的优化或者看过类似的文章吗，或者提供下思路
This topic created in 934 days ago, the information mentioned may be changed or developed.
Supplement 1 · Apr 19, 2024
感谢各位的积极指导，抱歉未能一一回复，我们项目是有 keep-alive 缓存的，所以比如开了 A 列表，a 详情，B 列表，b 详情这种情况之后，单个浏览器 tab 页的内存就能占用到 7-800 兆，目前是垃圾代码太多了，几百个 vue 文件，想优化也无从下手的感觉
 |
1
公司为用户电脑增加内存，这是最低成本方案。
|
2 |
nitmaliApr 19, 2024
2
检查一下是否有内存泄漏的因素 闭包 定时器 乱 console.log 等等
检查一下是否有大量操作 DOM 检查是否有递归或者一次性生成大量数据什么的 |
 |
rekulasApr 19, 2024
3
加内存只是吃止痛药，还是要找到原因才行
可以考虑排查下是否存在内存泄漏的代码 https://facebook.github.io/memlab/ |
 |
wxf666Apr 19, 2024
4
什么浏览器，七八百兆就崩啊？我这常年几个 G 呢。。
不会是一个页面就七八百兆吧？抖音客户端，也是 Electron ，都才四五百兆啊。。  |
 |
cloverzrg2Apr 19, 2024
5
@wxf666 #4 都说了网页优化，那就是一个 Tab 的内存占用，肯定不是整个浏览器几十个 Tab 页面的内存占用啊
|
 |
TV1X6Na04Q52A20XApr 19, 2024
9
系统有做前端拆分么，如果拆过试试虚拟列表（延迟加载）。可以用 Lighthouse 分析下哪个环节的问题....
|
 |
geekvcnApr 19, 2024 via Android
10
让你客户把虚拟内存调大
|
 |
br_wangApr 19, 2024
11
看看有没有 Pb 之类的需要在浏览器环境以字符串 eval 成对应方法的类库，初始化是否正确。
以前遇到过代码按次新建 Pb 实例，对应方法字符串在内存多次保存的情况。 还有一些 chrome 的问题造成的内存泄漏，比如： https://github.com/vuejs/core/issues/5363 当然还有一些 vue 本身的问题造成的，比如： https://github.com/vuejs/core/issues/5256 |
 |
wangtian2020Apr 19, 2024
12
组件没有销毁？虚拟列表？
|
 |
IvanLi127Apr 19, 2024
13
本地复现出问题了吗？复现完慢慢拍快照看内存里都是啥。找到不正常的占用就可以开始改代码了。
|
 |
rb6221Apr 19, 2024
14
先静态扫描一下
首先内存泄漏肯定必须优化 然后再优化内存随便申请的问题 在这过程中摸索出适合你们团队的一套静态 es 规范，后续团队强制开启执行就行了 |
 |
VagabondHApr 19, 2024
15
你是说浏览器整个 700 - 800MB ，还是你们的网页直接就占到了 700-800MB 呢？ 大概率不是因为你们的项目过大，而是因为你们某些数据或者渲染 dom 的操作不当导致的，可以在占用大的 case 下用 performance 工具录了 10s 然后分析是因为内存问题还是渲染问题。
|
 |
16
@8355 😭如果可以一人加一条 32G 内存条就好了
|
|
17
@nitmali 这种代码太多了，代码迭代三四年了，什么写法都有
|
|
18
@rekulas #3 感谢大佬，我试下这个工具
|
Select Language