How to make image move smooth?
YuriyLaschuk

I am trying to make quick tests of wade capabilities, the main one being how smooth sprites can be moved around, here is the code i picked from the snippets and changed a bit:

  // create a sprite
        var sprite = new Sprite('balls.jpg');

        // create a scene object with that sprite
        var logo = new SceneObject(sprite);

        // add the object to the scene
        wade.addSceneObject(logo);

        // move the object
        logo.moveTo(400, 300, 400);

        // when it's finished moving, rotate it
        logo.onMoveComplete = function()
        {
            logo.moveTo(-400, -300, 400);// rotation is in radians
         logo.onMoveComplete = function()
        {
            logo.moveTo(400, 300, 400);// rotation is in radians
        };
        
        };
        });

 

putting aside that I do not know how to code two movements synchronously so I ended with such such ugly hack i am really conserned with productivity issue, the movement lags terribly:

https://www.dropbox.com/s/9x45ruv0gkwk01y/ice_video_20160613-170127.webm?dl=0

Could you explain me why is that and how to use best practices for smooth mevment of images. I am running it on the laptop core i5 3337 GeForce 720m so could it be that webgl just needs more powerfull hardware to run smoothly?

1 Comment
Gio

Hi

It's difficult to tell from the video, because often things are slower while you're capturing a video. How did you determine that it was lagging, do you know how many fps you were getting? You can enable an fps counter from the Chrome debug console as explained here.

Your hardware is good enough and things should be pretty smooth with only one image moving around. 

Also please make sure you measure your performance after exporting the project, not directly in the editor (there are lots of things going on in the editor, so the preview is normally much slower than an exported game).

Post a reply
Add Attachment
Submit Reply
Login to Reply