EasyNVR|视频上云/网络穿透/网络映射服务EasyNTS前端切换页面卡顿如何优化?


EasyNTS作为视频上云网关 , 具备视频组网、远程运维等功能 , 上线前会经过研发部-测试部-项目部多重测试 , 在这个过程中不断完善产品 。 虽然EasyNTS目前已经上线 , 但是我们的测试并没有停止 , 近期就在测试时发现 , 在进入EasyNTS视频组网服务一段时间后 , 切换页面会变得卡顿 。
1、打开控制台的network , 发现首页的定时器在其他页面也在运行调取接口 , 运行时间长就会导致浏览器缓存资源增加 , 其他页面使用时就很卡 。

EasyNVR|视频上云/网络穿透/网络映射服务EasyNTS前端切换页面卡顿如何优化?
本文插图

2、切换导航的时候每次都会请求如下两个接口 , 浪费不必要的资源 , 而且网络环境较差的情况下 , 请求接口如果一直没有返回 , 也会造成卡顿的现象 。

EasyNVR|视频上云/网络穿透/网络映射服务EasyNTS前端切换页面卡顿如何优化?
本文插图

我们还是从以上两个方面来解决这个问题 。
1、定时器造成的卡顿
在首页代码找到定时器 , 在页面销毁的生命周期中加入清除定时器 。
2、接口请求造成的卡顿
在项目的router.Js 加入判断条件 , 如vuex已有用户及软件信息 , 就从vuex中获取 。
【EasyNVR|视频上云/网络穿透/网络映射服务EasyNTS前端切换页面卡顿如何优化?】通过以上两种方式修改代码之后 , 程序运行时 , 服务器的资源分配将会均匀 , 不再出现由于消耗过大而导致的卡顿问题 。
EasyNTS目前实现了硬件设备的接入与管控、动态组网、远程运维、文件传输、远程指令调用等功能 , 从终端到云端 , 形成了一整套的上云网关解决方案 , 极大地解决现场无固定IP、端口不开放、系统权限不开放等问题 。 如想详细了解 , 可进入TSINGSEE青犀视频进行浏览查阅 。

EasyNVR|视频上云/网络穿透/网络映射服务EasyNTS前端切换页面卡顿如何优化?
本文插图


    推荐阅读