Ответ
Memory leak — это ситуация, когда приложение продолжает удерживать память, которая больше не нужна, вместо того чтобы освободить её для сборщика мусора (Garbage Collector). Это приводит к постепенному увеличению потребления памяти и может вызвать замедление или падение приложения.
Частые причины во фронтенде:
- Неудалённые слушатели событий (addEventListener без removeEventListener)
- Замыкания, сохраняющие ссылки на большие объекты
- Утечки в SPA (например, неочищенные подписки RxJS, интервалы)
Пример утечки:
const hugeArray = new Array(1000000).fill('data');
// Замыкание сохраняет ссылку на hugeArray
function createLeak() {
const localData = hugeArray;
return function() {
console.log(localData.length);
};
}
// leakedFunc продолжает держать ссылку на hugeArray
const leakedFunc = createLeak();
Как избегать:
- Используйте WeakMap/WeakSet для хранения временных данных
- Всегда очищайте таймеры (clearTimeout) и подписки (unsubscribe)
- В React используйте useEffect с cleanup-функциями
Ответ 18+ 🔞
Да ты посмотри, что творят-то, блядь! Сидит себе фронтендер, пыхтит, пишет красоту, а приложение через час как сонная муха — память жрёт, как не в себя, и накрывается медным тазом. Это, сука, memory leak называется! По-нашему — утечка памяти, когда твоя програнь забывает, что можно мусор выкинуть, и тащит в дом всякий хлам, который уже не нужен.
Откуда эта хуйня обычно лезет, а?
- Слушатели событий, которые навешали, а снять забыли. Как тот гость, который пришёл на пятёрочку и остался на год.
addEventListenerвызвал —removeEventListenerподавился, блядь. - Замыкания, эти хитрожопые суки. Захватят они в свои лапы какой-нибудь здоровенный массив и не отпускают, даже если он уже давно в прошлой жизни был нужен.
- В этих ваших модных SPA-приложениях — подписки на RxJS, которые висят, как сопли, или интервалы, которые тикают, даже когда страницу на хуй закрыли.
Вот, смотри, как это выглядит в коде, ёпта:
const hugeArray = new Array(1000000).fill('data'); // Массив на миллион строк, ни хуя себе!
// А вот и замыкание-ловушка, хитрая жопа
function createLeak() {
const localData = hugeArray; // Ёбта, схватила и не отпускает!
return function() {
console.log(localData.length); // А эта функция теперь тащит за собой весь этот воз!
};
}
// И пошло-поехало, утечка пошла
const leakedFunc = createLeak();
// Теперь leakedFunc, сука, держит за шкирку тот здоровенный hugeArray до скончания веков.
Как с этим бороться, чтобы не охуеть?
- WeakMap с WeakSet'ом — это твои лучшие друзья для временных данных. Они не держат мёртвой хваткой, отпускают, когда надо.
- Всё за собой прибирай, как в бане! Таймеры (
clearTimeout), подписки (unsubscribe) — всё нахуй отменяй, когда компонент или модуль помирает. - В React'е не будь распиздяем — в
useEffectвсегда возвращай cleanup-функцию, чтобы поубирать за собой тот бардак, который наворотил.
Вот и вся наука, блядь. А то напишут кучу кода, а потом удивляются — «ой, что-то браузер тормозит». Да потому что память вся в соплях, вот что!