EaselJS - performance problems

Question

I'm implementing a simple racing game with easelJS library. This is my 1st experience with it, so I might be doing something wrong. Moving of my sprite is not smooth despite 60fps and createjs.Ticker.timingMode = createjs.Ticker.RAF;

Let me paste some part of my code. game.js

function init() {
  keys = new Keys();

  canvas = document.getElementById('canvas');
  stage = new createjs.Stage(canvas);
  stage.mouseEventsEnabled = true;
  stage.mouseMoveOutside = false;

  // Maximise the canvas
  canvas.width = CANVAS_WIDTH;
  canvas.height = CANVAS_HEIGHT;

  localPlayer = new Bike();
  localPlayer.init();

  setEventHandlers();
}

function setEventHandlers() {
  window.addEventListener("keydown", onKeydown, false);
  window.addEventListener("keyup", onKeyup, false);
  createjs.Ticker.addEventListener("tick", tick);
  createjs.Ticker.timingMode = createjs.Ticker.RAF;
}

function tick() {
  if (localPlayer.getSprite()) localPlayer.update();
  stage.update();
}

Keys is just a class which handle arrow up press up and down. Bike is an motorbike class responsible for updating and drawing the spritesheet.

bike.js

...

  function init() {
    img.onload = handleImageLoad;
    img.src = '/img/bikeSprite.png';
  }

  function handleImageLoad() {
    var spriteSheet = new createjs.SpriteSheet({
      // image to use
      images: [img],
      // width, height & registration point of each sprite
      frames: {
        width: 42,
        height: 42,
        regX: 21,
        regY: 21
      }
    });

    sprite = new createjs.Sprite(spriteSheet);
    sprite.regX = sprite.spriteSheet.frameWidth / 2 | 0;
    sprite.regY = sprite.spriteSheet.frameHeight / 2 | 0;
    sprite.gotoAndStop(BIKE_START_FRAME);

    sprite.x = (CANVAS_WIDTH / 2) - 20;
    sprite.y = (CANVAS_HEIGHT / 2) + (GRASS_HEIGHT / 2) + 50;
    stage.addChild(sprite);
  }

and then my main update method:

function update() {
    clutch = keys.action ? true : false;

    // Thrust can happen only if clutch is not present.
    thrust = (!clutch && keys.up) ? true : false;

    // Turning
    if (keys.left) angleVel = -TURN_ANGLE;
    if (keys.right) angleVel = TURN_ANGLE;

    if (!keys.left && !keys.right) angleVel = 0;

    // Custom animation
    if (sprite && (!keys.left || !keys.right)) sprite.stop();

    velXY[0] *= (1 - friction);
    velXY[1] *= (1 - friction);

    angle += angleVel;

    if (angle >= MAX_ANGLE || angle <= -MAX_ANGLE) {
      angle = 0;
    }

    forward = angleToVector(angle);

    if (thrust) {
      if (angleVel === 0) {
        velXY[0] += forward[0] * SPEED * ACC * clutchFactor;
        velXY[1] += forward[1] * SPEED * ACC * clutchFactor;
      } else {
        velXY[0] += forward[0] * SPEED;
        velXY[1] += forward[1] * SPEED;
      }
    }

    if(keys.up && clutch) {
      if (clutchFactor < MAX_CLUTCH) {
        clutchFactor += 0.1;
      }
    } else {
      if (clutchFactor > MIN_CLUTCH) {
        clutchFactor -= 0.1;
      }
    }

    sprite.x += velXY[0];
    sprite.y += velXY[1];

    velocity = Math.sqrt((velXY[0] * velXY[0]) + (velXY[1] * velXY[1]));
    velocity = parseFloat(velocity).toFixed(2);

    if (sprite.x > canvas.width) {
      sprite.x = sprite.x % canvas.width;
    } else if (sprite.x < 0) {
      sprite.x = canvas.width + (sprite.x % canvas.width);
    }

    if (sprite.y > canvas.height) {
      sprite.y = sprite.y % canvas.height;
    } else if (sprite.y < 0) {
      sprite.y = canvas.height + (sprite.y % canvas.height);
    }

    if (keys.left) {
      if (leftOffset >= TURN_OFFSET) {
        leftOffset = 0;
        sprite.reverse();
      } else {
        leftOffset++;
      }
    }

    if (keys.right) {
      if (rightOffset >= TURN_OFFSET) {
        rightOffset = 0;
        sprite.forward();
      } else {
        rightOffset++;
      }
    }
  }

These are my globals:

var canvas
  , stage
  , keys
  , track
  , localPlayer = {};

I also have custom methods reverse and forward:

createjs.Sprite.prototype.reverse = function() {
    var currentFrame = this._currentFrame
        , numFrames = this.spriteSheet.getNumFrames(this.currentAnimation);

    if (currentFrame <= 0) {
        currentFrame = numFrames - 1;
    } else {
        currentFrame--;
    }

    this.gotoAndStop(currentFrame);
};

createjs.Sprite.prototype.forward = function() {
    var currentFrame = this._currentFrame
        , numFrames = this.spriteSheet.getNumFrames(this.currentAnimation);

    if (currentFrame >= numFrames) {
        currentFrame = 0;
    } else {
        currentFrame++;
    }

    this.gotoAndStop(currentFrame);
};

My current app can be tested here: https://speedwayjs.herokuapp.com/ As you can see its not super smooth.