[Phaser 3] Spaceinvaders game, please feedback

Showcase
1

Hi,

Made my first Phaser 3 game: Spaceinvaders. I am fairly new to Javascript and new to Phaser. I really like to have some feedback on:

  • API usage
  • best practices
  • codding standards
  • tips

Play: here
Source: github

1 Like
2

Very smooth. I like it. Level 3 is already very hard :slight_smile:
As for coding, maybe add some comments, and try to keep your files small. GameScene.js has a lot going on, easy to lose the overview…

1 Like
3

Hi @bit33,
After seeing your code, there are two things that in my humble opinion could be improved (GameScene.js):

  1. I think you can improve performance by using pools instead of repeatedly creating and destroying objects. This prevents the garbage collector from running during the game as little as possible.
    In your case I mean the aliens and the bullets.
    fireBullet() creates a new bullet in each shot and alienHitEvent() destroys a bullet and an alien in each hit.
  2. Something similar to the previous.
    The update() executes, through handleCursor(), the CreateCursorKeys() method, which creates an object in each frame (30/60 fps).
    You can create the object “cursors” only once in the function create() and make it accessible to the other functions of the scene:
    this.cursors = this.input.keyboard.createCursorKeys();

In more complex games these changes would be more relevant.
Congratulations for your first game with Phaser !! :+1:.

Regards.

1 Like
4

Thanks jjcapellan,

I tried to refactor my code to use pools/groups for my gameobjects. But I can not make it behave the same way as it does when I still used .destroy(). In stead of destroy I now use:

alien.setActive(false);
alien.setVisible(false);

But the other active aliens will still bumb into the old one and don’t move properly. So I tried moving them offScreen:

aliens.setPosition(2000,2000);

But now they end up in the bottom corner and still get velocity when I call group.setVelocityX(20);

So what is the best way to replace the alien.destroy() call then using pools?

5

The aliens group elements have a body, so you should use disableBody :

alien.disableBody (true, true);

This is equivalent to:

alien.body.enable = false;
alien.setActive (false);
alien.setVisible (false);

For the same reason, setPosition() produces unexpected results. An appropriate method would be body.reset:

alien.body.reset (x, y);

Good luck !!

6

Thanks jjcapellan,

that was just what I needed. Have refactored the code, now it recycles all gameobjects, extracted some classes out of main game scene to make the scene code more compact and comprehensive.