Guide to Upgrade MV to PIXI v5

[Jonforum]

euuuu, where is your source, no one say rmmz will use PIXI js.
Also no info in jap forum
Edit:Ha... i see the doc link!

 

[LTN Games]

I wonder if its doc can help upgrading MV to use Pixi v5 as well

Yes should help some but my personal game engine project has given me lots of new knowledge since the last time I touched the PIXI 5 upgrade, so I should be bale to solve all the issues when I do finally get back to it.

I did tell you that your windowlayer changes would cause leaks, right? I think it may have been in a different thread but I remember something like that

Yes you did mention that and the guide I made also mentions it was only a temporary fix and may cause memory leaks. According to DoubleX though, it appears even without my changes and simply using a slightly modified WindowLayer class also causes leaks, so I feel there is something larger at play here.

I'm still not able to work on this, I have one too many projects on the go still anf the pixi5 upgrade is really not on the top of my list, but I'll get there eventually, hopefully before MZ's release.

 

[DoubleX]

I've just tried to replace the MV WindowLayer.prototype.render method with the MZ counterpart, but the memory leak's still there with almost no improvement.
I've thought that this must be the source of memory leak, but now it seems to me that maybe the very adaptation of the Pixi v5.3.0 itself already has some memory leak problems(Now I won't even rule out the possibility that Pixi v5.3.0 itself has memory leaks under certain use cases)

 

[Hudell]

The important part of window layer is the "onRemoveAsChild" method registered to run on the 'removed' event. It makes all of its sub-windows be removed as well. Without it those windows would be leaked.

 

[ImaginaryVillain]

Now that we can get the MZ core files from the games here! It should be a lot easier to see what they changed to make PIXI 5 work.

 

[ThinkN]

Pixi-Tilemap

Some things have changed with pixi-tilemap. It looks like the dev has been pushing a lot of changes this week, so it's an active project.


The naming of the file has changed: "pixi-tilemap.js" will no longer work as a drop-in replacement. You'll now want to use "pixi-tilemap.umd.js" instead.


The read-me file mentions settings specifically for MV:

PIXI.tilemap.Constant.boundCountPerBuffer = 4;
PIXI.tilemap.Constant.maxTextures = 4;

So we may want to add those settings to the project. I don't see any difference compared to the default settings, but your results may vary.


Speaking of settings, these old settings in the ShaderTilemap section of rpg_core.js should be updated to the new format:

Old:

PIXI.tilemap.TileRenderer.SCALE_MODE = PIXI.SCALE_MODES.NEAREST;
PIXI.tilemap.TileRenderer.DO_CLEAR = true;

New:

PIXI.tilemap.Constant.SCALE_MODE = PIXI.SCALE_MODES.NEAREST;
PIXI.tilemap.Constant.DO_CLEAR = true;

------



Graphics._createRenderer


I have a couple observations about Graphics._createRenderer


The first line is meant to suppress the PIXI banner in the console. It no longer works in v5:

PIXI.dontSayHello = true;

The updated code is this:

PIXI.utils.skipHello();

Also in Graphics._createRenderer, there's this garbage collector setting:

if(this._renderer && this._renderer.textureGC)
            this._renderer.textureGC.maxIdle = 1;

It should be cleaner and simpler to use the settings object:

PIXI.settings.GC_MAX_IDLE = 1;

------



Experimental settings

I've tried using PIXI.settings.CREATE_IMAGE_BITMAP = true. It supposedly offers a performance boost, but it is disabled by default due to a variety of edge case issues.

I didn't notice any problems with a basic map and the default assets.

However, once I installed a few plugins and different assets, I started to see bugs.

Sometimes a PNG with 8-bit colour and an alpha channel would lose its transparency, causing the transparent background to become solid white.

Sometimes a PNG with true-colour and transparency would be reduced to 1-bit transparency, meaning all pixels would either become fully transparent or fully opaque.

You're welcome to try it on your own projects - your results may vary.



------



Pixi-Picture

I haven't tried it yet, but pixi-picture has been updated for pixi v5.

 

[Abitkin]

So I've been playing with things today.

First I can give you a fix for the Windows, meaning you won't be breaking everything.

Remove:
this.filterArea = new PIXI.Rectangle();
this.filters = [WindowLayer.voidFilter];

