circle working horrible performance

by Nick Hulea

HTML

<canvas id="canvas1" style="z-index:1;"></canvas>

CSS

canvas {
    overflow:hidden;
    position:absolute;
    top:0;
    left:0;
}
html {
    width:100%;
    height:100%;
    overflow:hidden;
    position:absolute;
    top:0;
    left:0;
}

JavaScript

var can = document.getElementById("canvas1");
var ctx = can.getContext("2d");
can.width = window.innerWidth;
can.height = window.innerHeight;
w = window.innerWidth;
h = window.innerHeight;
var c1 = document.createElement('canvas');
c1.width = can.width;
c1.height = can.height;
var c = c1.getContext('2d');
document.body.appendChild(c1);
/* DEBOUCE NOT IN USE 
var debounce = function (func, threshold, execAsap) {
    var timeout;
    return function debounced() {
        var obj = this,
            args = arguments;

        function delayed() {
            if (!execAsap) func.apply(obj, args);
            timeout = null
        }
        if (timeout) clearTimeout(timeout);
        else if (execAsap) func.apply(obj, args);
        timeout = setTimeout(delayed, threshold || 100)
    }
};
*/
can.addEventListener("mousemove", function (e) {
    var mouse = {
        x: e.pageX,
        y: e.pageY
    };


    requestAnimationFrame(function () {
        redraw(mouse);

        //console.log(mouse);
    });
}, false);
var m = [];
var img = new Image();
img.onload = function () {




};
img.src = "http://placekitten.com/500/500";

function redraw(mouse) {
    ctx.save();
    ctx.beginPath();
    ctx.arc(mouse.x, mouse.y, 25, 0, Math.PI * 2, true);
    ctx.clip();

    ctx.drawImage(img, 0, 0);
    ctx.restore();

}
var mx = 0,
    my = 0;
window.addEventListener('mousemove', function (e) {
    mx = e.pageX;
    my = e.pageY;
});

function getMouse(e, canvas) {
    return {
        x: mx,
        y: my
    };
}
/*USING rAF NOW STILL NOT WORKING*/

if (!window.requestAnimationFrame) window.requestAnimationFrame = function () {
    return window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.oRequestAnimationFrame || window.msRequestAnimationFrame || function (callback, element) {
        window.setTimeout(callback, 1E3 / 60)
    }
}();