尝试使用Vue.js表解决性能问题

Question

所以我的桌子有50列和大约4-600行，并且性能差。有一些正在使用的计算属性。表格单元格是输入，选择和文本区域。

我使用vue-scrolling-table，因为我需要垂直和水平滚动并固定第一列。但是性能确实很差。

我也有相同的设置，其他地方是应用程序，但没有相同的性能问题。

我已经尝试过使用virtual list，但是我无法在vue-scrolling-table /中使用它（标题没有跟随滚动，并且垂直滚动条仅在我使用时可用滚动到底部） 我还查看了virtual scroller，但建议不要与输入等配合使用，因为它正在替换输入中的数据，并且会触发更改事件等。

对于列中的子集，我有一个用于数据的v-for，内部有一个v-for。 （我不确定会有多少列。）

<template slot="tbody">
    <tr v-for="(row,index) in table" :key="index">
        <td>
            <input v-model="table[index].someItem">
        </td>
        <td>
            <select v-model="listyThing">
                <option v-for="item in list">{{item}}<option>
             </select>
        </td>
  ...


# I have some computed stuff ,(like 4)
SomeComputedFunction: function() {
    return this.table.map((row) => {
        return row.some * row.somethingelse
    })
}

这应该工作正常。我正在使用的数据不是很大，它会引起问题。我尝试执行任何操作，然后CPU旋转到100％，一切都会延迟2秒发生。

还有一个有趣的发现，选择项在3秒钟内打开。我以为很好。

当我使用虚拟列表时，性能会更好，但是我需要针对表的其他解决方案。

有没有人知道这和我的另一个工作之间有什么区别（实际上有更多数据和更多计算属性） 因此，我认为差异可能是selects和v-for呈现的列（以这种方式呈现了其中约20个）。还是文本区域？

谢谢！