ReSQL.ru
     
powered by simpleCommunicator - 2.0.59     © 2025 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Проверка скорости
25 сообщений из 27, страница 1 из 2
  1  все
Проверка скорости
    #39391813
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
есть таблица
в ней tbody c id ='main_tbody'
есть html строка <tr><td></td>.... зполняющая tbody тыблицы 400строк*30стобцов
нашёл 2 варианта заполнения
1
Код: javascript
1.
2.
3.
                console.time('d1');
                document.getElementById('main_tbody').innerHTML = p;
                console.timeEnd('d1');


работает ~100мс
2
Код: javascript
1.
2.
3.
4.
5.
6.
7.
                var sp2 = document.createElement("tbody");
                sp2.innerHTML = p;
                sp2.id = "main_tbody";
                sp2.style.overflowY = 'auto';
                console.timeEnd('d1');
                document.getElementById('tbl1').replaceChild(sp2, document.getElementById('main_tbody'));
                console.timeEnd('d1');


первое время ~50мс
второе время ~50мс
т.е. менять 1вариант на 2 смысла нет
и что интересно, рендеринг на экране одинаков.
т.е. появление скрола через одно и тоже время. (определено на визуально) примерно 1-2 сек
в общем не критично , т.к. часть отображаемая на экране появляется мнгновенно.

как ещё можно реализовать ?
DocumentFragment как бы не получается приспособить, потому как надо вставить несколько узлов
и есть подозрение, что в любом случае упрётся в рендеринг уже самой таблицы...
...
Рейтинг: 0 / 0
26.01.2017, 10:10
| Ответить | Цитировать | Написать  
Проверка скорости
    #39391820
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
ошибался - вся таблица появляется после рендеринга...
...
Рейтинг: 0 / 0
26.01.2017, 10:16
| Ответить | Цитировать | Написать  
Проверка скорости
    #39391821
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
вадякак ещё можно реализовать ?
У таблицы есть метод
Код: javascript
1.
oTR = object.insertRow( [iIndex])


А у строки
Код: javascript
1.
oTD = TR.insertCell( [iIndex])
...
Рейтинг: 0 / 0
26.01.2017, 10:18
| Ответить | Цитировать | Написать  
Проверка скорости
    #39391824
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
krvsa,
т.е. организовать цикл?
надо строку разбить на элементы - строки / ячейки и прогнать цикл с вложенным циклом?
это будет быстрее?
...
Рейтинг: 0 / 0
26.01.2017, 10:23
| Ответить | Цитировать | Написать  
Проверка скорости
    #39391838
Фотография Areostar
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Areostar
Участник
вадя,

Не совсем понял в чем вопрос!?
...
Рейтинг: 0 / 0
26.01.2017, 10:33
| Ответить | Цитировать | Написать  
Проверка скорости
    #39391841
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
вадяесть таблица
в ней tbody c id ='main_tbody'
есть html строка <tr><td></td>.... зполняющая tbody тыблицы 400строк*30стобцов
нашёл 2 варианта заполнения
1
Код: javascript
1.
2.
3.
                console.time('d1');
                document.getElementById('main_tbody').innerHTML = p;
                console.timeEnd('d1');



работает ~100мс
2
Код: javascript
1.
2.
3.
4.
5.
6.
7.
                var sp2 = document.createElement("tbody");
                sp2.innerHTML = p;
                sp2.id = "main_tbody";
                sp2.style.overflowY = 'auto';
                console.timeEnd('d1');
                document.getElementById('tbl1').replaceChild(sp2, document.getElementById('main_tbody'));
                console.timeEnd('d1');



первое время ~50мс
второе время ~50мс
т.е. менять 1вариант на 2 смысла нет
Либо тесты кривые. Покажи их код.
...
Рейтинг: 0 / 0
26.01.2017, 10:34
| Ответить | Цитировать | Написать  
Проверка скорости
    #39391854
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
AreostarНе совсем понял в чем вопрос!?уменьшить скорость рендеринга

