Mat Groves

Pixi.js Showcase

Recommended Posts

https://github.com/themoonrat/webgl-benchmark

Lets you compare different scene setups in different versions of pixi and phaser :)

Useful to compare different engine performance. To compare different version performance. And to compare different scene setup performance.

Ie. compare the speed for 'Multiple Textures' for Pixi v3 vs v4. Multi texturing was added for v4, so you'll see a large speed increase. Likewise compare 'Graphics: Complex' from v4 to v5 (dev is best); a lot of work into batching Graphics shows clear performance benefits.

But then on the same hand on a modern Pixi version and test 'Sprites: Multiple Textures' vs 'SpriteSheet', and you'll see speed improvements on devices with less than 16 texture units; showing benefit of keeping sprites onto a single texture.

Any requests, please raise issues :)

 

 

 

 

Share this post


Link to post
Share on other sites

@themoonrat it is pretty much expected Pixi to be a lot faster than Phaser2 and taking advantage over Phaser3 when it comes to sprite+graphics batching. But I'm seeing a huge slowdown with BitmapText rendering, while Phaser3 is rock solid at 60fps.

10000 instances, Pixi 3.0.11 - ~58FPS, 4.0.3 - ~43fps, 4.8.5 - ~40fps, 5.0.0-alpha.3 ~38fps

Why is that? Is it caused by trade-off between raw performance and more complex batching (closer thing to real life usage) in v5?

Share this post


Link to post
Share on other sites

I was in need of some testing tools while trying some things on different mobile devices and with my need to display some things easy on the display without the need to always connect it with dev tools I created https://github.com/jkanchelov/pixi-console

It gives you a PIXI.container which is attached to console.log/warn/error and will display the logs in the canvas. It may be useful for someone. There are a lot of refactoring things and improvements to be done, but in this state is working fine for what I needed it. 

Hope it helps someone   

Share this post


Link to post
Share on other sites
9 minutes ago, jkanchelov said:

I was in need of some testing tools while trying some things on different mobile devices and with my need to display some things easy on the display without the need to always connect it with dev tools I created https://github.com/jkanchelov/pixi-console

It gives you a PIXI.container which is attached to console.log/warn/error and will display the logs in the canvas. It may be useful for someone. There are a lot of refactoring things and improvements to be done, but in this state is working fine for what I needed it. 

Hope it helps someone   

Good job! We'll add it to https://github.com/cursedcoder/awesome-pixijs and wiki

If you use slack, I can send you an invite to pixijs community slack.

If you use telegram and know russian - there are two russian gamedev html5 chats.

Share this post


Link to post
Share on other sites
1 hour ago, ivan.popelyshev said:

Good job! We'll add it to https://github.com/cursedcoder/awesome-pixijs and wiki

If you use slack, I can send you an invite to pixijs community slack.

If you use telegram and know russian - there are two russian gamedev html5 chats.

It would be an honor to be added there.
 
I would like the invite to the pixi.js slack too :)) 

Share this post


Link to post
Share on other sites
57 minutes ago, jkanchelov said:

Here is also an implemented easy to use fps counter ( I couldn't find one ) - https://github.com/jkanchelov/pixi-fps

 

https://github.com/eXponenta/gstatsjs is based on mrdoob  creation, but it shows more than FPS

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.