<![CDATA[Серый форум — javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?id=6918 Sat, 24 Mar 2012 16:05:58 +0000 PunBB <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=58322#p58322

Нe честно, не ругается и работает.

Казнить нельзя помиловать.
Где будем ставить запятую?:)


Firefox 12.0

За новыми не гоняюсь, а тем что версия от версии отличаются устранением старых и внесением новых ошибок нас не запугаешь.:)

]]> Sat, 24 Mar 2012 16:05:58 +0000 https://forum.script-coding.com/viewtopic.php?pid=58322#p58322 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=58306#p58306 Нe честно, не ругается и работает. (firstChild)
Firefox 12.0

]]> Sat, 24 Mar 2012 03:24:59 +0000 https://forum.script-coding.com/viewtopic.php?pid=58306#p58306 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=58296#p58296

У меня огнелис не ругается на ".firstChild;" почему то.

И работает?
Две разных лисы, 5.01 и 3.56

Ошибка: el.style is undefined
Источник: file:
Строка: 29

]]> Fri, 23 Mar 2012 10:21:30 +0000 https://forum.script-coding.com/viewtopic.php?pid=58296#p58296 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=58280#p58280 Ни на кого я не спихивал. Я просто хотел посмотреть как бы решили такую задачу местные. 6)
Писать же прогресс бар я хотел сам, но у меня нифига не получилось.

У меня огнелис не ругается на ".firstChild;" почему то.

]]> Fri, 23 Mar 2012 04:27:07 +0000 https://forum.script-coding.com/viewtopic.php?pid=58280#p58280 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=58277#p58277

На данный момент у меня вообще не получается сделать сортировку при работающем прогресс баре. Ищу свои ошибки

Не понял, а чего их самому искать, когда есть кому это можно спихнуть?


Валидатор сразу ругнулся на отсутствие 

<meta http-equiv="Content-Type" content="text/html; charset=Windows-1251">

А сафари написала кракозяблами, правильно и сделала.

Консоль лисы сразу показала на эту строку

el = document.getElementById("progressbar").firstChild;

Исправляем на

el=document.getElementById("progressbar").getElementsByTagName("div")[0];

и всё начинает работать.

Total duration: (округлённо)
Осёл 6 = 93сек
Опера 11.50 = 24сек
Лиса 5.01 = 23сек
ГуглХром 12 = 24сек
Сафари 5.0 = 57сек

]]> Fri, 23 Mar 2012 04:15:49 +0000 https://forum.script-coding.com/viewtopic.php?pid=58277#p58277 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=58267#p58267 Любитель пишет:

на эту ссылку браузер ругается, yield из JavaScript 1.7

МСИЕ банит сайт мозиллы ))

]]> Thu, 22 Mar 2012 17:45:17 +0000 https://forum.script-coding.com/viewtopic.php?pid=58267#p58267 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=58265#p58265 Вот это использую для замера, быстро, просто, кроссбраузерно.

var vcb=new Date().getTime();
сам цикл чего то
vcb=(new Date().getTime()-vcb)/1000;
alert(vcb);

Несколько раз пытался сделать такой бар, браузер просто игнорирует вывод на экран.
А вот идея с остановкой цикла  меня не посещала, надо попробовать.

Rumataб на эту ссылку браузер ругается, yield из JavaScript 1.7

]]> Thu, 22 Mar 2012 17:09:46 +0000 https://forum.script-coding.com/viewtopic.php?pid=58265#p58265 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=57997#p57997 DnsIs, спасибо.
Не мог сразу ответить, хотя времени, чтобы зайти на форум было. Первой моей мыслью было оптимизировать сам алгоритм сортировки - все-таки там используется алгоритм пузырьковой сортировки. Вторая - поискать само описание, кстати я нашел оригинальную статью. Правда мелькала мысль - пореже вызывать функцию таймера.

Решение, приведенное в статье, меня удивило.
-- Частота вызова функции таймера "не изменилась". Изменилось время исполнения каждого цикла
-- Внутренний цикл прерывается и повторно выполняется с прерванной итерации. Фактически, новый алгоритм это функцию-генератор, которая эмулирует оператор yield из JavaScript 1.7
-- Скорость вычислений изменилась примерно в 50 раз! С учетом того, что чистое время исполнения алгоритма без таймера превышает время, затраченное алгоритмом с использованием таймера. Либо парадокс, либо ошибка автора - я не проверял качественно.
-- В МСИЕ безобразно медленные алгоритмы: 15-16 сек и 1.3 сек. против 5-6 сек. и 0.06-0.13 сек в мозилле для примеров из статьи.

]]> Sat, 17 Mar 2012 20:03:40 +0000 https://forum.script-coding.com/viewtopic.php?pid=57997#p57997 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=57766#p57766 В общем Rumata, вот статья.

]]> Tue, 13 Mar 2012 02:22:33 +0000 https://forum.script-coding.com/viewtopic.php?pid=57766#p57766 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=57713#p57713 Rumata, именно так. ) Я просто более глобально смотрю на этот процесс, поэтому говоря о синхронности стараюсь учитывать и остальные события.

]]> Sun, 11 Mar 2012 10:17:08 +0000 https://forum.script-coding.com/viewtopic.php?pid=57713#p57713 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=57712#p57712 Xameleon пишет:

