Invalid canvas calibration on load

I have a canvas web page that functionally works, but sometimes has the wrong dimensions at startup. Says that I declared the canvas html tag as follows:

<canvas id="main_canvas"></canvas>

And I included a javascript file that will take care of calibration using jquery

$(function() {
    var canvas = $('canvas')[0];

    var DISPLAY_WIDTH = window.innerWidth-10,
        DISPLAY_HEIGHT = 620,

Sometimes after loading the page, the canvas size is compressed in a very small area, and all objects processed from each other fit together, if I update, this problem no longer persists. I use the verification item tool and found that when there is a calibration problem I have html code

<canvas id="main_canvas" width="-10" height="620"></canvas>

- window.innerwidth , ​​ -10 . jQuery $(function(){}) , , window.innerwidth html. - , , .

, , ?