Как замедлить скорость, с которой a для l oop выполняется в Javascript

Question

Я играю в игру Javascript, и в этом случае нижеприведенный метод должен посылать красный блок, скользящий по экрану, в указанную координату x. Проблема в том, что код выполняется быстро, поэтому вместо плавного перемещения по экрану он просто появляется там. Я пытался использовать функцию setTimeout безрезультатно, но не может замедлить движение. Я старался использовать как можно меньше кода для упрощения, но если вам нужно больше, пожалуйста, дайте мне знать.

    blob.prototype.glide = function(xf){
      for(let i = this.x; i<=xf; i++){
         fillCanvas("grey");
         this.x++;
         this.render(); //generates a red square on the map
      }  
    }

Ссылка на сайт, хотя я сомневаюсь, что она вам очень поможет, это https://worried-sleet-blue.glitch.me/. Спасибо.