Echarts大屏卡顿优化
Echart大屏卡顿优化背景原先的写法优化后的写法背景最近做大屏,当数据量大抑或是频繁对echarts进行setOption都会导致页面非常的卡。我也是找了一些资料,实践后发现性能提升程度肉眼可见。下面直接上代码,我是vue项目原先的写法export default {data() {chart: null},mounted(){this.update()},method: {update(){c
·
背景
最近做大屏,当数据量大抑或是频繁对echarts进行setOption都会导致页面非常的卡。我也是找了一些资料,实践后发现性能提升程度肉眼可见。下面直接上代码,我是vue项目
原先的写法
export default {
data() {
chart: null
},
mounted(){
this.update()
},
method: {
update(){
const option = {}
this.chart.setOption(option)
}
}
}
尽管这个option是局部变量,但还是很卡
优化后的写法
let chart = null
export default {
mounted(){
this.update()
},
method: {
update(){
const option = {}
chart.setOption(option)
}
}
}
这样的写法,vue不需要管理data,流畅度的提升肉眼可见
更多推荐
已为社区贡献2条内容
所有评论(0)