Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Проверка скорости / 25 сообщений из 27, страница 1 из 2
  1  все
26.01.2017, 10:10
    #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:16
    #39391820
вадя
вадя
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
ошибался - вся таблица появляется после рендеринга...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.01.2017, 10:18
    #39391821
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
вадякак ещё можно реализовать ?
У таблицы есть метод
Код: javascript
1.
oTR = object.insertRow( [iIndex])


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

Не совсем понял в чем вопрос!?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.01.2017, 10:34
    #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:47
    #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, 11:01
    #39391872
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
вадяэто будет быстрее?
Тебе все карты в руки - проверяй.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.01.2017, 11:16
    #39391893
вадя
вадя
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
krvsaебе все карты в руки - проверяй.
такое не буду.
400*30=12 000
операций вставки явно не может быть быстрыми
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.01.2017, 12:04
    #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:25
    #39391973
вадя
вадя
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
skyANAИзвини, но это ни фига не тест :)
что ты подразумеваешь под тестом?
я не прошу протестировать мой код
я прошу варианты кода , чтоб протестировать у себя.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.01.2017, 13:07
    #39392021
Petro123
Petro123
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
вадя,
всё верно.
"Я за вас свою работу делать не буду" (с)
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.01.2017, 13:28
    #39392042
вадя
вадя
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
Petro123вадя,
всё верно.
"Я за вас свою работу делать не буду" (с)
мне достаточно идеи.
пока только 3 варианта, 2 из которых равнозначны. 3- и пробовать не стоит.
вот в чем вопрос
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.01.2017, 13:44
    #39392060
krvsa
krvsa
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
вадямне достаточно идеи.
пока только 3 варианта
Так больше и не будет...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.01.2017, 14:12
    #39392088
вадя
вадя
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
krvsaвадямне достаточно идеи.
пока только 3 варианта
Так больше и не будет...
тогда на этом и закончим
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
26.01.2017, 14:24
    #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, 15:05
    #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, 16:54
    #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:56
    #39392301
вадя
вадя
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
самое медленное - рендеринг...
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2017, 11:50
    #39393684
skyANA
skyANA
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
вадяskyANAИзвини, но это ни фига не тест :)
что ты подразумеваешь под тестом?
Ну хотя бы это: https://jsperf.com/vadya
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2017, 17:00
    #39393780
вадя
вадя
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
skyANAНу хотя бы это: https://jsperf.com/vadya
это так информативно ?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2017, 18:38
    #39393805
skyANA
skyANA
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
вадяskyANAНу хотя бы это: https://jsperf.com/vadya
это так информативно ?
Информативнее твоего первого поста, разве нет?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
28.01.2017, 19:27
    #39393822
вадя
вадя
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
skyANAИнформативнее твоего первого поста, разве нет?
но меня поняли как надо
20149249
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
29.01.2017, 20:31
    #39394189
вадя
вадя
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
как-то была дисскуссия по websocket и там было про то зачем на один запрос к серверу выдавать несколко ответов клиенту
вот тут как раз и пригодится
в данном случае таблица 400+*30+ рендерится достаточно долго
на сервере 1 запрос к базе - результат - все 400+ строк
строим из результатов первые n строк , которые и должны отобразиться на экрене (их можно вычислять или с запасом задать)
и отправляем клиенту - клиент вставляет их innerHTML, отправив первую часть, формируем оставшуюся часть таблицы и отправляем клиенту, клиент их уже добавляет к первойчасти
в итоге клиент видит практически моментальное отображение новых данных
то, что происходит в части , которую клиент не видит - ему и не надо
всё равно клиенту надо какое-то время для просмотра видимой части - за это время всё и отрендерится.
конечно можно и на клиенте разделить на две части, но это несколько труднее.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
30.01.2017, 12:35
    #39394517
Petro123
Petro123
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Проверка скорости
вадявот тут как раз и пригодится
опять про сокеты? )
Тут вроде тема про скорость рендеринга.
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
  1  все
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Проверка скорости / 25 сообщений из 27, страница 1 из 2
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


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