FPS drops in Canvas

This is my first post in stackoverflow. I am a newbie in this, but I have decided to make a game, which generates some random pillars in every 2 seconds. The game is not complete, I am facing FPS drops from 60 FPS to ~7 FPS in about 10 - 15 seconds.

My Javascript is included below:

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var SCALE = 2;
var CONST_DIMENTION_SIZE = 25;
var HEIGHT = 9*SCALE*CONST_DIMENTION_SIZE;
var WIDTH = 16*SCALE*CONST_DIMENTION_SIZE;
var PILLAR_FREQUENCY = 2000; //in milli-seconds, it will reduce as level increases

var pillar = new Array(); //pillar object array
var tempTime = new Date().getTime();
var player = new Player();

canvas.width = WIDTH;
canvas.height = HEIGHT;

main();

//Rendering Methods//
function init(){}
function render(){
    var i;    
    console.log("FPS: " + 1000/((new Date().getTime()) - tempTime));        
    if((new Date().getTime()) - tempTime >= PILLAR_FREQUENCY){
        pillar.push(new Pillar());
        tempTime = new Date().getTime();
    }    
    for(i=0;i<pillar.length;i++){
        pillar[i].x--;
        if(pillar[i].x <= -pillar[i].width)
            pillar.shift();     //remove the pillar if the pillar is outide the vision of the screen

    }
    refresh();        
    window.requestAnimationFrame(render);

}
function refresh(){    
    ctx.fillStyle = "white";
    ctx.fillRect(0,0,canvas.width,canvas.height);    
    for(var i=0;i<pillar.length;i++)        
        pillar[i].draw();   //drawing all the pillars
    player.draw();
}
//.Rendering Methods//

//objects//
function Pillar(){    
    this.height = Math.floor(Math.random()*(canvas.height-(canvas.height*0.1))+70);
    this.width = 50;
    this.x = WIDTH;
    this.y = new Array();
    this.y[0] = 0;
    this.y[1] = HEIGHT - this.height;
    this.color = "#3f3f3f";
    this.shadowColor = "#696969";
    this.shadowOffset = 3;
    this.selectedY = Math.round(Math.random()*1);
    this.draw = function(){                
        ctx.fillStyle = this.shadowColor;
        ctx.fillRect(this.x + this.shadowOffset,this.y[this.selectedY],this.width,this.height - this.shadowOffset);        
        ctx.fillStyle = this.color;
        ctx.fillRect(this.x,this.y[this.selectedY],this.width,this.height);                
    }
}
function Player(){
    this.x = WIDTH*0.5;
    this.y = HEIGHT*0.5;
    this.radius = 20;
    this.color = "#dd3c13";
    this.draw = function(){               
        ctx.fillStyle = this.color;
        ctx.arc(this.x,this.y,this.radius,0,2*Math.PI*this.radius,false);        
        ctx.fill();
        console.log("Circle Drawn");
    }
    this.moveUp = function(){
        this.x--;
    }
    this.moveDown = function(){
        this.x++;
    }
}
//.objects//

//Main Function//
function main(){    
    var animFrameID;
    ctx.fillStyle = "white";
    ctx.fillRect(0,0,canvas.width,canvas.height);
    pillar.push(new Pillar());
//    ctx.fillStyle = "#696969";
//    ctx.fillRect(0+5,0,30,60 -5);        
//    ctx.fillStyle = "#3f3f3f";
//    ctx.fillRect(0,0,30,60);        
    animFrameID = window.requestAnimationFrame(render);    
}

My full source codes can be seen at: http://ift.tt/1LgdiTl Any help is greatly appreciated specially regarding the performance.

Thanks, Tathagata