Choosing what Phaser 3 modules to include in a game build


#1

Hi, I’ve red about creating Phaser custom builds on https://madmimi.com/p/ffcfbc.

But I’m more interested on the second approach mentioned there: “… Or, you can create a project that pulls in just the modules you need from Phaser via require or import calls. We’re going to cover the first approach for this guide.”

I wonder if anyone has done something like it and has some example code to share or could provide some guidance.

Thanks


#2

Hi @glantucan and welcome!

I’m not sure what he meant in approach two. But webpack provides a handy feature called Tree Shaking, but unfortunately this does not work with phaser at the moment, since it is not using only ES2015 module syntax.

I guess once phaser has adapted the code, this will be the best way to minimize the code you include in your production build.

I guess your goal by making a custom build was to minimize the shipped code?


#3

Thanks for your answer, @yannick.

Yes, the goal is to minimize the amount of code the users have to download. Being able to custom build the phaser library is good, but being able to import just what I need from the client code would be a much better workflow in my opinion, at least for me.


#4

Hopefully Phaser will soon be ported entirely to the new syntax (or even to TypeScript) to be able to Tree Shake unnecessary code automatically.

For now the minified a gzipped version of phaser is ~230kb large, which is also acceptable. At least for me :slight_smile:


#5

Creating a custom build is what you’re looking for. Checkout this example repo.


#6

Or, you can create a project that pulls in just the modules you need from Phaser via require or import calls.

I think this is still feasible, according to Rich. You have to import Phaser.Game and maybe Phaser.Scene as well.