Javascript скрипты замедляются до нуля

0

Я сделал js-скрипт для преобразования изображений (300+ в число) в base-64.

<script type="text/javascript">
        var onderdelen, afbeeldingen;
        var c=document.getElementById("myCanvas");
        var container = $("#container ul");
        var lengte = container.length;
        var speed = 1000;
        dataStart = "{\"onderdelen\":[";
        dataEnd = "]}";

        convertToBase64 = function(convertImg){
            if(null == convertImg){
                return "";
            }else{              
                c.width = convertImg.width;
                c.height = convertImg.height;

                ctx=c.getContext("2d");         
                ctx.drawImage(convertImg,0,0);
                dataURL = c.toDataURL("image/jpg").replace("data:image/png;base64,","");

                return(dataURL);
            }   

        };

        $("#output").append(dataStart);

        container.each(function(index,value){
            setTimeout( function() {

                var deze = $(value) 

                $("#output").append("{\"nr\" : \""+deze.attr("id")+"\", \"naam\" : \""+deze.attr("naam")+"\", \"cat\" : \""+deze.attr("cat")+"\"},");

                kinderen = deze.find("li");
                kinderen.each(function(i,v){

                    naam = $(this).parent().attr("id")+"_"+$(this).attr("class");
                    setTimeout(function(){
                        var img = $(v).find("img").get(0)
                        $("#output").append("{\"naam\": \""+ naam + "\", \"data\" : \"" + convertToBase64(img) + "\"},");
                    },i*speed);

                    $(this).hide();
                });

                console.log(index);

            }, index*speed*5);

            //if(index==100){return false;}

        });

    </script>

когда я запускаю это сортировка, отключается на 37 (индекс), и если я буду ждать достаточно долго, это закончится. Кто-нибудь может мне сказать, как сделать его более гладким?

есть ли какая-то javascriptфункция я overload, есть ли форма cashe, я не об этом, я перерабатываю функцию setTimeout, я перерабатываю dom, мои файлы большие. Есть идеи.

Теги:

1 ответ

0
Лучший ответ

setTimeout не создает другие потоки, а ставит в очередь задачи в "цикле сообщений", поэтому все они будут запускаться в одном курсовом курсе и повесить пользовательский интерфейс, если они будут длиться слишком долго

Вместо этого используйте Web workers или создавайте Queue и обрабатывайте изображения один за другим, вместо одновременного запуска нескольких таймеров

Ещё вопросы

Сообщество Overcoder
Наверх
Меню