引入腾讯地图，电脑内存CPU占比升高，卡顿问题

最近在做一个项目，需要应用腾讯地图，但是每当进入包含腾讯地图的页面，电脑内存占比就会持续升高，没过几次，电脑就会变的非常卡顿，

这是没有进入地图页面之前的内存占比：

这是进入地图页面几次后的内存占比，并且该内存占比并不会下降的很快，对于一般的笔记本而言就会造成非常严重的卡顿问题。

查询了许多资料都没有找到相对应的解决方法，最后还是前辈一针见血的指出问题，可能是地图实例被多次创建，占用大量缓存的问题，找到问题所在就非常容易解决问题了，这里有两种方式：

1、可以通过对地图的DOM节点进行删除的操作，在页面退出销毁之前，清除地图所在的DOM节点，可以通过v-if进行实现

2、这一种是比较推荐的方式，在腾讯地图官方文档中查找销毁地图实例的方法，可以通过map.destroy()方法，在页面销毁之前进行地图实例的销毁

map.destory()

再次进入地图页面可以看到，电脑的内存占比不会持续升高，会维持在一个固定的范围，并且在退出页面之后，内存的释放也非常迅速，不会造成应用网站的卡顿现象。

除此之外，除了内存的升高，在地图组件或者其他组件引入的时候还要注意cpu的占用情况，此处非常注意，在使用需要加载大量资源创建实例的组件的时候，不论是什么项目，以vue为例，尽量不要将创建的实例存储在data中，这样会在进入该页面的时候占用耗费大量资源，导致网页应用卡顿，如图：

上图可以看到，cpu的占用耗费是非常高的，并且难以下降

这里有一个解决办法，就是在vue页面内声明一个全局变量用来接收实例对象，在页面的销毁的时候在进行释放，这样操作会有效减少cpu的占用情况，提升网页应用运行速率。

以上仅为个人见解

引入腾讯地图，电脑内存CPU占比升高，卡顿问题相关推荐

[微信小程序]小程序引入腾讯地图选点插件出现：未取得授权
问题:小程序引入腾讯地图选点插件出现:未取得授权在微信小程序引入腾讯地图选点插件:官方文档 1.微信小程序接入腾讯地图服务,申请Key 2.在 app.json 中添加 "plugins& ...
Vue引入腾讯地图（搜索获取定位）
效果: 申请腾讯地图 1.首先进入腾讯位置服务登陆/注册,地址:https://lbs.qq.com/ 2.进入控制台,点击左侧菜单应用管理-我的应用,点击右上方创建应用,填写内容如下 WebServ ...
angular项目(TS)引入腾讯地图报找不到qq
文章目录在angular项目中引入腾讯地图问题解决结尾在angular项目中引入腾讯地图在index.html文件中script标签加载API服务 <script charset=&q ...
如何应对CPU帧率瓶颈和卡顿？腾讯游戏学院专家带你剖析
CPU上帧率低和卡顿是性能优化中最易出现的一部分,尤其对于手游,提到卡,就大概率是在CPU上出现的问题,CPU上的卡顿一般是卡逻辑或是卡渲染,本篇将详细系统的介绍基于UE的手游对CPU瓶颈的剖析方法. ...
bilibili有电脑版吗_你体验过电脑版的《和平精英》吗？不用担心内存，也不用担心卡顿...
大家好,欢迎来到<刺激实战教室>,我是你们的老朋友刺激哥.不知道大家在玩<和平精英>的时候,有没有体验过电脑版的<和平精英>. 刺激哥在搜索<和平精英> ...
计算机win7卡顿如何解决方法,win7电脑玩2D游戏经常发生卡顿六大解决方法
最近有很多游戏玩家和小编说win7电脑玩2D游戏经常发生卡顿,游戏卡顿问题确实让玩家苦恼,因为导致2D游戏经常发生卡顿的原因有很多种,那么win7电脑玩2D游戏经常发生卡顿怎么办?不要着急,针对此问题 ...
豆客游戏cs 服务器全部没响应,Win7电脑正常下玩CS画面卡顿死机如何解决
电脑死机是由于无法启动系统,画面"定格"无反应,鼠标.键盘无法输入,软件运行非正常中断等,最近就有很多小伙伴反映Windows7正常下CS画面卡顿死机,遇到这种情况我们具体该怎么解 ...
电脑升级Win11后不流畅卡顿怎么解决
电脑升级Win11后不流畅卡顿怎么办?最近有不少用户把自己的电脑升级到最新的Win11操作系统之后,却发现自己的电脑卡顿,遇到这种问题我们应该怎么解决呢?下面我就带着大家一起看看吧! 解决方法: 方法 ...
电脑升级Win11后不流畅卡顿怎么办？
电脑升级Win11后不流畅卡顿怎么办?最近有不少用户把自己的电脑升级到最新的Win11操作系统之后,却发现自己的电脑卡顿,遇到这种问题我们应该怎么解决呢?下面小编就带着大家一起看看吧! 更多重装系统教 ...

引入腾讯地图，电脑内存CPU占比升高，卡顿问题

引入腾讯地图，电脑内存CPU占比升高，卡顿问题相关推荐

最新文章

热门文章