¿Cuál es la pila tecnológica de este juego?

A primera vista, es un juego simple que tiene un T-Rex oculto con un salto de 8 bits sobre las vallas para ganar puntos. Es interminable porque los niveles son generados dinámicamente por el JavaScript que lo ejecuta. El proyecto Chromium lanza el código y puede verificarlo simplemente haciendo clic en la fuente de vista de la página.

Aquí puedes encontrar el código detrás de este increíble juego

Entonces, el método de actualización en realidad se llama a sí mismo recursivamente de una manera indirecta.

Al final de la actualización tienes estas declaraciones

if (! this.crashed) {
this.tRex.update (deltaTime);
this.raq ();
}

La magia ocurre con el método raq. Es lo que llama al método de actualización nuevamente. requestAnimationFrame es un método de navegador que solicita una reanimación de la pantalla con la devolución de llamada antes de que se complete la animación. Por lo tanto, el método de actualización se llama nuevamente, lo que le permite llamar nuevamente a raq, que llama a actualizar nuevamente, etc.

raq: function () {
if (! this.drawPending) {
this.drawPending = true;
this.raqId = requestAnimationFrame (this.update.bind (this));
}
},

Para referencia: https://developer.mozilla.org/en…

Sobre cómo se inicia realmente la aplicación, creo que tiene que ver con las anotaciones y el compilador de cierre. La anotación @export en Runner significa que la función Self Invoker crea una instancia de la misma.

Luego, el constructor llama a loadImages, que llama a init, que llama a actualización.

Eso es

diviértete sin conexión 🙂

Es JavaScript con Canvas lo que lo está haciendo funcionar.

Pensé que HTML y CSS lo soportan y Canvas está usando sprites de imágenes para crear construcciones de juegos como T-rex, cactus, tracto, nubes, etc.

Haga clic derecho en el juego y haga clic en “Inspeccionar elemento” y verá todo.

(Fuente: captura de pantalla de Chrome no conectado a internet)

Y si mira un poco más arriba en el script y las etiquetas de estilo en la sección Head de la página, lo tiene todo. Todas las imágenes, CSS y JS están ahí.

Y como wayou / t-rex-runner; puedes guardarlo y personalizarlo para llenar tu personaje favorito.

Es un juego muy famoso T-rex runner. El dinosaurio en cuestión es un Tyrannosaurus Rex, que ha sido un meme debido a sus brazos cortos. 😛
El dinosaurio en Chrome significa que el navegador no puede “comunicarse” con los sitios web (debido a su estado fuera de línea)

Además, Google tiene un T-Rex personal llamado Stan en su sede de California.

Por lo que yo entiendo, T-rex runner está completamente escrito en Javascript. Consulte este repositorio para obtener más detalles -> wayou / t-rex-runner

Este juego T-Rex está escrito en JavaScript. El código fuente del juego está disponible en línea en GitHub publicado por wayou (Wayou Liu). Se encuentra aquí en: wayou / t-rex-runner. Utiliza una hoja de sprite png para los elementos del juego (dinosaurios, cactus, pájaros). Los controles y la lógica del juego están escritos en JavaScript.

También puede encontrar el código fuente completo en el repositorio de Chromium. Espero que esto ayude.