Чтобы предотвратить утечки памяти в JavaScript, я следую этим ключевым практикам:
let/const вместо неявного создания глобальных переменных, которые сохраняются на всё время жизни страницыWeakMap/WeakSet для хранения метаданных объектов, так как они содержат слабые ссылки, которые не препятствуют сборке мусораДвумя из наиболее частых источников утечек памяти являются неочищенные таймеры и забытые слушатели событий:
clearInterval() или clearTimeout() когда таймер больше не нуженremoveEventListener() когда компонент или DOM-элемент удалёнconst timer = setInterval(doWork, 1000);
clearInterval(timer); // clean up when done
element.addEventListener('click', handler);
element.removeEventListener('click', handler); // clean up on destroy
Будь осторожен с замыканиями — избегай хранения больших структур данных внутри них без необходимости, так как переменные внутри замыкания остаются в памяти пока существует функция.
Для обнаружения утечек я использую браузерный DevTools:
Ключевой принцип — убедиться, что ничего не остаётся в памяти дольше, чем нужно. Сочетая дисциплинированные практики написания кода с регулярным профилированием через DevTools, большинство утечек памяти можно выявить на ранней стадии и предотвратить до того, как они повлияют на производительность.
WeakMap и WeakSet предотвращают сборку мусора хранящихся в них объектов, что делает их непригодными для управления временными метаданными объектов.
Новый — ещё не проверен сообществом
Вы