skyANAЛибо тесты кривые. Покажи их код.а это и есть весь код
Код: javascript
1.
2.
3.
4.
5.
function x(p){
   console.time('d1');
   document.getElementById('main_tbody').innerHTML = p;
   console.timeEnd('d1');
}


Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
function x(p){
   console.time('d1');
   var sp2 = document.createElement("tbody");
   sp2.innerHTML = p;
   sp2.id = "main_tbody";
   sp2.style.overflowY = 'auto';
   console.timeEnd('d1');
   document.getElementById('tbl1').replaceChild(sp2, document.getElementById('main_tbody'));
   console.timeEnd('d1');
}
...
Рейтинг: 0 / 0
26.01.2017, 10:47
| Ответить | Цитировать | Написать  
Проверка скорости
    #39391872
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
вадяэто будет быстрее?
Тебе все карты в руки - проверяй.
...
Рейтинг: 0 / 0
26.01.2017, 11:01
| Ответить | Цитировать | Написать  
Проверка скорости
    #39391893
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
krvsaебе все карты в руки - проверяй.
такое не буду.
400*30=12 000
операций вставки явно не может быть быстрыми
...
Рейтинг: 0 / 0
26.01.2017, 11:16
| Ответить | Цитировать | Написать  
Проверка скорости
    #39391948
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
вадяAreostarНе совсем понял в чем вопрос!?уменьшить скорость рендеринга

skyANAЛибо тесты кривые. Покажи их код.а это и есть весь код
Код: javascript
1.
2.
3.
4.
5.
function x(p){
   console.time('d1');
   document.getElementById('main_tbody').innerHTML = p;
   console.timeEnd('d1');
}



Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
function x(p){
   console.time('d1');
   var sp2 = document.createElement("tbody");
   sp2.innerHTML = p;
   sp2.id = "main_tbody";
   sp2.style.overflowY = 'auto';
   console.timeEnd('d1');
   document.getElementById('tbl1').replaceChild(sp2, document.getElementById('main_tbody'));
   console.timeEnd('d1');
}


Извини, но это ни фига не тест :)
...
Рейтинг: 0 / 0
26.01.2017, 12:04
| Ответить | Цитировать | Написать  
Проверка скорости
    #39391973
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
skyANAИзвини, но это ни фига не тест :)
что ты подразумеваешь под тестом?
я не прошу протестировать мой код
я прошу варианты кода , чтоб протестировать у себя.
...
Рейтинг: 0 / 0
26.01.2017, 12:25
| Ответить | Цитировать | Написать  
Проверка скорости
    #39392021
Фотография Petro123
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Petro123
Участник
вадя,
всё верно.
"Я за вас свою работу делать не буду" (с)
...
Рейтинг: 0 / 0
26.01.2017, 13:07
| Ответить | Цитировать | Написать  
Проверка скорости
    #39392042
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
Petro123вадя,
всё верно.
"Я за вас свою работу делать не буду" (с)
мне достаточно идеи.
пока только 3 варианта, 2 из которых равнозначны. 3- и пробовать не стоит.
вот в чем вопрос
...
Рейтинг: 0 / 0
26.01.2017, 13:28
| Ответить | Цитировать | Написать  
Проверка скорости
    #39392060
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
вадямне достаточно идеи.
пока только 3 варианта
Так больше и не будет...
...
Рейтинг: 0 / 0
26.01.2017, 13:44
| Ответить | Цитировать | Написать  
Проверка скорости
    #39392088
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
krvsaвадямне достаточно идеи.
пока только 3 варианта
Так больше и не будет...
тогда на этом и закончим
...
Рейтинг: 0 / 0
26.01.2017, 14:12
| Ответить | Цитировать | Написать  
Проверка скорости
    #39392096
mage.lan
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
mage.lan
Участник
вадя,

innerHTML оптимизировали в хроме, остальные лень было смотреть
string: 164.214ms
nodes: 253.731ms
fragment: 211.649ms


собственно тест
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
var
	lines = 10000,
	cols = 10;

document.body.innerHTML =
	'<table id="t1"></table>' +
	'<table id="t2"></table>' +
	'<div id="t3"></div>';

console.time('string')
	var
		i,
		j,
		out = '';

	for (i = 0; i < lines; i++)
	{
		out += '<tr>';

		for (j = 0; j < cols; j++)
			out += '<td>' + i + ':' + j + '</td>';
		out += '</tr>';
	}
	document.getElementById('t1').innerHTML = out;
console.timeEnd('string')

console.time ('nodes')
	var
		i,
		j,
		row,
		t = document.getElementById('t2');

	for (i = 0; i < lines; i++)
	{
		row = t.insertRow(-1);

		for (j = 0; j < cols; j++)
			row.insertCell(-1).appendChild(
				document.createTextNode(i + ':' + j)
			);
	}
console.timeEnd('nodes')

console.time ('fragment')
	var
		i,
		j,
		cell,
		row,
		pattern = document.createElement('div'),
		f = document.createDocumentFragment();

	for (i = 0; i < lines; i++)
	{
		row = document.createElement('div');

		for (j = 0; j < cols; j++)
		{
			cell = pattern.cloneNode(false);
			cell.appendChild(
				document.createTextNode(i + ':' + j)
			);
			row.appendChild(cell);
		}
		f.appendChild(row);
	}
	document.getElementById('t3').appendChild(f);
