Skip to content

Wollok Game

Manuel Nuñez edited this page May 28, 2024 · 1 revision

Introducción

Acerca de wollok game

[TODO]

Acerca de wollok game en wollok-ts

A diferencia de la versión eclipse de wollok, la cual ejecuta un juego en una ventana independiente, en wollok-ts la interfaz de juegos es un navegador web:

  • El "motor" del juego reside en el backend

  • El rol del frontend es recibir las actualizaciones del frontend y dibujarlas en pantalla

    2024-05-26T14:23:33,000000000-03:00

Diseccionando wollok game

Untitled Diagram

Frontend

Es la interfaz html de wollok game

load

En este momento se carga la pagina, los scripts y se realiza la conexion con el backend

preload()

este metodo prepara todos los eventos que va a recibir del backend y luego emite un "ready" al backend

loadBackground()

Recibe la imagen de fondo y la dibuja

loadAllImages()

Recibe todas las imagenes que se utilizaran en el juego

wollok-ts-cli

Es el "backend" del juego

eventsFor()

Es el punto de entrada de las conexiones a wollok game desde el frontend

envío de assets

Envia las imagenes y datos iniciales del tablero al frontend

bucle flushEvents

Es un bucle setInterval que ejecuta cada 100ms, enviando el comando flushEvent al intérprete wollok

Notas:

  • al ejecutarse cada 100ms implica que el juego puede correr a un máximo de 10fps
  • este tiempo podría bajarse hasta 17ms (60fps), siempre y cuando la ejecución del flushEvent demore menos del tiempo establecido (17ms), de lo contrario el juego en general se ve afectado

draw.drawer

Este closure se ejecuta mediante un evento onTick especial llamado renderizar. Este blóque de código typescript se encarga de obtener y enviar al frontend los visuales y los sonidos del juego

getVisuals()

Obtiene y procesa los visuales del juego antes de enviarlos al frontend

Intérprete wollok

flushEvent(time)

Nota: este método está definido dentro de wollok, si se transforma en "nativo" podría lograrse una mejora en la performance del juego

Método wollok que se encarga de procesar las siguientes colas de eventos:

eventQueue

eventQueue es la lista de eventos encolados con queueEvent, por ejemplo, eventos de teclado

timeHandlers

todos los eventos de tiempo programados para el tiempo time

get("visuals")

recorre y obtiene todos los visuales presentes en el juego. Algunos de los métodos llamados por este código es "nativo" (typescrypt) y otros son métodos de wollok

Performance

A medida que la cantidad de elementos visuales, colliders y eventos onTick aumentan, el juego puede volverse lento. Con algunas mejoras realizadas en el bucle flushEvents y en get("visuals") se logró mejorar la performance del juego y llevarlo de unos 3fps a 10fps para un juego con varias decenas de elementos visuales.