canvas - How can I smooth out my JavaScript animations? -

After

I started with the code at the following address:

I updated thus, to use requestAnimFrame:

  window.requestAnimFrame = (function () {return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || function (callback) {window .setTimeout (callback, 1000/60);};}) ();   
 The demo is available here:  
  
 Moving under chrome, in my eyes the animation still looks a little blurry at high speeds. What can I do further optimize?   
  itemprop = "text"> 
      
 good animation, you are very close :)  
 a few things first, when you are living, you so you usually want to take small steps are Animeting, it is not choppy . Second, make sure that when animating in small steps, you do it at a high frequency (you have covered that part). Third, when detecting an object and collision animate an issue, make sure that you limit the size of your object offset  
 My demo first and third note has been changed to make  
 Applications ..  var dx = 4; Var dye = 4;   
 and  
  if (x & lt; 20 || x & gt; 280) dx = -dx; If (y of & lt; 20 || y & gt; 280)   
 I also, for example, made more clear demarcation box    .