JS tween how to improve?

Question

Im trying to make a simple expo tween, it works, but its a bit jittery and FF seems to hang a bit. What can I do to improve it?

var distance = (target - x) * dir;

x += (distance / 5) * dir;

if (dir == 1 && x >= target-1) {
    return;
    }

if (dir == -1 && x <= target+1) {
     return;
    }

Jevon

Answer 1

You'll probably find your answer and more looking at the source of tween.js

All tween curves visualized: http://sole.github.com/tween.js/examples/03_graphs.html

Alonzoaloof

Answer 2

Javascript arithmetic is fast enough for all browsers. Try reducing the amount of DOM nodes you update per iteration.

Mustee

only dom element is a canvas, admittedly its got a lot of pixel pushing to do... but it does work ok - until I add the above – Jevon

Answer 3

I'm not quite sure what you're looking for, but this maybe?

x += (target - x)*dir*dir/5;

if (Math.abs(dir) == 1 && dir*(x-target) <= 1)
    return;

Swingletree