Выгрузка ресурсов из кеша

Библиотека PixiJS активно использует внутренние механизмы кеширования для оптимизации загрузки и повторного использования ресурсов: текстур, спрайтов, шрифтов, атласов и других ассетов. После первой загрузки ресурс сохраняется во внутреннем хранилище, что позволяет избежать повторных HTTP-запросов и ускоряет создание графических объектов.

В версии 7+ ключевую роль в управлении ресурсами выполняет система Assets, пришедшая на смену устаревшему Loader. Загруженные данные автоматически регистрируются в кеше и становятся доступны по строковому ключу или URL.

Основные типы кешируемых объектов:

  • Texture
  • BaseTexture
  • Spritesheet
  • BitmapFont
  • JSON-данные
  • аудиофайлы (при использовании дополнительных модулей)

Понимание процесса выгрузки ресурсов критично при разработке масштабных приложений, игр и интерактивных интерфейсов, где динамически изменяются сцены и объёмы загружаемых данных.

Причины выгрузки ресурсов

Накопление неиспользуемых текстур приводит к:

  • росту потребления оперативной памяти;
  • увеличению нагрузки на GPU;
  • деградации производительности;
  • утечкам памяти при частых сменах сцен.

Особенно актуальна выгрузка:

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

Удаление ресурсов через систему Assets

В современных версиях PixiJS управление кешем осуществляется через модуль Assets.

Загрузка ресурса

await PIXI.Assets.load('images/player.png');

После загрузки текстура автоматически попадает в кеш.

Выгрузка конкретного ресурса

PIXI.Assets.unload('images/player.png');

Метод unload():

  • удаляет ресурс из внутреннего кеша;
  • освобождает связанные текстуры;
  • уничтожает базовые текстуры при отсутствии других ссылок.

Если ресурс использовался в нескольких объектах, необходимо предварительно убедиться, что ни один объект больше его не использует.

Полная очистка кеша

Для удаления всех ресурсов:

await PIXI.Assets.reset();

Метод reset():

  • очищает внутренние реестры;
  • сбрасывает загруженные ассеты;
  • не уничтожает объекты сцены автоматически.

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

Уничтожение текстур вручную

Иногда требуется более тонкий контроль над жизненным циклом текстур.

Уничтожение Texture

texture.destroy(true);

Параметр true означает, что будет уничтожена и связанная BaseTexture.

Уничтожение спрайта вместе с текстурой

sprite.destroy({
    texture: true,
    baseTexture: true
});

Параметры:

  • texture: true — удаляет текстуру спрайта;
  • baseTexture: true — освобождает GPU-память.

Без явного уничтожения текстуры остаются в кеше.

Работа с TextureCache и BaseTextureCache

Внутренние кеши доступны через:

PIXI.utils.TextureCache
PIXI.utils.BaseTextureCache

Удаление текстуры из кеша:

delete PIXI.utils.TextureCache['images/player.png'];

Удаление базовой текстуры:

delete PIXI.utils.BaseTextureCache['images/player.png'];

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

Выгрузка спрайт-листов (Spritesheet)

При работе с атласами:

const sheet = await PIXI.Assets.load('atlas.json');

Выгрузка:

PIXI.Assets.unload('atlas.json');

Атлас включает:

  • JSON-описание;
  • одну или несколько текстур;
  • набор созданных Texture.

При выгрузке автоматически удаляются связанные текстуры, если на них нет активных ссылок.

Очистка сцены перед выгрузкой

Перед удалением ресурсов требуется:

  1. Удалить объекты из контейнера:

    container.removeChildren();

  2. Уничтожить объекты:

    container.destroy({ children: true });

  3. После этого вызывать Assets.unload().

Если последовательность нарушена, текстуры могут остаться в памяти из-за сохранённых ссылок.

Управление памятью GPU

PixiJS хранит текстуры в виде WebGL-ресурсов. Даже если объект JavaScript удалён, GPU-память освобождается только после вызова destroy().

Особенности:

  • BaseTexture управляет загрузкой в GPU.
  • Texture является обёрткой над BaseTexture.
  • Уничтожение Texture без удаления BaseTexture не освобождает видеопамять.

Правильная последовательность:

  1. Удаление объектов сцены.
  2. Уничтожение текстур.
  3. Очистка кеша.
  4. Принудительная сборка мусора (по возможности браузера).

Автоматическая очистка при смене сцен

В архитектуре игровых приложений распространён шаблон менеджера сцен:

class Scene {
    async load() {}
    update() {}
    destroy() {}
}

Метод destroy() должен:

  • удалять контейнер сцены;
  • уничтожать дочерние объекты;
  • выгружать специфичные ресурсы через Assets.unload().

Такой подход позволяет избежать накопления текстур при многократных переходах.

Проверка состояния кеша

Для диагностики используются:

console.log(Object.keys(PIXI.utils.TextureCache));
console.log(Object.keys(PIXI.utils.BaseTextureCache));

Это позволяет:

  • выявить забытые ресурсы;
  • проверить корректность выгрузки;
  • контролировать рост памяти.

В инструментах разработчика браузера вкладка Memory помогает отслеживать удерживаемые объекты и ссылки.

Особенности работы в WebGL и Canvas

В режиме WebGL:

  • текстуры размещаются в видеопамяти;
  • критично контролировать их уничтожение.

В режиме Canvas:

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

Типичные ошибки при выгрузке

1. Удаление из контейнера без destroy()

Объект исчезает визуально, но текстура остаётся в памяти.

2. Уничтожение спрайта без удаления текстуры

BaseTexture остаётся в кеше.

3. Повторная загрузка одного и того же ресурса

При отсутствии проверки создаются дублирующие записи.

4. Использование устаревшего Loader без ручной очистки

В старых версиях PixiJS Loader не удалял данные автоматически.

Стратегии эффективной выгрузки

1. Загрузка по требованию (lazy loading)

Ресурсы загружаются только при входе на сцену.

2. Групповая выгрузка

Использование массивов ключей:

await PIXI.Assets.unload([
    'enemy.png',
    'boss.png',
    'background.jpg'
]);

3. Разделение глобальных и локальных ассетов

  • Глобальные: UI, шрифты — не выгружаются.
  • Локальные: текстуры уровня — удаляются при выходе.

4. Контроль ссылок

Перед выгрузкой необходимо убедиться, что:

  • отсутствуют активные спрайты;
  • нет ссылок в замыканиях;
  • объекты не сохранены в глобальных переменных.

Управление кешем при динамической генерации текстур

При создании текстур через RenderTexture:

const renderTexture = PIXI.RenderTexture.create({ width: 256, height: 256 });

Освобождение:

renderTexture.destroy(true);

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

Влияние сборщика мусора

JavaScript автоматически освобождает память только при отсутствии ссылок. Однако:

  • WebGL-ресурсы освобождаются только через destroy();
  • кеши PixiJS удерживают ссылки до явного удаления;
  • события и слушатели могут препятствовать очистке.

Корректное удаление обработчиков:

sprite.removeAllListeners();

Архитектурные рекомендации

  • Использование менеджера ресурсов.
  • Централизованный контроль загрузки и выгрузки.
  • Чёткое разделение ответственности сцен.
  • Минимизация глобальных ссылок.
  • Регулярное тестирование утечек памяти.

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

Оглавление