Javascript-форум - Делать было...

Javascript-форум (https://javascript.ru/forum/)

- Ваши сайты и скрипты (https://javascript.ru/forum/project/)

- - Делать было... (https://javascript.ru/forum/project/11557-delat-bylo.html)

Делать было...

Перед вами снимок 65536-и нодов :).

1-й вечер написал скрипт, и заценил как он нагнул всю 5-ку...
2-й вечер вспомнил заветное слово "оптимизация" и удалось добиться результата в FF.

ff сгенерил на моей тачке за 3 минуты где-то. Я работал с ним, т.к. единственный из всех кто адекватно воспринял 1-ю версию скрипты(выводил промежуточные результаты). остальные вообще мгновенно нагибались на все 360:D .

Как же я удивился, когда запустив на опере 10.6 2-ю версию скрипта всё сгенерилось за секунд 30...(vs 3мин у FF).

Давно присматриваюсь к новой версии оперы... ток до этого, так на посознательном уровне:) . а сейчас вот и результатом подкрепилось...

А можно код глянуть одним глазком? :-?

CSS

Код:

body {margin: 0; padding: 0;}

input {outline: 0px;}



#square {width: 256px; height: 256px; margin: 400px;}



#square div {width: 1px; height: 1px; float: left; overflow: hidden;}

HTML

<body>
<div id="square"></div>

<script>

function brush() {
	
	var hor = 256;
	var ver = 256;

	var num = '';
	
	var square = document.getElementById('square');
	
		for (var i=0; i<ver; i++) {
			for (var q=0; q<hor; q++) {
				num +='<div style="background: rgb(0,'+i+','+q+');"></div>';
			}
		}
	
	square.innerHTML = num;

}


brush();

</script>
</body>

Сразу я наивно попытался через DOM добавлять...

Цитата:

Сообщение от float

#square div

Попробуйте, ради эксперимента, убрать здесь ненужный каскад, увеличится ли скорость.

Цитата:

Попробуйте, ради эксперимента, убрать здесь ненужный каскад, увеличится ли скорость.

Мало значимо я думаю. В документе же тет больше других дивов.(враппер .... ели ток:))

Хотя да... каскад тут и не нужен.

3 секунды в пользу #square div... на Опере... FF чёт не хочет сегодня палитры формировать:)

тоже самое таблицей + время ... Internet Explorer может не показать - как повезёт )))

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title></title>
</head>
<body>
<script language="JavaScript" type="text/javascript">
function brush() {
    var start = new Date();
    for (var a = document.createElement("table"), b = 256; b--;)
    for (var d = a.insertRow(0), c = 256; c--;)
    d.insertCell(0).style.cssText = "background-color: rgb(" + b + ",0," + c + ");width: 1px; height: 1px;";
    a.cellSpacing = "0";
    a.cellPadding = "0";
    document.body.appendChild(a);
    var time =  document.createTextNode((new Date()).getTime() - start.getTime()+"ms");
    document.body.appendChild(time);
};
brush();
</script>
</body>
</html>

Помню раньше на Delphi игрался, писал программу, которая изображения div'ами отрисовывала.