процессы компьютера

Разные точки зрения. Я подразумеваю js  в рамках одной страницы. Вот здесь Вы правы и подразумевается выполнение js в рамках одной страницы (процесса ?)

Xameleon пишет:

пока крутятся циклы и двигаются элементы массива, отрисовка элементов на экране может не происходить

.

]]> Sun, 11 Mar 2012 10:04:56 +0000 https://forum.script-coding.com/viewtopic.php?pid=57712#p57712 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=57711#p57711 Ссылку я не хотел сразу давать, как раз что бы увидеть как бы решили такую задачу мастера скриптинга. Понятно, что писать не нужный код код с нуля не охота. 8)

Чтож. Rumata, давайте сначала не ссылку а вариант решения. В статье идет речь о таком коде:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>Running long JavaScript processes in a web browser</title>
    <style>

body {
  padding:0;
  margin:1em;
}

#progressbar {
  position:relative;
  width:300px; height:20px;
  border:1px solid black;
  overflow:hidden;
}

#progressbar div {
  background:#316AC5;
  width:0; height:100%;
}
    </style>
  </head>
  <body>
    <p>Sorting, please wait...</p>
    <div id="progressbar"><div></div></div>

    <script>

(function () {

    var i, length, data, el, start;

    // Initialize a few things...
    length = 5000;
    data = [];
    el = document.getElementById("progressbar").firstChild;

    // Setup an array of random integers...
    for (i = 0; i < length; i++) {
        data[i] = Math.floor(Math.random() * length);
    }

    function sort (progressFn) {
        i = 0;

        (function () {
            var j, value;

            for (j = length; j > i; j--) {
                if (data[j] < data[j - 1]) {
                    value = data[j];
                    data[j] = data[j - 1];
                    data[j - 1] = value;
                }
            }

            i++;
            progressFn(i, length);

            if (i < length) {
                setTimeout(arguments.callee, 0);
            }

        })();
    }

    start = new Date().getTime();
    sort(function (value, total) {
        el.style.width = (100 * value / total) + "%";
        if (value >= total) {
            alert("Total duration: " + ((new Date().getTime() - start) / 1000) + " seconds");
        }
    });

})();

    </script>
  </body>
</html>

Далее идет его оптимизация.

В исходном тексте length = 1000, я же изменил на length = 5000; У меня при таком варианте сортировка происходит за ~26 секунд.

Раз писать код никто не хочет, давайте попробуем оптимизировать уже готовый.

ps, в статье код после оптимизации отрабатывает за ~.62 секунды.
Rumata, ну хоть вы не откажите. Ну очень хочется увидеть как вы справитесь.
Скажу сразу, я так бы не смог, как там написано.

]]> Sun, 11 Mar 2012 10:01:08 +0000 https://forum.script-coding.com/viewtopic.php?pid=57711#p57711 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=57710#p57710 Rumata пишет:

Сортировка - полностью синхронный процесс.

Не соглашусь ) Я говорил о частичной синхронности, т.к все остальные процессы компьютера продолжают работать как и работали. )

]]> Sun, 11 Mar 2012 09:48:22 +0000 https://forum.script-coding.com/viewtopic.php?pid=57710#p57710 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=57709#p57709 DnsIs, дайте ссылку. Очень почитать хочется.

Коллега Xameleon прав. Я всего лишь поправлю его. Сортировка - полностью синхронный процесс. Вообще задача решаема, и может показаться весьма интересной - асинхронная сортировка ну очень большого массива. Но проблема в том, что это будет ну очень долго. Чтобы хоть что-то показать, так как браузер будет "висеть" в этот момент... Можно сделать, например, так


<script type="text/javascript">

function doSort()
{
	loadinfo = document.createElement('div');
	loadinfo.innerHTML = '<img src="loadinfo.gif" /> Sorting...';
	loadinfo.style.position = 'absolute';
	document.body.appendChild(loadinfo);

	array.sort();

	document.body.removeChild(loadinfo);
};

</script>

И анимированную картинку, например, такую
http://atcasa.corriere.it/Speciali/annual-bravacasa/loadinfo.gif

]]> Sun, 11 Mar 2012 09:31:52 +0000 https://forum.script-coding.com/viewtopic.php?pid=57709#p57709 <![CDATA[Re: javascript: Сортировка массива с отображением процесса]]> https://forum.script-coding.com/viewtopic.php?pid=57707#p57707 Не в обиду. 8)
Тем не менее вы меня поняли.

В данном примере сложности по функции сортировки нет. Обычный sort(function (){return a-b}) справится.
Сейчас мне как раз стало интересно, от чего же у кого-то получилось заставить работать прогрессбар, а у меня нет.

]]> Sun, 11 Mar 2012 09:23:39 +0000 https://forum.script-coding.com/viewtopic.php?pid=57707#p57707