10 秒后停止进度条 | CPU % 80

Question

I have a progress bar and I increase its value 0 to 100% in 10 seconds. I want to stop every process after 10 seconds. But when I uncomment below code my cpu going to nearly 80% - 90%. I think after 100% it still works.

var start = new Date();
    var maxTime = 10000;
    var maxTimeSec = 10;
    var timeoutVal = Math.floor( maxTime/100 );
    animateUpdate();

    function updateProgress(percentage, second) {
        $('#timerProgress').css("width", percentage + "%");
        $('#timerCountdown').text(percentage + "%" + second + "sec");
    }

    function isLogined(){
        userId = $("#userInfo").attr("data-user") ;
        userId = parseInt(userId);
        var logined = false;
        if(userId > 0){
            logined = true;
        }
        return logined;
    }

    function animateUpdate() {
        var now      = new Date();
        var timeDiff = now.getTime() - start.getTime();

        var sec      = maxTimeSec - Math.round( (timeDiff/maxTime) * maxTimeSec );
        var perc     = Math.round( (timeDiff/maxTime)*100);
        //console.log(perc);
        if (perc <= 100) {
            updateProgress(perc, sec);
            setTimeout(animateUpdate, timeoutVal);
        }
        else{

            var bottomDiv = $('#bottomDiv');
            bottomDiv.show();
            if( isLogined() ){
                bottomDiv.text("Congratulations. You're lucky to read this article. We've updated your score.");

            }else{
                bottomDiv.text("Congratulations. You're lucky to read this article. If want to count your score you must login :)");
            }

            return true;
        }
    }

Is there a bug in this code?

Answer 1

Could not reproduce:

https://jsfiddle.net/7jgLLvfz/

Chrome CPU profile shows 96% idle, no heavy CPU load. Need more information.

var a = "Manditory codeblock so jsfiddle can be linked"