# Hacer que el movimiento dependa del tiempo, no del número de fotogramas

> Aplique el tiempo transcurrido al movimiento del juego, elija una política de recuperación segura y pruebe el movimiento con diferentes frecuencias de actualización y después de las paradas.

- URL: https://oneshotgems.ai/es/topics/delta-time-in-games
- Categoría: Para desarrolladores de juegos
- Tipo: Guía
- Actualizado: 5 de octubre de 2026

Delta time es el tiempo transcurrido entre actualizaciones. Al multiplicar la velocidad por los segundos transcurridos, un objeto puede recorrer una distancia similar en un segundo, tanto si el navegador dibuja 45 fotogramas como si dibuja 144. Lo difícil es decidir qué hacer cuando ese intervalo se vuelve inusualmente largo. Si una pestaña quedó suspendida o una tarea costosa bloqueó el hilo principal, aplicar de golpe todo el intervalo puede causar un salto matemáticamente coherente, pero desagradable al jugar.

## Mantener las unidades visibles en el código

Elige una unidad de tiempo y úsala de forma coherente. Si la velocidad se expresa en píxeles por segundo y delta en segundos, la posición avanza según velocidad × delta. Una prueba manual útil consiste en mover durante diez segundos un marcador configurado a 80 píxeles por segundo: debería recorrer unos 800 píxeles del mundo, sin importar cuántas veces se haya dibujado.

No mezcles los milisegundos de performance.now() con una velocidad por segundo sin dividir por 1.000. Incluye las unidades en los nombres, como deltaSeconds o speedPixelsPerSecond, para que un ajuste posterior no convierta silenciosamente un movimiento pequeño en uno mil veces mayor.

## Limitar el efecto de una pausa larga

En un juego de acción sencillo, limita delta a un máximo elegido deliberadamente y acepta que la simulación se ralentice brevemente bajo una carga intensa. Para una simulación física que requiera pasos repetibles, acumula el tiempo y avanza en incrementos fijos; limita la cantidad de actualizaciones para recuperar el tiempo y evitar que la recuperación monopolice la página. Cada enfoque tiene sus ventajas y costes: elige según la sensación y las reglas que necesita tu juego.

Prueba con una pausa artificial entre actualizaciones y compara un movimiento en línea recta con una colisión al final del recorrido. Si el objeto atraviesa un obstáculo delgado, quizá necesites subpasos más pequeños o una prueba de colisión barrida; cambiar solo la frecuencia de dibujo no resolverá ese problema de las reglas.

## Preguntas

**¿El tiempo delta hace que la física sea determinista?** No. Los intervalos de actualización variables aún pueden producir resultados de integración diferentes. Un paso de simulación fijo mejora la repetibilidad, aunque la sincronización de entrada y los detalles de punto flotante siguen siendo importantes.

**¿Qué reloj debería proporcionar el tiempo transcurrido?** Usa la marca de tiempo del callback de animación o performance.now(); MDN describe ambas como fuentes de tiempo de alta resolución. No uses fechas del reloj civil para intervalos cortos entre fotogramas, porque los ajustes del reloj del sistema no guardan relación con el tiempo de simulación.

## Sigue tu curiosidad

- [Cree un bucle de juego de navegador confiable](https://oneshotgems.ai/es/topics/browser-game-loop): Estructura las actualizaciones de juegos de navegador y dibuja cuadros de animación sin vincular la velocidad de simulación a la frecuencia de actualización de la pantalla del jugador.
- [Elegir comprobaciones de colisión para un juego pequeño](https://oneshotgems.ai/es/topics/game-collision-detection): Elija una representación de colisión que se adapte a su juego, reduzca las comprobaciones de pares innecesarias y diagnostique objetos que atraviesen obstáculos.
- [Utilice un paso de tiempo fijo para la física del juego](https://oneshotgems.ai/es/topics/fixed-timestep-game-physics): Separe las actualizaciones físicas del renderizado con un paso de simulación fijo, trabajo de recuperación limitado y pruebas de pérdida y colisión.

## Más información

- [MDN: temporización de requestAnimationFrame()](https://developer.mozilla.org/en-US/docs/Web/API/Window/requestAnimationFrame)
- [MDN: Performance.now()](https://developer.mozilla.org/en-US/docs/Web/API/Performance/now)

---
Página canónica: https://oneshotgems.ai/es/topics/delta-time-in-games