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.
- Cómo optimizar aún más la entrega de un único archivo CSS minificado
- ¿El ranking de Alexa es significativo para los sitios web en China?
- JavaScript (lenguaje de programación): ¿Declarar una variable como "nulo" es lo mismo que declarar la variable indefinida?
- ¿Cuáles son los errores más comunes al codificar con lenguajes asincrónicos?
- ¿Cómo funciona el desarrollo de WordPress?
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 🙂