DesertEagle Posted February 6, 2014 Share Posted February 6, 2014 Hi there,I was tremendously impressed with the performance of the PixiJS example applications on my various mobile phones and tablet devices. I have not had nearly that level of performance when using KineticJS. Accordingly, I decided to make my own stress test using the starter tutorial on Pixi and the GSAP tweening framework. The stress test is here:http://visualtimeline.elasticbeanstalk.com/testRig.html Performance is mostly buttery smooth in Desktop Chrome and Firefox, with minor (OS related?) herky-jerkiness on occasion. Firefox on Android is pretty slow (not a huge surprise). Chrome on Android is very inconsistent (surprising - Using a Samsung Note 3). Safari on the Apple 5c is buttery smooth. Is this a fair test? Or did I do something really suboptimal from a coding standpoint? It's true I'm not using the minified versions of anything, and the Pixi version is Dev. If it is a fair test, I'm curious as to what I'm doing that puts the performance so far outside of the example apps on Android. Any help is greatly appreciated.Cheers,Travis Quote Link to comment Share on other sites More sharing options...
xerver Posted February 6, 2014 Share Posted February 6, 2014 Looks good to me, if I had to guess I would say TweenMax is the bottleneck on mobile It took longer for it to tween properties than pixi did for all the rendering: -Chad Quote Link to comment Share on other sites More sharing options...
DesertEagle Posted February 6, 2014 Author Share Posted February 6, 2014 Interesting. I'll switch to a hand coded tween and see if it improves. Quote Link to comment Share on other sites More sharing options...
DesertEagle Posted February 8, 2014 Author Share Posted February 8, 2014 Ok. Updated version here:http://visualtimeline.elasticbeanstalk.com/testRig3.html Runs buttery smooth on everything except non-Chrome Samsung Internet browser, in which it exhibits a series of 'trails' and strange rendering artifacts. Not sure why the Samsung browser isn't clearing the screen properly now, but it looks like removing GSAP solved the main (lag related) issue. Thanks!Travis Quote Link to comment Share on other sites More sharing options...
Mat Groves Posted February 9, 2014 Share Posted February 9, 2014 Good to hear it working better! The dev branch does not use clearRect so might be worth giving that a try on the samsung browser? Quote Link to comment Share on other sites More sharing options...
alex_h Posted February 9, 2014 Share Posted February 9, 2014 Samsung stock browser has definitely had issues with clearRect. I'd be interested to hear what other means you are using? Quote Link to comment Share on other sites More sharing options...
Mat Groves Posted February 9, 2014 Share Posted February 9, 2014 Samsung stock browser has definitely had issues with clearRect. I'd be interested to hear what other means you are using? If the canvas render is not transparent we are now using fillRect instead. We found it much faster and it also plays nicer with the new alpha property that modern canvas' support. austin 1 Quote Link to comment Share on other sites More sharing options...
alex_h Posted February 9, 2014 Share Posted February 9, 2014 ...( slaps forehead ) ... of course! thanks for that! So thinking about it, I've tended to use a transparent canvas with a background applied to the game div through css in order to reduce the canvas draw calls. But perhaps any performance gain from this might actually be lost through the costs of having a transparent canvas and calling clearRect on it. I guess I'd better do some testing to find out. Quote Link to comment Share on other sites More sharing options...
DesertEagle Posted February 27, 2014 Author Share Posted February 27, 2014 Hi All,the latest build of Pixi (both dev and regular versions) seems to break Chrome on my Android Phone (Galaxy Note 3). http://visualtimeline.elasticbeanstalk.com/testRig3.html As well, the Samsung stock android browser remains broken. I've tried using both 'getAnimFrame' and 'setTimeout' but doesn't seem to make a difference. Any idea what's causing this behavior? Works fine in:Mobile FirefoxSafariChrome on PCFirefox on PC Thanks,T. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.