webSocket推送太快导致前端渲染卡顿问题优化

优化思路：
把webSocket接收到的数据用一个数组存起来，达到一定长度再统一渲染，可根据推送数据的速度适当调解数组长度限制，如果一段时间内改数组长度打不要渲染条件，就用定时器之间渲染

data(){return{tempDataWsList:[],// 存放临时ws数据数组list:[],// 页面上的列表listCopy:[],// 深拷贝的初始化列表数据，用于统一渲染}}methods:{...// websocket接收数据的方法onMessage(data){if(data.data){// 将Json字符串转译const dataWs =JSON.parse(data.data);// 将转译后的数据推入临时ws数据数组中this.tempDataWsList.push(dataWs);// 有ws数据就关闭定时器clearTimeout(this.wsTimeout);// 做缓存渲染,将ws接收到的数据放到数组，满10个就统一渲染if(this.tempDataWsList.length ==10){this.handleList();}else{// 如果最后一个接收后1秒钟内不能满足10个，则直接渲染this.wsTimeout =setTimeout(()=>{this.handleList();},1000);}}},// 操作数据渲染handleList(){// 循环临时ws数据数组this.tempDataWsList.forEach(temp=>{// 循环深拷贝的初始化列表数据this.listCopy.forEach(item=>{// 循环判断列表对应ws数据id，修改深拷贝列表上的值
        item.pointDetails.forEach(item1=>{if(item1.id == temp.detailsId){
            item1.value = temp.realVal;}});});});// 清空临时ws数据数组this.tempDataWsList =[];// 将修改的列表数据赋值给页面渲染this.list =this.listCopy;}}