Управление использованием памяти Javascript

Ответ 1

Просто потому, что вы используете AJAX, это не означает автоматическое оповещение о тревожных звонках в отношении использования памяти... вам следует больше беспокоиться о том, какие вещи вызывают утечку памяти, и убедитесь, что вы так же разрушаете,

• http://javascript.crockford.com/memory/leak.html
• http://nesj.net/blog/2012/04/javascript-memory-leaks/

• http://www.ibm.com/developerworks/web/library/wa-memleak/

• Что такое сборка мусора JavaScript?

Как правило, в любой большой системе я стараюсь создать вспомогательный конструктор, который отслеживает все элементы, которые я могу уничтожить позже или на выгрузке страницы (прослушиватели событий, большие атрибуты или структуры объектов), все индексированные по пространству имен. Затем, когда я закончил с определенным разделом или сущностью, я прошу вспомогательную систему - я называю ее GarbageMonkey:) - для очистки определенного пространства имен.

• Для событий он отпадает
• Для атрибутов это unsets
• Для массивов/объектов он сканирует и отскакивает каждый ключ и может также делать это для подэлементов.
• Для элементов он удаляет и очищает контент как можно больше

Очевидно, что для работы выше нужно быть осторожным, чтобы оставить переменные, лежащие вокруг, которые могут содержать ссылку на данные, которые вы хотите удалить. Таким образом, это означает осознание того, что сборка мусора - это то, что закрытий; и как между ними они могут держать переменную в живых навсегда!!.. или по крайней мере до тех пор, пока браузер/вкладка не будет уничтожен. Это также означает использование структур объектов, а не vars, потому что вы можете удалять ключи в любой области, которая имеет доступ к объекту, но вы не можете сделать это для vars.

Сделайте так:

var data = {}, methods = {}, events = {};

methods.aTestMethod = function(){
  /// by assigning properties to an object, you can easily remove them later
  data.value1 = 123;
  data.value2 = 456;
  data.value3 = 789;
}

Вместо этого:

var value1, value2, value3;

var aTestMethod = function(){
  value1 = 123;
  value2 = 456;
  value3 = 789;
}

Причина в том, что в приведенном выше вы можете сделать следующее:

var i;
for( i in methods ){ delete methods[i]; }
for( i in data ){ delete data[i]; }

Но вы не можете этого сделать:

delete value1;
delete value2;
delete value3;

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

Ответ 2

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

Это можно проверить и контролировать с помощью профилировщика - из-за окна Chrome для него довольно приличный, просто введите about:memory в URL-адрес, и он "Предоставьте вам разбивку по каждой вкладке и даже сравните использование памяти между браузерами. Если у вас есть несколько автоматизированных тестовых сценариев, которые настроены (или готовы перемещаться по 100 страницам вручную), такое профилирование скажет вам, есть ли что-то серьезное с вашим сайтом.

Ответ 3

Существует две разные вещи:

-memory usage

- утечки памяти

Для долговременных webapps следует избегать утечек памяти, иначе пользователи будут испытывать сбои браузера. Чтобы отслеживать использование памяти, вы можете загрузить Process Explorer: http://technet.microsoft.com/en-us/sysinternals/bb896653.aspx

Отключите все плагины вашего браузера, а затем используйте свое приложение и выполните повторяющиеся задачи. Если использование памяти повышается, у вас возникают утечки. IE7 - IE8 делают утечку гораздо легче, чем современные браузеры, и их гораздо сложнее отлаживать, поэтому полезно знать, какая у вас минимальная совместимость с браузером.

Для использования памяти несколько вещей могут помочь уменьшить вес вашего приложения:

• вместо того, чтобы перебирать элементы dom и присоединять функции обработчиков событий, используйте делегирование событий. ED действительно золотая пушка здесь.

• для IE 7/8 было необходимо аннулирование var, и я думаю, что это все еще помогает для современных браузеров (требуется некоторое тестирование). Для этого вам также нужно назвать свои функции, чтобы их можно было удалить из памяти. (см. ответы pebbl для получения более подробной информации об этом)

• сохранить контроль над размером dom. Когда узлы добавляются для функции, их также следует удалить, если эта функция больше не используется.

• добавить ко всем вашим компонентам некоторый метод teardown(), который обрабатывает разгрузку.

ОК, извините, я здесь слишком быстр, но было бы неплохо узнать:

• каков ваш минимальный браузер

• если вы обнаружили утечки

• если ED является достаточным решением (часто это)