JavaScript. Выполняют ли последовательные функции JS и AJAX медленную производительность страницы с течением времени?

Question

Я хотел был бы сделать одностраничный сайт, где контент будет собран и представлен пользователю через вызовы AJAX. Пользователь может, возможно, потратить много часов (или даже дней) на одну единственную страницу, не перезагружая их.

Если я представляю все содержимое в пределах одного «главного DIV», и регулярно менять содержимое с чем-то вроде:

$('#maindiv').html(... some content ...); // JQuery 

будет производительность страницы (запросы данных, отд содержания загрузки, анимация и т.д.) ухудшается с течением времени?

Переменные очищаются после использования, а содержимое не сохраняется нигде после его замены.

Мои первоначальные мысли: no производительность не пострадает, поскольку содержимое заменено (против добавленного и удлиненного), но я не могу найти что-либо для поддержки или опровержения.

Answer 1

Хотя вы можете с уверенностью запрограммировать свое собственное решение с помощью jQuery, я бы очень рекомендовал использовать MV * framework для создания такого одностраничного приложения. Есть много популярных, таких как Angular, Ember, Backbone и т. Д., Которые делают процесс намного проще. Реакция также может быть хорошим компонентом просмотра.

Подход, который вы принимаете, скоро станет очень грязным и приведет к проблемам с производительностью. Каждый раз, когда вы заменяете HTML с помощью метода .html(... some content ...), подумайте, что происходит с существующими узлами DOM. Что происходит со всеми подключенными прослушивателями событий и всеми связанными связями между вашим JS-кодом и элементами DOM.