jQuery: Как я могу улучшить этот код?

У меня есть это событие крана в приложении iOS, которое я разрабатываю с помощью PhoneGap. Когда я нажимаю на стрелку влево, он находит нужное содержимое и извлекает его из файла JSON. Затем он отображает эти результаты на экране.jQuery: Как я могу улучшить этот код?

Как я могу улучшить это? Есть немного отставания ... Я знаю, что некоторое отставание объясняется задержкой в 300 мсек (что может решить fastclick.js и другие библиотеки), но что еще я могу сделать, чтобы перестроить этот код и сделать его более быстрым? Мне нужно, чтобы он быстро ответил. Спасибо!

// PREVIOUS DAYS 
    $('.left-arrow').on("tap", function() { 
     dateArrayIndex--; 
     todaysDate = morehShiur[dateArrayIndex]['date']; 
     todaysContent = morehShiur[dateArrayIndex]['description']; 
     $('.date').text(todaysDate); 
     var path = window.location.href.replace('index.html', ''); 
     $.getJSON(path + "data/heb-text/" + todaysContent, function(data) { 
      $('.title').empty(); 
      $('ol').empty(); 
      $('.title').append(data['title']); 
      for (var i = 0; i < data.content.length; ++i) { 
       $('ol').append('<li>' + data.content[i]['content'] + '</li>'); 
      } 
      $("html, body").animate({ scrollTop: 0 }, 0); 
     }); 
    });

источник

2014-12-10 shmuli

Задержка, вероятно, находится в вызове ajax. Каждый кран - это запрос. Что вы можете сделать, это сделать какой-то кеш/предварительную выборку данных. –

Если этот код работает, то этот вопрос, вероятно, лучше задать на http://codereview.stackexchange.com/ –

Нужна больше jQuery –

Я согласен с комментариями, что ваше отставание, вероятно, связано с выполнением вызова ajax. Тем не менее, есть несколько вещей, которые вы можете сделать с этим кодом, который потенциально может улучшить ситуацию.

Вы можете скрыть или кешировать свои селекторы, как $('.date'). Поиск DOM дорог.
Вы можете выбрать несколько вещей с помощью , так что ваш пустой становится: $('.title, ol').empty()
Вы можете создать HTML один раз в памяти и затем добавить к DOM, а не добавляя с каждой итерации в ваш цикл.

В качестве примера последнего пункта:

var $liArray = $('<div/>'); 
for (var i = 0; i < data.content.length; ++i) { 
    $liArray.append('<li>Hello</li>'); 
} 
$("ol").append($liArray);

источник

2014-12-10 20:55:26 Baer

Можете ли вы пояснить, что третий вопрос для меня, пожалуйста? – shmuli

@shmuli - Это имеет смысл? – Baer

Я предполагаю, что вы создаете контент, пока он все еще находится в памяти, а затем добавляете его в DOM ** ONCE **, а не взад и вперед в DOM на каждом цикле? – shmuli

можно кэшировать данные сервера на клиенте, чтобы избежать повторных вызовов сервера. Также вы можете предварительно получить данные за 3 дня (текущая дата, предыдущая дата и следующая дата). Таким образом, пользователь не видит задержку для текущей даты. Но на заднем плане вы извлекаете данные за другие дни.

Вы можете попробовать библиотеки типа http://amplifyjs.com/ для запроса кеширования.

источник

2014-12-10 21:01:52 Ahuman

jQuery: Как я могу улучшить этот код?

ответ

Смежные вопросы