با استفاده از JavaScript و HTML5 canvas یک دایره بسازید که از چپ به راست حرکت کند و وقتی به انتها رسید دوباره از ابتدا شروع شود.

در این تمرین از عنصر canvas و تابع requestAnimationFrame برای ایجاد حلقهٔ انیمیشن استفاده کنید؛ در هر فریم با clearRect صفحه را پاک کرده، مقدار x دایره را با سرعت مشخصی افزایش دهید و اگر x از عرض canvas بزرگتر شد آن را به مقدار اولیه بازنشانی کنید. می‌توانید از delta time برای یکنواخت کردن سرعت بین دستگاه‌ها و از event listener برای شروع/توقف انیمیشن بهره ببرید؛ این کار با دانش پایهٔ JavaScript، متدهای Canvas و requestAnimationFrame قابل انجام است.