Vue 数据优化问题请教!

做一个表格每个 tD, 有很多信息。

现在发现当我新增第一行,用时 3ms, 到第 40行,要 20ms 一行了

数据结构: 
1行  【{td对象},{td对象},{td对象},{td对象}】
2行  【{td对象},{td对象},{td对象},{td对象}】
。。。

每个td对象有下面这些信息
interface TableCell {
  is_active:boolean
  rc: { r: number, c: number, maxr: number, maxc: number },
  value: string | number | Date,  // 值
  type?: string, // 单元格描述,自定义选择列表,引用数据,关联引用,数据输入,数据导入,数据计算
  format?: {
    string: { is_active: boolean },
    number: { is_active: boolean, round: number, thousand_sep: false, unit: string, pre: string },  // pre是前缀 ,货币标识图案等 Thousand_sep 千分符
    percentage: { is_active: boolean, round: number, }, // 百分比
    date: { is_active: boolean, format: string, },
    custom: { is_active: boolean, format: '', }
  },
 还有。。一堆。。省略

由于是自定义表格,所有很多信息是没法固定的,这是造成信息多的原因。
现在就面临优化的问题,感觉这样不行。请教优化思路

时间是vue渲数据到dom中的时间还是添加到js集合中的时间?

js集合视乎没什么好办法,数据量在那。。不过题主说的时间应该不是这个
vue渲染的话给dom加上key。

如果是自己手写的代码连续添加,可以先添加到文档片段中,再一次性添加到dom容器中。
参考这个:

说一下减少dom的办法?一次性给你大量的dom怎么优化?_一夜枫林的博客-CSDN博客_减少dom操作 一、减少dom数量的方法可以使用伪元素,阴影实现的内容尽量不使用DOM实现,如清除浮动、样式实现等;按需加载,减少不必要的渲染;结构合理,语义化标签二、大量DOM时的优化当对Dom元素进行一系列操作时,对Dom进行访问和修改Dom引起的重绘和重排都比较消耗性能,所以关于操作Dom,应该从以下几点出发:1. 缓存Dom对象首先不管在什么场景下。操作Dom一般首先会去访问Dom,尤其是像循环遍历这种事件复杂度可能会比较高的操作/那么可以在循环之前就将主节点,不必循环的Dom节点先获取到,那么在 https://blog.csdn.net/m0_45070460/article/details/107604658

虚拟滚动了解一下, 就是只展示表格可视区域的内容

您好,我是有问必答小助手,您的问题已经有小伙伴帮您解答,感谢您对有问必答的支持与关注!
PS:问答VIP年卡 【限时加赠:IT技术图书免费领】,了解详情>>> https://vip.csdn.net/askvip?utm_source=1146287632