Предотвращение тайм-аута сценария с большими селекторами jQuery

Question

Для проекта, над которым я работаю, на странице есть несколько полей для редактирования расширенного текста, число которых варьируется, но может быть очень большим (более 50 наборов вопросов / ответов, каждое с 8 текстовыми полями).

Первоначально это были текстовые поля, которые принимали HTML, но из-за того, что конечный клиент, который будет использовать его, не владеет HTML, мы перешли на использование редактора richtext, поэтому оригиналы конвертируются с помощью плагина javascript richtext (NicEdit).

Из-за переменного количества этих полей ввода я использую селектор jQuery:

 $("textarea").each(function(index) {
      var id = this.id;
      myNicEditor.addInstance(this);
      $("#nic"+id).attr('contenteditable','false');
 });

Тем не менее, когда общее количество редакторов превышает 200, я начинаю получать предупреждения о превышении времени ожидания сценария. На 400 я должен дважды нажать "продолжить", чтобы закончить.

Как бы я реструктурировал эту функцию, чтобы предотвратить тайм-ауты?

Answer 1

jQuery делает много вещей в селекторе, но найденные элементы не заключены в объекты jQuery. 200 не такой большой, но в любом случае есть 2 вещи, которые вы можете сделать:

1. Найти все текстовые сообщения с помощью ванильного вызова JavaScript
2. Обработать текстовые области в очереди событий через setTimeout

var els = document.getElementsByTagName("textarea")
var i = 0
var func = function() {
    var el = els[i]
    myNicEditor.addInstance(el);
    $("#nic"+el.id).attr('contenteditable','false');
    i++
    setTimeout(func,0)
}
func()

Answer 2

400 полнофункциональных текстовых редакторов на веб-странице должны использовать массу ресурсов. Я думаю, что ваш лучший выбор - не пытаться разместить все это на одной странице. Попробуйте реорганизовать ваше приложение - возможно, разбейте его на более мелкие страницы или, при необходимости, загрузите подразделы страницы.

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