Hello, I wonder if it is possible to rebuild PlayCanvas myself?
I’m not going to use an editor for this project, so I’m very interested in keeping the size as small as possible.
Where to start? What can be removed? Any information would be appreciated, thank you
This would depend on which dependencies your project needs. Will Eastcott shared this treemap visualization of the PlayCanvas engine codebase which might be helpful.
Source: https://twitter.com/willeastcott/status/1486375225553993735
If you’re not using Editor but doing engine only project, you should use ES6 module build of the engine (from npm) and set up your bundler to tree-shake the project, which would remove unused parts of the engine.
The examples of our internal projects that do this are:
They both use the rollup bundler. You could probably just start with those as a template. They both use typescript, but this should work with JS as well.
Also not that they do not use Application class, but AppBase, which is a base class of it, and allows you to create the instance with only components / loaders you need. For example examples use this (depending on what they use):
Thanks for resources, will have much to learn.
I’d still need to export it as a one file .js lib that includes all modules, looking at treemap everything seems to be in need, except for XR/VR/Deprecated 
Yes, those projects are bundled to a single ES5 js file.
But if you need all those things, apart from very few, you won’t save much. The whole engine when zipped up (which is what is typically downloaded) is around 360kb, so this is not huge to start with. If you’d only needed glb / texture loading with rendering, without particles, UI, physics, model component and few more, that can come down to around 200kb.
I have tried the build method you mentioned, but unfortunately in my case it doesn’t work for me, even though the method works fine, the problem is that I don’t have a specific project to build a bundle from, I just know what modules/functions I don’t really need.
What if I build from engine?
git clone https://github.com/playcanvas/engine.git
Where and how to correctly “exclude” modules that I don’t need before npm run build ?
Update: I’ve tried to remove all XR stuff from playcanvas\engine\src\index.js
The build is few kb less, but after inspecting the builded file XR stuff is still there, must be doing something wrong
You also need to exclude the Application from the index, as it internally imports lots of modules, and in the app you’re building, you need to use new AppBase() and shown above, instead of new Application().
Okay, I’m nearly down in 158kB from official minified stable build.
Removed:
Any ideas what to get rid of next? The project will mainly use models, screens, sounds, shaders and physics to create 3D worlds, PC/Phone
Perhaps I could drop anim and use animation instead? (Regarding player animations)
Are they interconnected?
Also, what is i18n?
You can remove any imports your AppBase does not use, see everything you can remove here:
Thanks, saved around 200kB, I’m just not sure about the anim/animation, I couldn’t remove the anim modules completely, as animation requires anim-curve, so hopefully there won’t be any problems with that.
200KB is a nice saving, good job! Out of curiousity, what was the starting build size (before the 200KB reduction)?
Unmodified minified build - 1469kb
v1.65.0-dev revision
Modified minified build - 1246kb
That’s a pretty small win I think. When your server serves those zipped up, it will be 370kb vs 310kb. I think this comes from the fact that you need most of the features of the engine we can strip.
You can use command
npm run build:treemap
to generate up to date image as shown in the post earlier, to see if there’s anything else you could strip. This command generates treemap.html in the root folder.