title: Html5 Canvas: Can I draw really sharp on non-retina devices like iPad2?
body: <p>I am currently working on a mobile web application making heavily use of the HTML5 <code>&lt;canvas&gt;</code>.
  I am drawing a lot of circles and texts on the canvas. </p>
  
  <p>I am doing the following to detect if I am currently drawing on a HD / Retina display:</p>
  
  <pre><code>// Retina Display ?             
  if (window.devicePixelRatio == 2) {
    canvas.style.width = canvas.width + "px";
    canvas.style.height = canvas.height + "px";
    canvas.width = canvas.width * 2;
    canvas.height = canvas.height * 2;
    context.scale(2, 2);
  }
  </code></pre>
  
  <p>If I am on Retina display, this will just draw twice as big and after scale it down which gives me really sharp circles and texts.</p>
  
  <p>But on a iPad2 for example the texts look a little pixel-ish and blurry, the corners are not really sharp and so on. But when I compare it with native iOS apps I see that the display can actually draw this sharp, because there the apps / texts / corners look really nice. I wonder if there are any tricks for canvas drawing that make it things look sharper or if there is a logical explanation that a canvas can not look as sharp as a native iOS application on a non-hd display...</p>
  
  <p>thanks!</p>