From:
WindowLayer.prototype.initialize = function() {

in RPG_Core.js

Also Pixi-Picture seems to work just fine.

Next I need to look at why I'm not seeing text update (it starts then stops) and why there is a message box at the top of the map when it loads.

 

[LTN Games]

Hey everyone, it appears TheUnproPro had time to fix up the PIXI conversion and released a plugin to auto-update your project. Have a look at it here https://theunpropro.itch.io/rmmv-auto-pixi-530-updater

 

[ImaginaryVillain]

Has anyone else tested TheUnproPro's plugin? It just freezes with no progress on the bar for me.

 

[Abitkin]

I haven't when I went to download it, it was 50 days old already, so I figured it wasn't really correct.

The main problem with the Windows is RenderWebGL is now just Render. I've gone and fixed everything up, I think, updated to PixiJS 5.3.3, NWJS 0.43, and does it ever run so much smoother. Not even using the PixiJS legacy in this case. Needs testing, but maintains 60 FPS most of the time (saw it dip to 54 FPS, once).

I still need to look at why in fullscreen it doesn't scale.

 

[Abitkin]

Got fullscreen scaling fixed up and a fix for the full multiply filter in pixi-picture.

Works great with nwjs v0.45.6, stay away from v0.48+ for performance reasons. This will allow webm files with VP9 to properly play and end. (No black boxes from time to time.)

Works with nwjs v0.29 which is what RPGMaker MV packages with.

 

[Abitkin]

Put together everything. Removed the files from my previous posts because they had issues and I don't want people to run into those problems.

Fixes everything I could find, and brings in some new features. In the zip you'll find a README.md, Pixi libraries, .jshint file, jsconfig.json file, typescript files (for Visual Studio Code in editor documentation) and a patch file. The patch file specifically targets the rpg_* files in www/js. Just in case you need instructions on applying a patch file, you can find them here.

Note: I haven't tried canvas rendering, this is tested using WebGL2 only.

This is from the included README.md:
RPGMaker MV Game Engine 1.6.2.1
This is a set of updates based on RPGMaker MV 1.6.2 to use PixiJS 5.3.3

Features

• Faster rendering
• Case insensitive file loading to better support Linux/Android without having to change your scripts
• With NW.js v0.45.6 plays webm (VP8/VP9) files properly
• Filter change for Pixi-Picture to get it to run properly (Issue submitted waiting for a real fix)
• Added more keys in the keymap for easier use in scripts
• Fixes to documentation, spelling, and javascript syntax
• Added jshint information

Known Issues

• ShaderTilemap is not working properly falling back on Tilemap
  • Doesn't seem to be affecting performance
• Plugins the load files directly or override the functions which load from disk may fail in case sensitive environments
  • Wrap the file path with CS_URL.MapURL() to ensure it resolves to the correct case sensitive name
• Overrides or calls to refereshVehicles will fail
  • Use refreshVehicles instead
• Overrides or calls to updateButtonsVisiblity will fail
  • Use updateButtonsVisibility instead

Further Work

• Cleanup of Javascript (using let/const)
• Add updates to plugins
• Investigate if garbage collection needs to run (possibly do this during scene changes)
• Check for any memory leaks
• Submit issue against Pixi-Tilemap for the rendering issue
• Submit issue against NW.js for performance issues starting with v0.46
• Bring in proper filter fix for Pixi-Picture when it is released

 

[Lanzy]

Put together everything. Removed the files from my previous posts because they had issues and I don't want people to run into those problems.

Fixes everything I could find, and brings in some new features. In the zip you'll find a README.md, Pixi libraries, .jshint file, jsconfig.json file, typescript files (for Visual Studio Code in editor documentation) and a patch file. The patch file specifically targets the rpg_* files in www/js. Just in case you need instructions on applying a patch file, you can find them here.

Note: I haven't tried canvas rendering, this is tested using WebGL2 only.

This is from the included README.md:
RPGMaker MV Game Engine 1.6.2.1
This is a set of updates based on RPGMaker MV 1.6.2 to use PixiJS 5.3.3

Features

• Faster rendering
• Case insensitive file loading to better support Linux/Android without having to change your scripts
• With NW.js v0.45.6 plays webm (VP8/VP9) files properly
• Filter change for Pixi-Picture to get it to run properly (Issue submitted waiting for a real fix)
• Added more keys in the keymap for easier use in scripts
• Fixes to documentation, spelling, and javascript syntax
• Added jshint information

Known Issues

• ShaderTilemap is not working properly falling back on Tilemap
  • Doesn't seem to be affecting performance
• Plugins the load files directly or override the functions which load from disk may fail in case sensitive environments
  • Wrap the file path with CS_URL.MapURL() to ensure it resolves to the correct case sensitive name
• Overrides or calls to refereshVehicles will fail
  • Use refreshVehicles instead
• Overrides or calls to updateButtonsVisiblity will fail
  • Use updateButtonsVisibility instead

Further Work

• Cleanup of Javascript (using let/const)
• Add updates to plugins
• Investigate if garbage collection needs to run (possibly do this during scene changes)
• Check for any memory leaks
• Submit issue against Pixi-Tilemap for the rendering issue
• Submit issue against NW.js for performance issues starting with v0.46
• Bring in proper filter fix for Pixi-Picture when it is released

Thanks for your effort!
One issue I have when patching; there are a lot of failed hunks when patching the rpg files. Could you provide the pre-patched files as an alternative?

Would be greatly appreciated!

 

[Abitkin]

Thanks for your effort!
One issue I have when patching; there are a lot of failed hunks when patching the rpg files. Could you provide the pre-patched files as an alternative?

Would be greatly appreciated!

I would except it violates the RPGMV license. VSCode auto formatted the files on save and to reduce the size of the patch, I ran the auto format on the original code. I was hoping that the patch tool would be able to use the context to fix up those changes.

My suggestion is to open VS Code, open the original files, right click format document and save. Uses the default typescript format settings.
Edit:
Oh and change from CRLF to LF mode.)

