Animation seems to be a bit rough even with a single circle on mobile devices.

First of all, I really like Crafty. It is super easy to learn and use. I have been playing with this library for some time now and even though everything works as expected there is a noticeable lag. Please take a look at this fiddle to see what I mean.

Am I unknowingly using the library sub-optimally? This is my complete animation code:

$(document).ready(function () {
        var gWidth = window.innerWidth;
        var gHeight = window.innerHeight;
        $("#game, canvas").css({width: gWidth, height: gHeight});

        Crafty.init(gWidth, gHeight, document.getElementById('game'));     

        var myCircle = Crafty.e("2D, Canvas, Color, Collision").attr({
            x: gWidth/2
            , y: gHeight/2
            , w: 0.04*gHeight
            , h: 0.04*gHeight
            , r: 0.02*gHeight
            , color: 'brown'
            , xDirection: 0.005*gWidth
            , yDirection: 0.005*gHeight
        }).bind("EnterFrame", function (eventData) {
            this.x += this.xDirection;
            this.y += this.yDirection;
            if (this.x < 0) this.xDirection *= -1;
            if (this.y < 0) this.yDirection *= -1;
            if (this.x > (0.96*gWidth)) this.xDirection *= -1;
            if (this.y > (0.96*gHeight)) this.yDirection *= -1;
        });     
    });`

The animation has a slight lag even on PC. Is there something that I can do about it?

[200sc]

I don’t see any frame rate drop on my android, but I’d generally avoid doing anything that required redefining a draw call or adding draw logic to the draw binding in crafty. Crafty is useful for games built on sprite animations, but it’s not particularly focused on performance from my experience. That said, I didn’t have any issues performance wise with crafty until I had to deal with drawing thousands of tiles.

[9itish]

After some testing, it seems like the lag appears only on android version 4.4 and below. So, it is not the library but the android webview which is at fault. 😃