Canvas text rendering (blurry)
<p>I know this question has been asked many times, but I tried pretty much everything I could find on the net and still can't get the text to render properly in canvas no matter what (and with whatever combinations) I tried.</p>

<p>For the blurry lines and shapes problem, simply adding +0.5px to the coordinates solved the problem : however, this solution doesn't seem to work for text rendering.</p>

<p>Note : I never use CSS to set canvas width and height (just tried it once to check if setting size properties in both HTML and CSS would change anything). Also problem doesn't seem to be browser-related.</p>

<p>I tried : </p>

<ul>
<li>creating canvas with HTML, then with javascript instead of html</li>
<li>setting width and height in HTML element, then with JS, then with both HTML and JS</li>
<li>add 0.5px to text coordinates with every possible combination</li>
<li>changing font-family and font-size</li>
<li>changing font-size unit (px, pt, em)</li>
<li>opening file with different browsers to check if anything changes</li>
<li>disabling alpha channel using <code>canvas.getContext('2d', {alpha:false})</code> which just made most of my layers disapear without solving the problem</li>
</ul>

<p>See comparison between canvas and html font rendering here : <a href="https://jsfiddle.net/balleronde/1e9a5xbf/" rel="noreferrer">https://jsfiddle.net/balleronde/1e9a5xbf/</a></p>

<p>Is it even possible to get the text in canvas to render like text in dom element ? Any advice or suggestion would be greatly appreciated</p>