Alternatively you can attempt using -l to patch to ignore changes in white space sequences.

 

[Lanzy]

I would except it violates the RPGMV license. VSCode auto formatted the files on save and to reduce the size of the patch, I ran the auto format on the original code. I was hoping that the patch tool would be able to use the context to fix up those changes.

My suggestion is to open VS Code, open the original files, right click format document and save. Uses the default typescript format settings.
Edit:
Oh and change from CRLF to LF mode.)

Alternatively you can attempt using -l to patch to ignore changes in white space sequences.

Thanks for your response.
I followed your instructions and formatted the original rpg files, but unfortunately there are still failed hunks when patching:



Whether I use -l or not it generates the same results.

When I change from CRLF mode to LF I get this:


Maybe I am missing something here?
Thanks again for your help!

 

[LTN Games]

Good work, though I swear TheUnpropro had a fully working version somewhere, odd.

I would except it violates the RPGMV license.

The core script files for MV are MIT License.

 

[Abitkin]

The core script files for MV are MIT License.

Well then, I still need to put in license files, but here: https://git.kins.dev/rpgmaker-mv-pixi5

 

[Abitkin]

So I found an issue with artifacts being left after a zoom/unzoom if I disabled the ShaderTilemap. I enabled it again, gave the default layer a z order of 6 (to fix an intermittent transparency issue.) From those following this thread do you see any issues with giving the upperZlayer a ZIndex of 6? Do I need to go through and update the Zorder for everything?

 

[Lanzy]

So I found an issue with artifacts being left after a zoom/unzoom if I disabled the ShaderTilemap. I enabled it again, gave the default layer a z order of 6 (to fix an intermittent transparency issue.) From those following this thread do you see any issues with giving the upperZlayer a ZIndex of 6? Do I need to go through and update the Zorder for everything?

I don't see a reason not to set it to Zindex of 6.

 

[Abitkin]

I don't see a reason not to set it to Zindex of 6.

Well, that introduces another rendering issue. I feel like this is a game of whack a bug.
So if I set it to layer 4 I get:


And at layer 6 I get:


I feel like I'm really close on this, but missing something simple.

Edit:
I think the issue is in the call to this._sortChildren. If I disable that call and stay on layer 4, items no longer get the transparency issue, but the MC walks on top of items they should be under.

Meaning I probably need to override it and fix it up for the GL layers.

Edit 2:
Got it and pushed up a fix. There's an optimization for the Tilemap that doesn't make sense for the ShaderTilemap (at least when it is using WebGL not sure it ever makes sense) where children are reordered based on the Y coordinate.