ReSQL.ru
     
powered by simpleCommunicator - 2.0.59     © 2025 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Быстродействие JQuery (selector).each()
10 сообщений из 10, страница 1 из 1
Быстродействие JQuery (selector).each()
    #39242526
com.ета
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
com.ета
Гость
Добрый вечер всем. Подскажите по такому вопросу: как ускорить работу с таблицей? На клиентской стороне формируется таблица размером около 2 000 строк. Далее выборочно отмечаются значения с помощью checkbox в графах и функция each (для каждого чекбокса если он выбран (обращение к DOM элементу через $(this)) делай ....) выполняет редактирование выбранных полей. Но это неимоверно долго. Можно как то ускорить?
Слышал про quickEach, в нем вроде как быстрей. Что это и где брать? Может есть другие идеи?
...
Рейтинг: 0 / 0
24.05.2016, 16:51
| Ответить | Цитировать | Написать  
Быстродействие JQuery (selector).each()
    #39242592
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Antonariy
Участник
есть идея посмотреть на код, а не на рассказы о нем.
...
Рейтинг: 0 / 0
24.05.2016, 17:48
| Ответить | Цитировать | Написать  
Быстродействие JQuery (selector).each()
    #39242670
Фотография user89
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
user89
Участник
com.етаНа клиентской стороне формируется таблица размером около 2 000 строк.Это небольшая таблица. У меня 5-12 тыс. записей и пока без тормозов   Как правильно заметил Antonariy , надо показать код.

з.ы. На сервере формирую таблицу вида
Код: html
1.
2.
<tr> <td>данные 1
<tr> <td>данные 2

без закрывающих тегов <tr> и <td> . Это разрешено стандартом и хорошо уменьшается HTML, который идет клиенту.
...
Рейтинг: 0 / 0
24.05.2016, 19:14
| Ответить | Цитировать | Написать  
Быстродействие JQuery (selector).each()
    #39243031
Фотография бухалтер фантоцци
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
бухалтер фантоцци
Участник
com.ета,

Вообще-то надо смотреть что за страница, но скорее всего тормозит рендеринг.

Одно дело, только открыть большую таблицу.
Другое дело, в динамике менять большой объём HTML-содержимого.
Третье дело, не только менять содержимое, но и часто перечитывать при этом текущие размеры (стили) - это наибольшие тормоза при отображении и отзывчивости страницы
(перечитывание стилей может происходить неявно, в используемых сторонних библиотеках, тут вы только можете почитать документацию и посмотреть их код).

Попробуйте во время изменений содержимого скрывать всю таблицу (например у родительского блока менять стиль display:none/block)
Если не поможет или всплывут другие проблемы, попробуйте visibility:visible/hidden
...
Рейтинг: 0 / 0
25.05.2016, 11:41
| Ответить | Цитировать | Написать  
Быстродействие JQuery (selector).each()
    #39243479
com.ета
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
com.ета
Гость
user89,
Вот смотрите как дело обстоит. У меня есть перечень с checkbox и над ним есть так скажем главный checkbox
Например в таблице в 1000 записей в каждой строке есть checkbox, который может быть отмечен или нет. Если отмечен, то мне надо сделать действие, а именно поменять текст в ячейках и цвет. Для этого на основной checkbox поставил скрипт, выполняющий следующее:

Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
function general_check()
{
   if ($("input[name='general_checkbox']").prop('checked'))
   {
       $("input[name='all_checkbox']").each(function() {if($(this).prop("checked") == false) {$(this).prop("checked", true); change_func($(this), 'select')}});
   }
   else
   {
       $("input[name='all_checkbox']").each(function() {if($(this).prop("checked") == true) {$(this).prop("checked", false); change_func($(this), 'unselect')}});
   }
}



Собственно как-то так...
change_func как раз и занимается редактированием элементов через входные параметры обращаясь к ячейкам строки. Ячейки имеют id равное параметру id элемента $(this) + порядковый номер с нуля
...
Рейтинг: 0 / 0
25.05.2016, 20:39
| Ответить | Цитировать | Написать  
Быстродействие JQuery (selector).each()
    #39243497
Фотография Antonariy
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Antonariy
Участник
налицо классическое применение JQuery без применения головного мозга.

нафига простое this.checked = true; оборачивать длинной соплей из внутрижквериевских вызовов? да еще по три раза на каждую итерацию each.
даже так будет выигрыш:

var $th = $(this)

if($th.prop("checked")
$th.prop("checked",true)
change_func($th

кстати, что за prop, когда всю жизнь было attr?

я понимаю, если бы с чекбоксом проделывали пяток операций, гоняя его по dom, но тут всего одна - проверка checked.
...
Рейтинг: 0 / 0
25.05.2016, 21:22
| Ответить | Цитировать | Написать  
Быстродействие JQuery (selector).each()
    #39243521
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
com.ета,
когда чекбокс выбран, присвой строке класс(любой), потом можно этому классу сделать дисплей none, и у тебя будут только выбранные строки
...
Рейтинг: 0 / 0
25.05.2016, 22:01
| Ответить | Цитировать | Написать  
Быстродействие JQuery (selector).each()
    #39243535
com.ета
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
com.ета
Гость
Antonariy,
как вы посоветовали я уже делал, особого прироста это не дало. На пару секунд стало быстрее, но итог один.
Согласен с Вами, что оптимальней делать как Вы написали, я уже это поправил, но это к сожалению общей картины не меняет. При обработке 2 000 записей виснет браузер секунд на 15. Это не приемлемо.
Есть вариант что я некорректно заношу новые строки в таблицу и вследствие этого идет их некорректная обработка...
Функция change_func связана с удалением и добавлением div и tr элементов. Может быть косяк кроется там....
Завтра погляжу код, сейчас на память не помню уже
...
Рейтинг: 0 / 0
25.05.2016, 22:32
| Ответить | Цитировать | Написать  
Быстродействие JQuery (selector).each()
    #39243541
com.ета
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
com.ета
Гость
Antonariy, забыл про .prop написать Вам:

The difference between attributes and properties can be important in specific situations. Before jQuery 1.6, the .attr() method sometimes took property values into account when retrieving some attributes, which could cause inconsistent behavior. As of jQuery 1.6, the .prop() method provides a way to explicitly retrieve property values, while .attr() retrieves attributes.
...
Рейтинг: 0 / 0
25.05.2016, 22:42
| Ответить | Цитировать | Написать  
Быстродействие JQuery (selector).each()
    #39243668
вадя
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
вадя
Участник
читать про вставку
https://learn.javascript.ru/modifying-document
...
Рейтинг: 0 / 0
26.05.2016, 09:36
| Ответить | Цитировать | Написать  
10 сообщений из 10, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Быстродействие JQuery (selector).each()
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


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