Управление использованием памяти javascript на динамически загружаемых страницах

Question

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

Я разрабатываю одностраничное веб-приложение, где все страницы, кроме главной страницы (с системой меню) загружаются динамически через ajax. Все библиотеки javascript, которые я использую (jquery, bootstrap, kendo и другие), загружаются на главной странице, а также в файлы application.js и css.

Каждая загружаемая мной страница требует наличия собственного javascript и имеет соответствующие файлы js с именем так же, как и файл html (для моего собственного здравомыслия). Когда страница загружается и устанавливается в элементе контента, запускается страница js, что отлично.

Вскоре я понял, что страница js добавляет любые переменные, которые она создает, к глобальному пространству javascript. В идеале при загрузке другой страницы эти переменные исчезнут, поэтому сборка мусора javascript может в конечном итоге вернуть эту память.

Чтобы облегчить это, я начал повторять использование одинаковых имен для общих структур, таких как модели просмотра kendo, поэтому при загрузке новой страницы он заменяет любые глобальные переменные с тем же именем.

В некоторых случаях, когда есть специализированные переменные, я устанавливаю их значения равными нулю, чтобы освободить память в глобальной функции загрузчика ajax.

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

Мои вопросы:

1. это имеет значение? я должен заботиться о нескольких килограммах бара, который может быть оставлен.

2. Есть ли лучшие способы обращения с этим?

3. Что я сейчас делаю, даже эффективно? Является ли сборщик мусора javascript очищенным не привязанным к нему баром, как я думаю, что он делает?

Followup после ответа Джакомо в:

Джакомо ваша техника работает в том смысле, что функции страницы нормально и кендо переплеты имеют доступ к локальной переменной ViewModel, созданной в обычной страницы. Меня беспокоит, что я не знаю, как он работает. Я опустил var page = Page(); назначение и просто включить страницу(); в конце сценария (вне функции Page()), и, похоже, нет никаких отрицательных эффектов.

Как я вижу, скрипт запускается, когда страница установлена ​​в html (div) этого родительского элемента, это определяет затем функцию Page(), которая создает все локальные переменные и виджеты/привязки кендо на странице, тогда он выпадает из сферы действия. Как только функция Page() завершится и закончится, и ничего не останется, однако созданная мной модель просмотра останется, потому что страница и привязка всей работы, события click, определенные в Page(), выполняются и т. Д. Итак, когда все это исчезнет? Будет ли он выделен, когда я заменю html родителя на новую страницу? Я не вижу, как ... конечно, независимо от того, что делает кендо, чтобы сохранить ссылку на viewmodel, кажется, что он жив, я не уверен, что он будет выпущен, когда страница исчезнет, ​​что является моим целым намерением.

Возможно, что страница = новая страница(); имеет важное значение для процесса де-распределения ... но я не знаю, как это определить.

Возможное решение?

Может кто-то комментарий на сумму этого:

//enters here on ajax page load after inserted into DOM 
var pageData = { 
    someData: 999, 
    someArray: ["one","two"], 
    functionOne: function(arg) { 
     //stuff 
    }, 
    functionTwo: function(arg) { 
     //stuff 
    } 
}; 

//do some work 
pageData.functionOne(pageData.someData); 
pageData.functionTwo("abc"); 

//called before page is removed from DOM 
function releasePage() { 
    pageData = null; 
} 

//GC eventually cleans it up 

Answer 1

вы можете положить JS код каждой страницы в затворе, как:

function Page() { 
    var var1; 
    var var2; 

    function myFunc() { 
    //... 
    } 
} 

, а затем присвоить его переменной на "странице переключения"

var page = new Page();

вы можете продолжать переназначать одну и ту же переменную каждый раз