Canvas mousemove пропуск пикселей

<script>
 
/*function changes() {
        sw = window.innerWidth;     
        sh = window.innerHeight; 
        canvas.width = sw; // задаём размеры холста
        canvas.height = sh;
        }*/
        sw = window.innerWidth;     
        sh = window.innerHeight; 
         var canvas = document.getElementById("games");
        canvas.width = sw; // задаём размеры холста
        canvas.height = sh;
    var context = canvas.getContext("2d");
        context.fillStyle = "#222"; // цвет "заливки"
        context.fillRect(0, 0, canvas.width, canvas.height); // закрашиваем холст        
 
        
        $( "#games" ).mousemove(function( event ) {
    mx = event.clientX;
    my = event.clientY;
        
        context.fillStyle = "#FFF"; // цвет "заливки"
      context.fillRect(mx, my, 5, 5); // закрашиваем холст        
      context.refresh();
});
        
    
        </script>

mxn = 0;
 myn = 0;
        
        $( "#games" ).mousemove(function( event ) {
    mx = event.clientX;
    
    my = event.clientY;
        
        context.fillStyle = "#FFF"; // цвет "заливки"
 //     context.fillRect(mx, my, 5, 5); // закрашиваем холст        
      context.beginPath();
       context.fill(); // *1
    context.moveTo(mxn, myn);
    context.lineTo(mx, my);
     context.stroke();
     mxn = mx;
     myn = my;
      context.refresh();
});
        
    
        </script>