phaserjs / phaser

Phaser is a fun, free and fast 2D game framework for making HTML5 games for desktop and mobile web browsers, supporting Canvas and WebGL rendering.
https://phaser.io
MIT License
37.15k stars 7.1k forks source link

Is there a way to change FPS of MatterJS? Since it works at different speed on different devices #6468

Closed ProgrammingLife closed 8 months ago

ProgrammingLife commented 1 year ago

The problem is described here: https://github.com/liabru/matter-js/issues/851 When you use iPhone in low power mode then your max browser FPS is 30. I couldn't set MatterJS to work with 30fps and it looks that it can't work at 30fps as it created for working in 60fps only if I got the information from its creator right. I use some workaround to avoid this problem: I turn off the matterJS's engine and manually call matter.engine.step( dt/2 ) two times in a row when I detect 30fps. It works but this looks too bad for a good solution.

But how to deal with 144Hz screens or 250Hz? Passing several step calls or set max fps for Phaser as 60fps?

Is there a way in Phaser to control this option? https://brm.io/matter-js/docs/classes/Runner.html#property_isFixed

russeg commented 1 year ago

matterjs is so buggy, there are multiple reports on that issue and others similar to it. we forked matterjs and fixed and removed some stuff to optimize it. for our next project we will be using babylonjs instead even for 2d.

MEnesCakar commented 1 year ago

var timer = scene.time.addEvent({ delay: 17, // ms callback: () => { scene.matter.step(17); }, //args: [], loop: true, });

I use something like this for consistent physics, instead of automatic updates of matter.

ProgrammingLife commented 1 year ago

var timer = scene.time.addEvent({ delay: 17, // ms callback: () => { scene.matter.step(17); }, //args: [], loop: true, });

I use something like this for consistent physics, instead of automatic updates of matter.

Looks it will not be synchronized with Phaser render's fps when the device renders at speed of 30fps and you will see some glitches with physics objects if you use something like: this.matter.add.image(...).

ProgrammingLife commented 1 year ago

for our next project we will be using babylonjs instead even for 2d.

That's a big overhead for a 2D project, isn't it? 😀 Maybe it's better to use planck.js or even rapier physics?

ProgrammingLife commented 1 year ago

@photonstorm @samme Could you please guys clarify why changing FPS rate changes the speed of physics simulation when it should consistently works on fixed speed of 60fps and not rely on Phasers fps? Maybe Phaser doing something wrong here when it gets the current state of physics simulation?

samme commented 1 year ago

I think the problem with different browser animation rates (30Hz, 144Hz, 250Hz) is that Matter still expects a target FPS (default 60) and clamps the delta accordingly (16.6 to 33.3ms by default). If you log this.matter.world.runner you can see this.

If you're forcing an FPS limit, I think you need to pass the same target to Matter:

new Phaser.Game({
  fps: {
    forceSetTimeOut: true,
    target: 30
  },
  physics: {
    default: 'matter',
    matter: {
      runner: {
        fps: 30
      }
    }
  }
});

You can set runner.isFixed in Matter's config but I don't think you want to do that by itself, because it means make one fixed-size step (default 16.6ms) no matter what the browser's frame delta is.

This seems to handle different browser animation rates:

new Phaser.Game({
  physics: {
    default: 'matter',
    matter: {
      getDelta: function () {
        return this.scene.game.loop.delta;
      },
      runner: {
        isFixed: true
      }
    }
  }
});

You could also turn off autoUpdate and step through the game loop delta yourself at a fixed rate.

samme commented 1 year ago

You can try Matter Physics deltaMin and deltaMax on your device. It looks like the default range (16–33ms) should accommodate 30–60fps from the browser.

Matter Physics deltaMin and deltaMax

photonstorm commented 8 months ago

Going to close this as we're at the whims of Matter in this regard. There are signs of an improved runner upstream, but until they venture into Matter main, or even a branch, there's nothing much I'm willing to do lest we diverge even further from them. Once they appear upstream, we'll integrate them.