Браузер не является гладким при использовании jQuery «replaceWith»

Question

Я использую jQuery replaceWith для обновления информации о моем веб-сайте. Возвращаемые элементы Div небольшие. Функция вызывается через 5 минут. Когда я сосредотачиваюсь на браузере, функция replaceWith будет работать, но мой браузер не является гладким и когда-нибудь может сработать. Какой плагин или решение можно использовать для решения проблемы? я использовал:

$('#hotpost').hide().html(newHtml).fadeIn("slow"); 
$('#hotpost div.content').hide().replaceWith(newHtml).fadeIn("slow"); 

Answer 1

Я считаю, что вы должны скомпилировать HTML в фрагмент документа , используя, например, эту функцию

var compileHTML = function (html) { 
    var div = document.createElement("div"); 
    div.innerHTML = html; 
    var fragment = document.createDocumentFragment(); 
    while (div.firstChild) { 
     fragment.appendChild(div.firstChild); 
    } 
    return fragment 
}; 

перед добавлением вашего HTML в новый DIV так:

$('#hotpost').hide().html(compileHTML(newHtml)).fadeIn("slow"); 

Плюс я увидел, что в вашем коде вы используете setInterval, который при размытии окна может иметь неосмотрительность г поведения, вы могли бы использовать это:

(function loop(){ 
    //what you need to do 
    $('#hotpost').hide().html(compileHTML(newHtml)).fadeIn("slow"); //for example 
    setTimeout(loop, (18000)); 
})(); 

этот новый цикл будет ждать, пока код внутри не выполняется перед циклом снова, а не выполнение кода и («нет», говорит обозреватель, «пользователь использует память другая вкладка ") И когда вы возвращаетесь на свою страницу, одновременно происходит несколько анимаций ...