Производительность на Phaser.js - PullRequest
Новая
       10

Производительность на Phaser.js

1 голос
/ 20 сентября 2019 

function preload() {
  this.load.image('background', 'images/table_en.png.webp');
  this.load.image('wheel', 'images/UpperWheel.png.webp');
  this.load.image('ball', 'images/ball.png.webp');

  roulette.circle.array.forEach(i => {
    this.load.image(`${i.index}`, i.src);
  });
  roulette.lever.array.forEach(i => {
    this.load.image(`${i.index}`, i.src)
  });
}

function update() {
  if (roulette.circle.previousCircle) {
    roulette.circle.previousCircle.destroy()
  }

  if (roulette.circle.previousLever) {
    roulette.circle.previousLever.destroy();
  }

  if (roulette.circle.currentStep === 100 && run) {
    ball.run = true;
  }

  let circle = this.add.image(108, 110, `circle${roulette.circle.currentStep}`).setOrigin(0, 0).setScale(0.7);
  let lever = this.add.image(200, 150, `lever${roulette.lever.currentStep}`).setOrigin(0, 0).setScale(0.7);

  roulette.circle.method();
  roulette.lever.method();
  roulette.circle.previousCircle = circle;
  roulette.circle.previousLever = lever;
}

Пишу рулетку, где на колесо выпадает 359 картинок (учитывая все его условия).Я загрузил все эти изображения в функцию предварительной загрузки , а в функцию обновления я просто создаю загруженную картинку и удаляю предыдущую. Все это влияет на производительность (поскольку скорость смены изображений может быть разной).Как решить эту проблему?

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

1 Ответ

1 голос
/ 20 сентября 2019

Метод update() вызывается один раз за кадр.Целевые кадры по умолчанию в секунду (fps) в играх Phaser: 60 - Справочник по API .

Многие факторы в вашей игре могут влиять на фактический fps, который вы увидите.Если вы оставите его по умолчанию, ваш метод update() будет вызываться примерно 60 раз в секунду.Если вы хотите, чтобы пользователь действительно мог видеть каждое изображение, это, вероятно, нежелательное поведение.

Вы можете уменьшить целевое число fps в конфигурации игры, например: 

{ 
  type: Phaser.AUTO,
  ...,
  fps: {
    target: 30 // 30x per second
  }
}

... но это может быть несовершенным.Это глобальное изменение скорости обновления вашей игры, и возможны другие вещи, которые вы хотите выполнить 60 раз в секунду (например, проверка ввода и т. Д.).

Чтобы изменить частоту смены изображений без изменения fps в вашей игре, рассмотрите возможность создания отдельного метода для обработки уничтожения / создания изображений и ссылки на этот метод внутри update().

function update() {
  if (!changingImage) {
    changingImage = true;
    changeImage();
  }
}

function changeImage() {
  if (roulette.circle.previousCircle) {
    roulette.circle.previousCircle.destroy()
  }

  if (roulette.circle.previousLever) {
    roulette.circle.previousLever.destroy();
  }

  if (roulette.circle.currentStep === 100 && run) {
    ball.run = true;
  }

  let circle = this.add.image(108, 110, `circle${roulette.circle.currentStep}`).setOrigin(0, 0).setScale(0.7);
  let lever = this.add.image(200, 150, `lever${roulette.lever.currentStep}`).setOrigin(0, 0).setScale(0.7);

  roulette.circle.method();
  roulette.lever.method();
  roulette.circle.previousCircle = circle;
  roulette.circle.previousLever = lever;

  changeImage = true;
}

Если это все еще происходит слишком быстро, рассмотрите возможность включения логического значения changeImage в тайм-аут, чтобы еще больше отсрочить частоту обновления ваших изображений.

  setTimeout(() => {
    changingImage = true;
  }, 1000);
...