为什么 canvas绘制物体的拖动没有CAD软件拖动物体的流畅，为什么？

Question

提问目的：
因为公司有1个项目想把cad绘制画图的功能搬到web浏览器上，有1个难点问题，为什么canvas绘制物体的拖动没有CAD软件物体拖动的效果流畅？

比如都是在画布上绘制1个矩形，用鼠标拖动矩形快速移动，cad拖动矩形和鼠标图标几乎之间没有距离，同时移动。但在canvas上矩形和鼠标之间有一点距离，或叫延迟。就是眼睛能看到矩形要隔几毫秒再到鼠标的位置，请知道的大佬赐教一下。

是软件开发语言的原因，还是有其他深层次的原因？比如说操作的底层对象不一样。
1、cad软件是C语言编码
2、canvas是javascript语言编码

Answer 1

语言只是表面差异，计算机在执行代码的时候只认识01这样的二进制，所以代码需要编译成计算机可识别的二级制代码，像JS这样的解释性语言到最终机器可执行的语言之间工序较多，而像exe这样的执行程序本身就已经是编译过了的，也就是两种形式在真正代码运行的时候就已经不在一个起跑线了。如果JS能够在发布时像C/C++开发的应用一样编译成二进制执行文件给宿主运行，也就是两者的区别仅仅只是开发语言不一样，其他包括API什么的都跟C/C++开发时没差的话，那么性能表现应该也是没什么差的，语言只不过是更好的给人类看的，反正最后都是二进制。

而在图形渲染上，浏览器的渲染引擎是固定的，而应用程序就各种各样了，这在性能上又打了一个折扣，虽然在理论上同样的功能，web的性能是不如应用程序的，但是，在实际体验上不一定会差很多，要看多复杂。比如你说的矩形移动，我简单实现了一下并没有明显感知延迟，而且这还是没有使用webgl的情况下。
CANVAS DEMO

Answer 2

浏览器Canvas 用js，所以绘制效率会因为 JavaScript 引擎性能限制。而 CAD 软件通常采用底层语言如 C++ 等来实现，因此具有更高的绘制效率和更流畅的交互体验。Canvas 绘图的拖动通常是通过重绘整个画布来实现的,而CAD在重绘方面通过优化算法和绘制方式来减少重绘的次数，所以你在浏览器Canvas上想获得和这样专业绘图软件相同的体验，确实有点强人所难。