Vue 中元素拖动优化?

这个问题我之前提过 原问题 , 本来最初以为解决了, 现在上了生产环境, 发现还是有性能问题, 看看大家有没有什么优化意见, 代码大概如下所示, box 内有 1000 个左右的设备组件, 需要鼠标点击时拖动 box, box 目标使用了相对定位, 然后使用 3d 变形来实现移动元素, device 组件都绝对定位, 他们都有自己的 x,y 坐标位置, 发现即便使用 3D, device 太多的时候, 整个拖动会导致 CPU 100%, 然后就会明显的不跟手, 我研究了几天, 发现各种优化方案都不行, 最后决定在拖动时候隐藏所有 device 组件, v-show 的隐藏仍然会卡, v-if 的隐藏不会卡顿, 但是 v-if 在隐藏后重新显示却需要消耗 2s, 这样体验就会特别差, 想问问大家的建议

<div class="box">
	<device v-for="device in devices" :data="device" :key="device.id" />
</div>