清除JavaScript調用堆棧

由於目前還不清楚發生了什麼事我做了一個視頻：清除JavaScript調用堆棧

https://vimeo.com/171929645

正如你可以看到，在年底之前，它只是滾動和顯示接觸點（該工具崩潰動畫圈）爲每個touchevent。我只是想清除堆棧，所以這不會發生。

我正在爲觸摸屏電腦構建一個非常緩慢的JavaScript工具。這麼慢，當你在少量時間（比如1秒）使用你的手觸發100多個觸發器時，計算機開始執行每個觸摸事件。

由於執行一次touchevent已經花費了幾百毫秒，所以該工具在大約一分鐘內不可用。

我已經寫了這個劇本阻止得多touchevents

'use strict'; 

var MultiTouch = Backbone.NativeView.extend({ 

    el: document, 

    initialize: function() { 

    console.log('Init MultiTouch'); 

    this.el.addEventListener('touchstart', function(e) { 

     this.touchstartHandler(e); 

    }.bind(this)); 

    }, 

    touchstartHandler: function (e) { 

    if (this.block) { 

     console.log("block"); 
     e.preventDefault(); 
     e.stopPropagation(); 
     e.stopImmediatePropagation(); 
     return; 

    } 

    console.log("no block"); 
    this.startTimer(); 

    }, 

    startTimer: function() { 

    this.block = true; 

    setTimeout(function() { 

     this.block = false; 

    }.bind(this), 300); 

    } 

}); 

module.exports = MultiTouch;

這還是因爲我的工具仍然超載很容易不阻止足夠的事件。

有沒有辦法清空整個調用堆棧，以便我的機器不會連續執行100多個函數？

謝謝。

編輯

我更新了我的腳本一點，並增加了兩個控制檯日誌。這是我從鋪設了我的手在觸摸屏上得到：

no block MultiTouch.js:31 
17 block MultiTouch.js:23 
no block MultiTouch.js:31 
19 block MultiTouch.js:23 
no block MultiTouch.js:31 
12 block MultiTouch.js:23 
no block MultiTouch.js:31 
20 block MultiTouch.js:23 
no block MultiTouch.js:31 
7 block MultiTouch.js:23 
no block MultiTouch.js:31 
8 block MultiTouch.js:23 
no block MultiTouch.js:31 
6 block MultiTouch.js:23 
no block MultiTouch.js:31 
9 block MultiTouch.js:23 
2 no block MultiTouch.js:31 
9 block MultiTouch.js:23 
no block MultiTouch.js:31 
7 block MultiTouch.js:23 
no block MultiTouch.js:31 
5 block MultiTouch.js:23 
no block MultiTouch.js:31 
7 block MultiTouch.js:23 
no block MultiTouch.js:31 
6 block MultiTouch.js:23 
no block MultiTouch.js:31 
11 block MultiTouch.js:23 
no block MultiTouch.js:31 
3 block MultiTouch.js:23

所以把一隻手在屏幕上觸發更多然後170個touchevents。移動你的手將觸發成千上萬的touchevent，這將完全崩潰我的電腦。我怎樣才能防止這種情況發生？

EDIT 2

其中anwsers的說： '你可以忽略大部分的事件。'。情況並非如此。當數以千計的事件被稱爲我的電腦崩潰，所以我不能'忽略'他們。

這個問題的整個觀點是讓我的電腦不會崩潰。每個touchstart都有多個函數在監聽，所以每個touchstart事件都會執行多個函數。

由於這些函數需要幾百毫秒才能執行，因此該工具會持續執行幾分鐘的函數，使其無法使用。

問題是，這臺電腦太慢了，他只是'記得'所有的輸入已經輸入，甚至當你這樣做了一分鐘前，它仍然忙於其他的東西。所以你只需看到該工具在沒有人觸摸屏幕時自動滾動。

如果還不清楚發生了什麼，我會記錄下來並將其放到網上。

來源

2016-06-23 DavidWorldpeace

您可以忽略大部分事件。聚合Array中的所有相關觸摸事件，然後調用startHandler()。由於您使用的骨幹

touchstartHandler: function (e) { 

    this.events.push(e) 
    this.startTimer(); 

},

你可以嘗試_.debounce或_.throttle to limit calling startHandler（）`太多次：例如，你可能只需要第一個和最後一個事件左右。

startTimer: _.debounce(function() { 
//do sth with this.events 
console.log(this.events[0]) 
}, 50);

_.debounce() docs

來源

2016-06-23 12:26:59

嘗試使用反跳，只要求每隔X毫秒的函數一次。立即在Xms之前執行第一個函數調用，在Xms之後非立即調用它。

這裏是它的實現：

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); 
 
    }; 
 
}; 
 

 
var touchEvent = function() { 
 
    console.log('touched'); 
 
}; 
 

 
var debouncedTouchEvent = debounce(touchEvent, 500, true); 
 

 
for (var i = 0; i < 100000; i++) { 
 
    debouncedTouchEvent(); 
 
    //will only be called once every 500ms. 
 
} 
 

 
// element.addEventListener('touch', debouncedTouchEvent);

來源

2016-06-23 12:32:37 Bamieh

清除JavaScript調用堆棧

回答

相關問題