How can I fix this pixelate bugs with canvas NodeJS problems?

I have developed a game in NodeJS where you have to guess an image's name meanwhile the image depixelates.

The problem is that the server uses canvas to pixelate the image but the render don't fit entirely in the frame as you can see :

The pixelate function :

function pixelate(image, ctx, canvas, value) {
  var size = value / 100,
    w = canvas.width * size,
    h = canvas.height * size;

  ctx.drawImage(image, 0, 0, w, h);

  ctx.msImageSmoothingEnabled = false;
  ctx.mozImageSmoothingEnabled = false;
  ctx.webkitImageSmoothingEnabled = false;
  ctx.imageSmoothingEnabled = false;

  ctx.drawImage(canvas, 0, 0, w, h, 0, 0, canvas.width, canvas.height)
}

And the loop were i pixelate the image :

function image_pixel(bool = 1) {
  if (bool) {
    if (pixel_state > 24) {
      restartGame("", false);
    } else {
      loadImage('image.jpg').then((image) => {
        pixel_state += 0.1;
        var canvas = createCanvas(image.width, image.height);
        var ctx = canvas.getContext('2d');
        pixelate(image, ctx, canvas, pixel_state);
        io.emit('image', canvas.toDataURL());
      })
    }
  } else { // Image without pixelisation
    loadImage('image.jpg').then((image) => {
      var canvas = createCanvas(image.width, image.height);
      var ctx = canvas.getContext('2d');
      ctx.drawImage(image, 0, 0);
      io.emit('image', canvas.toDataURL());
    })
  }
};

I tried to round the "w" and "h", the image will fill entirely in frame but some of the images sent will be the same so it'll feel laggy for the user.

Finally found something, I resized all of my pictures to square aspect ratio and then for the "pixel_state" if it's like 100/(2^x) i won't have any ghost pixels almost anymore.