console.timeEnd('fragment')
...
Рейтинг: 0 / 0
26.01.2017, 14:24
| Ответить | Цитировать | Написать  
Проверка скорости
    #39392131
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
mage.lan , в Опере...

string: 234.744ms
tmp.html:60 nodes: 261.151ms
tmp.html:86 fragment: 327.293ms
...
Рейтинг: 0 / 0
26.01.2017, 15:05
| Ответить | Цитировать | Написать  
Проверка скорости
    #39392298
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
изменил для некоторго удобства
 
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
    <body  >
        <script>

            var
                    lines = 1000,
                    cols = 30;
            document.body.innerHTML = '<button onclick ="xxx();">ffsdf</button>' + '<button onclick ="xxx1();">ffsdf</button>' +
                    '<table id="t1"></table>' +
                    '<table id="t2"></table>' +
                    '<div id="t3"></div>';
            var i, j, out1 = '';

            for (i = 0; i < lines; i++)
            {
                out1 += '<tr>';
                for (j = 0; j < cols; j++)
                    out1 += '<td>' + i + ':' + j + '</td>';
                out1 += '</tr>';
            }


            function xxx() {
                document.getElementById('t1').innerHTML = out1;
            }

            function xxx1() {
                var
                        i,
                        j,
                        row,
                        t = document.getElementById('t2');

                for (i = 0; i < lines; i++)
                {
                    row = t.insertRow(-1);

                    for (j = 0; j < cols; j++)
                        row.insertCell(-1).appendChild(
                                document.createTextNode(i + ':' + j)
                                );
                }

            }

        </script>
    </body>


и вот что получено
...
Рейтинг: 0 / 0
26.01.2017, 16:54
| Ответить | Цитировать | Написать  
Проверка скорости
    #39392301
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
самое медленное - рендеринг...
...
Рейтинг: 0 / 0
26.01.2017, 16:56
| Ответить | Цитировать | Написать  
Проверка скорости
    #39393684
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
вадяskyANAИзвини, но это ни фига не тест :)
что ты подразумеваешь под тестом?
Ну хотя бы это: https://jsperf.com/vadya
...
Рейтинг: 0 / 0
28.01.2017, 11:50
| Ответить | Цитировать | Написать  
Проверка скорости
    #39393780
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
skyANAНу хотя бы это: https://jsperf.com/vadya
это так информативно ?
...
Рейтинг: 0 / 0
28.01.2017, 17:00
| Ответить | Цитировать | Написать  
Проверка скорости
    #39393805
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
вадяskyANAНу хотя бы это: https://jsperf.com/vadya
это так информативно ?
Информативнее твоего первого поста, разве нет?
...
Рейтинг: 0 / 0
28.01.2017, 18:38
| Ответить | Цитировать | Написать  
Проверка скорости
    #39393822
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
skyANAИнформативнее твоего первого поста, разве нет?
но меня поняли как надо
20149249
...
Рейтинг: 0 / 0
28.01.2017, 19:27
| Ответить | Цитировать | Написать  
Проверка скорости
    #39394189
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
как-то была дисскуссия по websocket и там было про то зачем на один запрос к серверу выдавать несколко ответов клиенту
вот тут как раз и пригодится
в данном случае таблица 400+*30+ рендерится достаточно долго
на сервере 1 запрос к базе - результат - все 400+ строк
строим из результатов первые n строк , которые и должны отобразиться на экрене (их можно вычислять или с запасом задать)
и отправляем клиенту - клиент вставляет их innerHTML, отправив первую часть, формируем оставшуюся часть таблицы и отправляем клиенту, клиент их уже добавляет к первойчасти
в итоге клиент видит практически моментальное отображение новых данных
то, что происходит в части , которую клиент не видит - ему и не надо
всё равно клиенту надо какое-то время для просмотра видимой части - за это время всё и отрендерится.
конечно можно и на клиенте разделить на две части, но это несколько труднее.
...
Рейтинг: 0 / 0
29.01.2017, 20:31
| Ответить | Цитировать | Написать  
Проверка скорости
    #39394517
Фотография Petro123
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Petro123
Участник
вадявот тут как раз и пригодится
опять про сокеты? )
Тут вроде тема про скорость рендеринга.
...
Рейтинг: 0 / 0
30.01.2017, 12:35
| Ответить | Цитировать | Написать  
25 сообщений из 27, страница 1 из 2
  1  все
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Проверка скорости
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]