stage.js icon indicating copy to clipboard operation
stage.js copied to clipboard

webgl support?

Open pkieltyka opened this issue 7 years ago • 8 comments

pkieltyka avatar Mar 15 '17 02:03 pkieltyka

as well, can you comment on differences between stage.js and pixi.js? and its intended purposes and long-term goals?

pkieltyka avatar Mar 15 '17 03:03 pkieltyka

I have no plan for webgl, and I'm not sure if there is a good reason to use webgl for 2D games (other than shader effects).

I have never used pixi.js, I had just check their website before and now again! It looks similar, however:

  • Pixi has some additional webgl features (I can't find any other additional capabilities).
  • Stage.js has pinning, layout and transition, which as far as I know Pixi does not have. Layout is very useful for making game layouts which scale to any screen size/ratio.
  • I also prefer how stage.js code looks, which is subjective.

Stage.js was created by reusing/refactoring my low level code from previous games, which I had developed to have good performance on mobile phones, so I wasn't able to use any other library. It was initially based on this game, which I guess is transpiled from Flash by Adobe. I rewrote it few times to add new features and create a reusable API, but it still inherits same architecture.

shakiba avatar Mar 15 '17 04:03 shakiba

@shakiba WebGL offers hardware acceleration whereas canvas does not. To give you an emperical example, running your planck.js demos on my iPad Pro show a lower FPS than p2.js demos on the same device. p2.js' demos are using pixi with WebGL.

what do you think?

pkieltyka avatar Mar 15 '17 18:03 pkieltyka

As far as I know Canvas is also hardware-accelerated on most modern devices (except some old Androids, so I used this plugin instead). Try 006 and O! instead.

It depends on, I'm not sure which examples you have tried.

There also may be optimization issues in planck.js or its testbed, I have not optimized everything yet.

shakiba avatar Mar 15 '17 18:03 shakiba

You'd know better than me, but I will do some performance testing as I have time over the weeks too

pkieltyka avatar Mar 15 '17 18:03 pkieltyka

A quick search brings up others mentioning webgl is also faster than canvas for various reasons: http://stackoverflow.com/questions/21603350/is-there-any-reason-for-using-webgl-instead-of-2d-canvas-for-2d-games-apps and http://stackoverflow.com/questions/12758915/canvas-2d-context-or-webgl-for-2d-game

pkieltyka avatar Mar 15 '17 18:03 pkieltyka

As long as 2D Canvas is fast enough for a specific application, it doesn't really matter that WebGL is faster. And when it is not, I think it is better to write low level code instead of using pixi or stage.js.

But any way, thanks for bringing up this discussion, I did some quick research and learned some new 2d/webgl optimization tips!

shakiba avatar Mar 15 '17 19:03 shakiba

According to personal practice, WebGL is not supported well in mobile browsers. Thus it will be less fluent than Canvas2d.

waningflow avatar Mar 29 '17 03:03 waningflow