Monitorando uma longa tarefa em JavaScript

StackOverflow https://stackoverflow.com/questions/1130901

Pergunta

Eu tenho uma página específica que usa muitos widgets que precisam ser inicializados pelas rotinas JavaScript (cerca de 400, é complexo). Isso leva algum tempo (até 20 segundos em máquinas mais lentas). Agora eu estava pensando que poderia mostrar um indicador de progresso (um campo de texto simples com uma etiqueta percentual), em vez da página, mas descobri que, mesmo que estivesse atualizando -o continuamente, a tarefa em andamento bloqueia tudo e não vejo atualizações. Portanto, tudo permanece congelado até que a tarefa pesada do JavaScript seja concluída. Eu até fiz o experimento a seguir, mas também congela (e o Firefox diz que o script está demorando muito para concluir ...):

function a(){
    for (var i = 0; i < 5000000000000000; i++){
        abb = i;        
    }
}

var abb;

function c(){
    var ef = document.getElementById("pip");
    ef.innerHTML = abb;

}

function b(){

    setInterval(c, 50);
    setTimeout(a, 1000);
}

A única solução que vem a mim é quebrar o longo emprego em pedaços e atualizar o rótulo ... mas eu estava me perguntando se há outra solução! Deus, JS precisa de tópicos o mais rápido possível ... :)

Alguma ideia?

Foi útil?

Solução

Posso assumir que os scripts estão sendo executados a partir de um evento Onload, para que o usuário não esteja sentado em uma página em branco enquanto executa?

Se sim, recomendo dividir os scripts em funções separadas, criar uma matriz dessas funções, iterando através dessa matriz e avaliando as funções e atualizando seu indicador de progresso após cada N funções.

E se for um site voltado para o público, tente minimizar a quantidade de JavaScript que é absolutamente necessário para experimentar a página. E a quantidade de inicialização que cada widget precisa. Parafraseando o agente Smith: Que bem são árvores de acordo com os acordens, se ninguém esperar para vê-las?

Outras dicas

Se você deseja threads, você pode usar o LiveConnect e criar threads Java True (se o gerenciador de segurança permitir).

Se você não pode usar o padrão de design de coroutinas de C.

Cumprimentos.

Isso funciona, presume -se que você precisa ligar para B para iniciá -lo e ter uma div com id = "pip"

<html>
<head>
    <script type="text/javascript">

    var i;
    var state = 0;

    function a(){

        switch(state){

        case 0:
            i = 0;
        case 1:
            i++;
            for (; i < 5000000000000000; i++){
                abb = i;
                if (i%1000 == 0){
                    setTimeout(a, 1);
                    state = 1;              
                    return;             
                }                   
            }
        break;
        }
    }

    var abb;

    function c(){
        var ef = document.getElementById("pip");
        ef.innerHTML = abb;

    }

    function b(){

        setInterval(c, 50);
        setTimeout(a, 1000);
    }

    </script>
</head>
<body onload="javascript:b();">
    <div id = "pip">test</div>
</body>
</html>
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top