Бесконечные консольные журналы, JavaScript не покинет функцию requestAnimationFrame

Question

Я получаю бесконечный "рендер" в консоли... Почему это происходит? Я не могу понять это!:(Я был на этом весь день в основном. Ребята, вы понимаете, в чем проблема?

Приставка:

turnEvent
render
10 times render
Infunction: 150.458ms
6534 and counting times render

Код:

var turnEvent = function turnEvent(AnX, AnY) {
    var first = true;
    console.time('Infunction');
    var lengd = rects.length, i;
    one30 = 10,
    one40 = 10,  
    one301 = false, 
    one401 = false;
    for (i = 0; i < lengd; i += 1) {
        if (collides([rects[i]], AnX, AnY)) {
            var rightBox = rects[i];
            var rectangle = rects2[i];
        }
    }
    console.log("turnEvent");
    rounded_rect(rectangle.x, rectangle.y, 90, 110, 10, 'black', 'black');
    function render() {
        console.log("render"); <----------- ENDLESS CONSOLE LOGS

        -----some canvas drawings here------
        .......
       ----if and else conditions----
        if (one301 && one401) {
            rounded_rect(rectangle.x, rectangle.y, 90, 110, 10, null, 'black');
            console.timeEnd('Infunction');
        }
    }
    (function animloop(){
        requestAnimationFrame(animloop);
        render();
    })();
}

Answer 1

Поскольку requestAnimatinoFrame будет вызывать animloop, который выполнит другой вызов requestAnimationFrame, который выполняет animloop и т. Д. И т. Д. И т. Д., Это рекурсивное действие.

Вам нужно сделать условие в animloop, чтобы не вызывать requestAnimationFrame

(function animloop(){
    if(someConditionMet){
       //return without executing another requestAnimationFrame
       return;
    }
    requestAnimationFrame(animloop);
    render();
})();