Simple sprite movement choppy on Android

[Tee]

Hi all - hopefully this isn't too noobish of me, but I've done a fair amount of searching the forums and can't seem to find a reliable answer on this issue.

I'm loving Pixi when I test it on my laptop's browser, but when I port it over to Android (version 7.0 on a Galaxy S7) via Phonegap Build, things get super slow. I kept removing portions of my game to see if that fixed things until I figured it'd be quicker to just start from the most basic setup - moving a sprite created from an image across the stage. This runs about the same as my game, and it's of course a ton simpler. Even if it happens to reach 60 FPS for a few seconds there are jumps in the movement. Here's the code:

The image, dude.png, is 32-bit, 1024x512 with transparency. Anyone else having this issue or know what could be causing it? I'm using the 4.6.2 version of Pixi.

Thanks for taking a look!

var dude,app,screenW=window.innerWidth,screenH=window.innerHeight;
		//Create a Pixi Application
		app = new PIXI.Application({                    
			antialias: true, 
			transparent: true, 
			resolution: window.devicePixelRatio,
			interactive:true
		  }
		);
		app.renderer.view.style.position = "absolute";
		app.renderer.view.style.display = "block";
		app.renderer.autoResize = true;
		app.renderer.resize(screenW,screenH);
		
		document.body.appendChild(app.view);
		
		PIXI.loader
		  .add(['images/dude.png'])
		  .load(setup);
		
		function setup(){
			dude = new PIXI.Sprite(PIXI.loader.resources["images/dude.png"].texture);
			dude.position.set(20,20);
			dude.scale.set(.5,.5);
			app.stage.addChild(dude);
			state=play;
			app.ticker.add(delta => gameLoop(delta));
			window.setInterval(gameLogic,500);
		}
		
		function gameLogic(){
			if(dude.x > screenW){
				dude.x = -1 * dude.width;
			}
		}
		
		function gameLoop(delta){
		  //Update the current game state:
		  state(delta);
		}

		function play(delta) {
		  dude.x += 5;
		}

 

[themoonrat]

It's most likely because of your resolution property.

As an example, if the width and height of the window was 1280x720, but the devicePixelRatio returned 3, internally, pixi is now trying to render the screen at 4k resolution. Ouch! Don't use device pixel ratio is my advice for games

[Tee]

11 minutes ago, themoonrat said:

It's most likely because of your resolution property.

As an example, if the width and height of the window was 1280x720, but the devicePixelRatio returned 3, internally, pixi is now trying to render the screen at 4k resolution. Ouch! Don't use device pixel ratio is my advice for games

Thanks TMR. I should have mentioned that on my actual game I limit it to 2, and it's still choppy at 1. I could upload the APK if it would be helpful.

[themoonrat]

Ok, it might be because you're not adjusting the movent of the sprite by the delta

Take a look at the example http://pixijs.io/examples/#/basics/basic.js and notice how it multiplies movement by delta, to account for slight inaccuracies in timing of requestAnimationFrame.

Lastly, after that, if there are still issues... just host the page somewhere and access it via your browser. I make games to be accessed via the browser and the S7 runs like a dream. Maybe it's something to do with phone gap?

[Tee]

On 1/15/2018 at 11:39 PM, themoonrat said:

Ok, it might be because you're not adjusting the movent of the sprite by the delta

Take a look at the example http://pixijs.io/examples/#/basics/basic.js and notice how it multiplies movement by delta, to account for slight inaccuracies in timing of requestAnimationFrame.

Lastly, after that, if there are still issues... just host the page somewhere and access it via your browser. I make games to be accessed via the browser and the S7 runs like a dream. Maybe it's something to do with phone gap?

Good ideas - I'll try both and see what happens.

[Tee]

Alright, looks like it has something to do with the webview implementation through Phonegap, since running it on the Chrome app works great. It's weird, too, since my version of Android supposedly just taps Chrome's engine via webview directly, but I guess something's causing a feature change or who-knows-what along the way. It's good to have narrowed it down to at least that ... I was kind of losing my mind there for a minute.