我正在构建一个非常庞大的 Angular 应用程序,我的问题是内存泄漏导致页面卡住。 单击按钮时,我的应用程序会打开一个弹出窗口,(在自定义指令的帮助下)动态附加此弹出窗口的内容,并使用本地文件中的 $http 调用弹出窗口。它工作正常。
我已经使用 chrome 开发人员工具根据给我的时间表提出以下内容:
如您所见,在渲染发生之前计时器会触发很长时间。当用户多次执行此操作时(关闭弹出窗口并再次重新打开),此操作的时间会越来越多。除非他转到其他页面并返回或刷新页面。那么....我如何销毁所有以前的计时器或收集垃圾必须做的事情。或者是其他必须做的事情。
最佳答案
您应该将按钮调用的函数包装在去抖动函数中。请参阅下面的功能。这将确保无论何时用户单击按钮,都会取消最后一个操作。
关于性能,确保弹出内容在用户关闭时从 dom 中删除。
来源:https://davidwalsh.name/javascript-debounce-function
function debounce(func, wait, immediate) {
var timeout;
return function() {
var context = this, args = arguments;
var later = function() {
timeout = null;
if (!immediate) func.apply(context, args);
};
var callNow = immediate && !timeout;
clearTimeout(timeout);
timeout = setTimeout(later, wait);
if (callNow) func.apply(context, args);
};
};
关于javascript - 计时器触发的 angularJS 性能问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31142020/