Coding Roboter alle Schritte voneinander trennen

[Samuel fiedler]

Hallo alle!

Ich habe einen kleinen Coding-Roboter gebaut. Soweit funktioniert alles schon gut, außer die Responsivität (der Hintergrund ist auf kleinen Screens einfach zu groß).

Der Coding-Roboter funktioniert recht einfach. Bisher hat er nur drei Befehle: nachVorne(), dreheLinks() und dreheRechts().
Ich habe das alles schön in einem Fiddle online gestellt.

Jetzt aber zu der eigentlichen Frage:
Wie kann ich die Schritte voneinander durch Zeit trennen?
Ich habe das Problem zu lösen versucht, indem ich in jede Funktion asynchron gemacht habe und dann await delay(1) geschrieben habe, wobei die delay-Funktion so aussieht:

function delay(n) {
  return new Promise(function (resolve) {
    setTimeout(resolve, n * 1000);
  });
}

Das Problem dabei ist, dass der Automat einmal ca. eine Sekunde wartet und dann alle Schritte hintereinander ausführt.

Ich freue mich auf Anregungen!

Bonjour,
Samuel Fiedler