Javascript IE11变得毫无反应

我有一个要求，我需要播放电影（电影）的某一套图像。我正在使用HTML5画布来实现这一点。我需要同时播放四部电影，但我的浏览器IE11很快就会失去响应或重新启动。当它重新启动时，我在任务管理器中看到内存已达到约1.5 GB，但当它变得无响应时，没有内存峰值。 我制作了一把小提琴来证明这一点。同样的东西在铬上也能很好地工作。 这些图像是JPeg图像（从Dicom转换而来），我需要对它们进行解压缩，将它们放在tempcanvas上，并在将它们放回画布之前读取像素数据进行一些操作

你能帮我解释一下是什么原因导致的吗？如果需要的话，我可以改变我的设计

---

机器规格：8核、18 GB RAM、NVidia图形卡、IE11、Windows 7 64位

在我看到

setInterval

之前，任何东西看起来都不突出。这是你问题的原因。如果出现任何延迟，您将开始排队呼叫，最终您将完成GC和浏览器无法管理的工作。对于动画使用

requestAnimationFrame

，对于所有其他计时内容使用

setTimeout

。如果使用

setTimeout

在完成当前任务的处理之前，不要设置新的超时。永远不要使用

setInterval

ok让我试试setTimeout，但是如果我理解正确，setInterval不会对回调进行排队，除非最后一个间隔的回调完成。这是不正确的

setInverval

异步推送调用堆栈上的。这是一项令人讨厌的工作，根据我的经验，帮助人们修复页面崩溃问题是导致浏览器崩溃和页面崩溃的最大原因。不是这种方法有缺陷，而是它的使用方式有缺陷。决不能将它用于超过最长预期代码执行时间的任务。由于Javascript具有不确定的执行时间，因此使用setInterval总是导致不良行为的潜在原因。@Harryom，派对迟到了，但是如果您仍然有问题，请告诉我。我正在开发，可以帮助您快速安装一个简单的基于web的CineLoop播放器。在我看到

setInterval

之前，查看任何内容都不显得突出。这是你问题的原因。如果出现任何延迟，您将开始排队呼叫，最终您将完成GC和浏览器无法管理的工作。对于动画使用

requestAnimationFrame

，对于所有其他计时内容使用

setTimeout

。如果使用

setTimeout

在完成当前任务的处理之前，不要设置新的超时。永远不要使用

setInterval

ok让我试试setTimeout，但是如果我理解正确，setInterval不会对回调进行排队，除非最后一个间隔的回调完成。这是不正确的

setInverval

异步推送调用堆栈上的。这是一项令人讨厌的工作，根据我的经验，帮助人们修复页面崩溃问题是导致浏览器崩溃和页面崩溃的最大原因。不是这种方法有缺陷，而是它的使用方式有缺陷。决不能将它用于超过最长预期代码执行时间的任务。由于Javascript具有不确定的执行时间，因此使用setInterval总是导致不良行为的潜在原因。@Harryom，派对迟到了，但是如果您仍然有问题，请告诉我。我的工作，并可以帮助你得到一个简单的基于网络的CineLoop播放器迅速。

this.loadLossyData = function() {
        var lossyImage = new Image();
        lossyImage.onload = function() {
            input.tempCanvas.height = headerInfo.Rows;
            input.tempCanvas.width = headerInfo.Columns;
            var tempContext = input.tempCanvas.getContext("2d")
            tempContext.drawImage(this, 0, 0, headerInfo.Columns, headerInfo.Rows);
            var tempCanvasPixelData = tempContext.getImageData(0, 0, headerInfo.Columns, headerInfo.Rows);
            // SOME PIXEL MANIPULATION WILL BE DONE HERE ON tempCanvasPixelData
            drawImageOnCanvas(input.tempCanvas, input.canvas, input);
            this.onload = null;
            this.src = "";
        };
        lossyImage.src = jpegImageData;