Чистка памяти после закрытия/удаления iFrame

Вопрос-ответ JavaScript
1

Как корректно закрыть/удалить iframe со страницы что бы память освободилась?

заметил что при открывании на основной странице других iframe-ов памяти потребляется все больше и больше но при этом если просто удалить iframe очистка памяти не произойдет.

Как быть?

Нашел этот способ.
Сотворил такой код (не судите строго, делал на скорую руку):

let userIframe = $('<iframe>', {
    src: 'https://www.google.com',
    id:'userIframe',
    frameborder: 0,
    scrolling: 'yes'
});

userIframe.on('load', function() {

    userIframe[0].contentWindow.onbeforeunload = function() {
        console.log("IFRAME UNLOADING");
        console.log(this);
        $(this.document).off();
        $(userIframe.contents()).find('*').off();
        userIframe.remove();
        userIframe = null;
    };

});

$('body').append(userIframe);

setTimeout(function() {
      userIframe.attr('src', 'about:blank');
}, 10000);

После выполнения iframe пропадает, но памяти очищается все пару мб, тогда как занимало около 20.
Добрые люди подскажите.

2

Зависит от того как ты работаешь с ифреймом. Если ты никак не трогаешь его с родительской страницы, то и в дополнительныз действиях по очистке смысла нет.

А если ты где-то явно или неявно на главной странице хранишь ссылки на узлы из ифрейма, то память, ими занимаемая, не будет освобождена после удаления. Тогда твоя задача сводится к обнулению ссылок на переменные и Dom узлы из ифрейма.

И третий момент. Высвобождение памяти - дорогой процесс, поэтому браузеры хитро планирую его. Поэтому освобождение памяти может произойти, а может и нет после удаления ифрейма. Например браузер может запланировать очистку памяти на момент когда потребуется новая (что будет варьироваться в зависимости от количества ram).

И четвертое - есть техники по поиску утечек памяти (это термин для ситуации когда память не освобождается, но должна). Гугл по ключевым словам “отладка утечки памяти chrome”.

3

На странице, на которой я работаю открывается последовательно много фреймов, то бишь одно открылось, сделалось что нужно, закрылось. Открылось следующее и так далее.

Да у меня есть переменная которая хранит iframe, я её обнуляю, то бишь задаю null, но это не решает проблему.

В ходе всего этого процесса, в диспетчере процессов хрома я вижу как растет кол-во выделенной памяти вкладки и это не чистится.

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

4

В этом нужно убедиться. Посмотри высвобождается ли память при явном запросе на высвобождение. Для этого пользуйся панелью Performance в хроме.

Cursor_and_London_Community
Cursor_and_London_Community1106×608 32.5 KB

Если память таки не высвободилась, то отлаживай страницу как указано в этом гайде:
Chrome DevTools - Chrome for Developers.

5

Пробовал чистить. Вышло вот что:
изначально страница занимает ~55 000K. После открытия одного iframe помять возрастает до ~75 000 K.
После чистки через кнопку остаётся ~72 000K. То бишь не чистится ничего.

буду смотреть на ссылки.

6

Не могу понять принцип работы того что описано.

Уже чистил линки, переменные - не освобождается память.

Можете помочь, пожалуйста?

7

Посмотри эту статью. Старая, но верная и хорошо расписано на русском.

1 лайк