Vue框架下，如何优化统计图表的渲染性能

import { debounce } from 'lodash'export default {  data() {    return {      chartData: [],  // 统计图表数据      debouncedUpdateChart: null  // 防抖函数    }  },  created() {    this.debouncedUpdateChart = debounce(this.updateChart, 200)  // 设置防抖函数  },  methods: {    updateChartData() {      // 更新统计图表数据      // ...      this.debouncedUpdateChart()    },    updateChart() {      // 绘制图表      // ...    }  }}

<template>  <div class="chart-container" ref="container">    <div ref="content">      <ChartItem v-for="item in visibleData" :key="item.id" :data="item" />    </div>  </div></template><script>import ChartItem from './ChartItem.vue'import { throttle } from 'lodash'export default {  components: {    ChartItem  },  data() {    return {      data: [],  // 总数据      visibleData: [],  // 可见数据      containerHeight: 0,  // 容器高度      contentHeight: 0,  // 内容高度      scrollHeight: 0,  // 滚动高度      visibleRange: {  // 可见范围        start: 0,        end: 0      },      throttledUpdateVisibleData: null  // 节流函数    }  },  mounted() {    this.calculateHeight()    this.throttledUpdateVisibleData = throttle(this.updateVisibleData, 200)  // 设置节流函数    this.$refs.container.addEventListener('scroll', this.onScroll)  // 监听滚动事件  },  destroyed() {    this.$refs.container.removeEventListener('scroll', this.onScroll)  // 移除滚动事件监听  },  methods: {    calculateHeight() {      const container = this.$refs.container      const content = this.$refs.content            this.containerHeight = container.clientHeight      this.contentHeight = content.clientHeight      this.scrollHeight = this.contentHeight - this.containerHeight    },    updateVisibleData() {      const scrollTop = this.$refs.container.scrollTop      const start = Math.floor(scrollTop / ITEM_HEIGHT)      const end = Math.min(start + VISIBLE_ITEMS, this.data.length)      this.visibleRange = { start, end }      this.visibleData = this.data.slice(start, end)    },    onScroll() {      this.throttledUpdateVisibleData()    }  }}</script>

<template>  <canvas ref="canvas"></canvas></template><script>import Chart from 'chart.js'export default {  mounted() {    const canvas = this.$refs.canvas    new Chart(canvas, {      type: 'bar',      data: {        // 统计图表数据      },      options: {        // 配置项      }    })  }}</script>