How to find out the real size of the browser window in js in order to draw canvas without scrolls?

Question

JavaScript

If you set the padding to zero, as in the code below -

<style>
  * {padding: 0; margin: 0;}
</style>

var viewPort = {
  width: window.innerWidth,
  height: window.window.innerHeight
};

var canvas = document.createElement('canvas');
canvas.width = viewPort.width;
canvas.height = viewPort.height;
document.body.appendChild(canvas);

And then draw a canvas with dimensions, as in the code above, then vertical and horizontal scrolls appear. How to avoid it? How to find out the dimensions so that there are no indents and scrolls?

Answer 1

Try somehow using the new vh and vw units.
Unless, of course, you need old browsers.

Answer 2

This question has been raised on stackoverflow - - here