О чем этот пример
В играх, где нужно создавать множество однотипных объектов, например, пуль, постоянное создание и уничтожение спрайтов быстро приводит к падению производительности. Паттерн "Пул объектов" решает эту проблему, заранее создавая запас объектов и переиспользуя их. В этой статье мы разберем, как реализовать пул пуль в Phaser, чтобы ваша игра оставалась плавной даже под нагрузкой.
Версия Phaser: код и демо в этой статье рассчитаны на Phaser 3.90.0.
Живой запуск
Ниже встроен рабочий билд примера. Оригинальный источник: GitHub.
Исходный код
class Example extends Phaser.Scene
{
lastFired = 0;
cursors;
stats;
speed;
ship;
bullets;
preload ()
{
this.load.setBaseURL('https://raw.githubusercontent.com/phaserjs/examples/master/public/');
this.load.image('ship', 'assets/sprites/ship.png');
this.load.image('bullet', 'assets/sprites/bullet.png');
}
create ()
{
class Bullet extends Phaser.GameObjects.Image
{
constructor (scene)
{
super(scene, 0, 0, 'bullet');
this.speed = Phaser.Math.GetSpeed(400, 1);
}
fire (x, y)
{
this.setPosition(x, y - 50);
this.setActive(true);
this.setVisible(true);
}
update (time, delta)
{
this.y -= this.speed * delta;
if (this.y < -50)
{
this.setActive(false);
this.setVisible(false);
}
}
}
// Limited to 20 objects in the pool, not allowed to grow beyond it
// bullets = this.pool.createObjectPool(Bullet, 20);
this.bullets = this.add.group({
classType: Bullet,
maxSize: 20,
runChildUpdate: true
});
// Create the objects in advance, so they're ready and waiting in the pool
this.bullets.createMultiple({ quantity: 20, active: false });
this.ship = this.add.sprite(400, 500, 'ship').setDepth(1);
this.cursors = this.input.keyboard.createCursorKeys();
this.speed = Phaser.Math.GetSpeed(300, 1);
}
update (time, delta)
{
if (this.cursors.left.isDown)
{
this.ship.x -= this.speed * delta;
}
else if (this.cursors.right.isDown)
{
this.ship.x += this.speed * delta;
}
if (this.cursors.up.isDown && time > this.lastFired)
{
const bullet = this.bullets.get();
if (bullet)
{
bullet.fire(this.ship.x, this.ship.y);
this.lastFired = time + 50;
}
}
}
}
const config = {
type: Phaser.WEBGL,
width: 800,
height: 600,
backgroundColor: '#2d2d2d',
parent: 'phaser-example',
scene: Example
};
const game = new Phaser.Game(config);
Проблема: дорогое создание и уничтожение
В игровом цикле каждый кадр может потребовать создания нового объекта (например, выстрела). Создание спрайта через this.add.image() — операция, которая требует выделения памяти, загрузки текстуры и добавления объекта в сцену. Его последующее уничтожение через destroy() возвращает память системе. При высокой частоте выстрелов эти операции становятся "бутылочным горлышком".
Пул объектов работает по принципу кэширования. Мы заранее создаем необходимое количество объектов и помещаем их в специальную коллекцию. Когда объект нужен (игрок выстрелил), мы не создаем его заново, а берем из пула, активируем и перемещаем в нужную точку. Когда объект становится не нужен (пуля улетела за экран), мы не уничтожаем его, а деактивируем и возвращаем в пул для повторного использования. Это сводит дорогостоящие операции к минимуму.
Создаем класс для объекта пула
В Phaser пул удобно организовывать на базе пользовательского класса, унаследованного от игрового объекта. В нашем примере это класс Bullet.
class Bullet extends Phaser.GameObjects.Image
{
constructor (scene)
{
super(scene, 0, 0, 'bullet');
this.speed = Phaser.Math.GetSpeed(400, 1);
}
}Конструктор инициализирует спрайт с текстурой bullet в координатах (0,0). Метод Phaser.Math.GetSpeed пересчитывает пиксели в секунду (400) в значение, пригодное для умножения на delta в методе update. Это делает скорость пули независимой от частоты кадров.
Далее определяем два ключевых метода:
fire (x, y)
{
this.setPosition(x, y - 50);
this.setActive(true);
this.setVisible(true);
}
update (time, delta)
{
this.y -= this.speed * delta;
if (this.y < -50)
{
this.setActive(false);
this.setVisible(false);
}
}Метод fire "выпускает" пулю из точки выстрела корабля. Метод update двигает пулю вверх. Когда пуля улетает за верхнюю границу экрана (с небольшим запасом в -50px), мы не уничтожаем ее, а деактивируем и скрываем с помощью setActive(false) и setVisible(false). Теперь объект готов к повторному использованию.
Инициализация пула через Group
В Phaser пул объектов удобно реализовать с помощью Phaser.GameObjects.Group. Группа может управлять жизненным циклом однотипных объектов.
this.bullets = this.add.group({
classType: Bullet,
maxSize: 20,
runChildUpdate: true
});* classType: Указывает, объекты какого класса будет создавать группа.
* maxSize: Максимальный размер группы. Группа не будет создавать объектов больше этого лимита.
* runChildUpdate: Если true, группа будет автоматически вызывать метод update у каждого активного дочернего объекта в каждом кадре. Это критически важно для движения наших пуль.
Далее мы создаем пул заранее, заполняя его неактивными объектами:
this.bullets.createMultiple({ quantity: 20, active: false });Метод createMultiple создает 20 экземпляров класса Bullet. Параметр active: false создает их сразу в неактивном состоянии, то есть они не будут обновляться (update не вызывается) и отрисовываться. Они ждут своего часа в пуле.
Использование пула в игровом цикле
Теперь в основном методе update сцены мы можем получать пули из пула и "выпускать" их по нажатию клавиши.
if (this.cursors.up.isDown && time > this.lastFired)
{
const bullet = this.bullets.get();
if (bullet)
{
bullet.fire(this.ship.x, this.ship.y);
this.lastFired = time + 50;
}
}Ключевой метод здесь — this.bullets.get(). Он делает следующее:
1. Ищет в группе первый неактивный объект (с active=false).
2. Если такой объект найден, он возвращает его. В нашем случае это экземпляр Bullet.
3. Если неактивных объектов нет, поведение зависит от настроек группы. Поскольку у нас установлен maxSize: 20, а группа уже заполнена, метод вернет undefined (пуля не будет создана).
Если пуля получена (if (bullet)), мы вызываем ее метод fire, который активирует ее и устанавливает позицию. Переменная lastFired и задержка в 50 мс реализуют скорострельность.
Когда пуля в своем методе update улетит за экран и вызовет setActive(false), она автоматически снова станет доступна для вызова this.bullets.get().
Преимущества и настройки под вашу игру
Использование пула дает два главных преимущества: стабильную производительность и предсказуемое потребление памяти. Вы заранее знаете, сколько памяти займут пули (20 объектов), и не столкнетесь с неожиданными паузами на сборку мусора.
Группы в Phaser очень гибки. Вот параметры, которые стоит учитывать:
* maxSize: Подбирайте этот размер под максимальную нагрузку в вашей игре. Если пуль может быть в воздухе не больше 10 одновременно, maxSize: 15 даст небольшой запас.
* runChildUpdate: Отключите (false), если логику обновления объектов (движение, таймеры) вы будете обрабатывать централизованно в другом месте.
* createMultiple: Вы можете создавать объекты не все сразу, а по мере необходимости, убрав этот вызов и позволив группе создавать их при вызове get() до достижения maxSize.
Что попробовать дальше
Пул объектов — это фундаментальный паттерн оптимизации для любых игр, где есть массовое создание однотипных сущностей. Реализация через Phaser.GameObjects.Group проста и эффективна. Для экспериментов попробуйте
- реализовать пул для врагов или частиц взрыва
- добавить разным типам объектов в пуле разные текстуры или поведение
- реализовать приоритетную выборку из пула (например, всегда брать первую созданную пулю)