Blog de la materia Programación III

Como una propuesta dentro del curso que doy en UTN. Los alumnos han comenzado un blog donde irán publicando diferentes trabajos y tareas.

Para ver el blog: http://prog3news.wordpress.com/


Lista de video juegos

Hace tiempo que vengo creando diferentes video juegos. Bastánte simples debo reconocer, pero algunos han sido muy interesantes y atrapantes.

Por lo tanto, he creado una sección en el blog donde colocaré todos los juegos que vaya creando para que puedan ser jugados online, y así no tengan que navegar por los post para poder verlos.

Si quieres jugar a estos juegos: https://miacono.wordpress.com/juegos-creados/


Optimización de código–Parte II

Continuando con el post anterior, vamos a ver un par de soluciones. Por supuesto, estas aplican principalmente a JavaScript y su forma de trabajo. Tal vez, otros lenguajes requieran de otro acercamiento, lo que nos lleva una cuestión crucial: Necesitamos saber cómo usar el lenguaje.

Si lo anterior no lo tenemos, o sea, si no conocemos el lenguaje que usamos, es posible que estemos haciendo código para resolver tareas cuando ya existe una solución para ese caso.

Un ejemplo muy simple puede ser lo siguiente:

var r;
var a = 10;
var b = 11;
if (a < b) {
   r = a;
} else {
   r = b;
}
console.log(“El número menor es: “ + r);

El código anterior puede ser reducido muy fácilmente:

var a = 10;
var b = 11;
var r = Math.min(a, b);
console.log(“El número menor es: “ + r);

Lo importante es entender que no reducimos código quitando variables o quitando líneas en blanco. El código se reduce bajando la cantidad de ciclos o procesos de análisis que se tienen que hacer para ejecutar determinada tarea. Y si bien remover variables u objetos no utilizados ayuda y siempre que podamos deberemos hacerlo, hablamos principalmente de que tan óptimo es nuestro código.

Pero retomemos el desafío original. Algunas de las propuestas que me llegaron se centraron en la reducción de variables, y la ejecución de código en una sola línea. Esto es, ahorrar la asignación de datos de una variable a la otra. Esto claramente aumenta la performance de nuestro código. Evitar el ida y vuelta a la memoria, el boxing y unboxing (Si fuese aplicable), mejorará el funcionamiento.

Un ejemplo:

this.doTask = function (v) {
    return (stack.pop())(v);
};

En este caso, al momento de quitar un elemento de la pila, en vez de asignarlo a una variable y luego ejecutar la función, se hace todo en un solo paso (Quitar, ejecutar, retornar resultado de ejecución).

Nos ahorramos una variable, un par de asignaciones (Idas y vueltas). Una mejora interesante.

Pero aún podemos compactar más el código. Veamos otro ejemplo:

function worker2() {
    var self = this;
    var stack = [];
    this.addToStack = function (f) {
        stack.push(f);
    };
    this.canUnStack = function () {
        return (self.doTask = stack.pop());
    };   
    this.doTask = function () {    };
}

Como decía antes, puede que solo sea aplicable a JavaScript o lenguajes similares, de cualquier manera, vemos que este código elimina absolutamente el código de la función doTask, e incluso compacta (Brutalmente) el código de canUnStack.

Ahora canUnStack se encarga de quitar elementos de la pila de funciones y modificar la referencia devuelta a la función doTask. Con esto, el programador estaría ejecutando la función específica cada vez que llama a doTask, y no ejecutando un proceso intermedio de selección. También, la asignación, quitado de la pila y verificación de si puede o no quitar elementos de la misma, se hace en un solo paso dentro de canUnStack.

Para comprobar que efectivamente hubo una mejora, usé JsLitmus a modo de prueba. Donde el primer test prueba el código optimizado, y el segundo prueba el código sin optimizar.

Untitled

Si bien JsLitmus tiene sus cosas y podemos dudar un poco de los resultados, la diferencia en operaciones realizadas por segundo es abrumadora.

En resumen: Optimizar el código siempre será una buena práctica. Conocer el lenguaje que utilizan, otra.


Optimización de código

Uno de los temas principales que siempre abordo cuando doy clases de desarrollo de software, es el de forzarnos a nosotros, como programadores, a buscar la forma más óptima de crear código.

Y si bien esto aplica a todas las áreas de desarrollo, en el caso de video juegos es crucial. De hecho, es tan crucial que unas líneas equivocadas pueden hacer que perdamos 1 o 2 FPs, algo que podría ser usado para colocar más objetos en pantalla, mejores texturas o simplemente tener animaciones más fluidas.

Pero, como decía, si bien en video juegos se puede ver fácilmente la diferencia, no es excluyente de ellos. Un código compacto, depurado, limpio, puede también hacer que su tamaño decrezca.

Así es como llegamos a un ejemplo que, entre conceptos de TDD y algo de programación intermedia en JavaScript, necesitamos resolver.

var w = new worker();
w.addToStack(function () { return 10; });
w.addToStack(function (val) { return val; });
w.addToStack(function (val) { return val – 10; });

var counter = 20;

while (w.canUnStack()) {   
    var result = w.doTask(counter);
    counter = result;
   
    if (result !== 10) {
        console.log(‘Test fail’);
        break;
    }
}

El código anterior representa un hipotético caso de pruebas para un objeto que deberemos crear. La tarea es simple: Crear la “clase” worker.

No es difícil darse a la tarea de su construcción. Una primera versión podría ser similar a la siguiente:

function worker() {
    var self = this;
    var stack = [];

    this.addToStack = function (f) {
        stack.push(f);
    };

    this.canUnStack = function () {
        return stack.length > 0;
    };
   
    this.doTask = function (v) {
        var f = stack.pop();
        return f(v);
    };
}

Como vemos, algunas funciones y poco código. Pero la pregunta que debemos hacernos es si este código es realmente óptimo. Por lo que la siguiente tarea será intentar reducir más aún el mismo, no solo por cuestiones de ahorrarnos líneas, si no, con el objetivo de hacerlo más óptimo.

En el siguiente post mostraré una posible solución, y las diferencias de velocidad entre este código y su versión optimizada.

Si aceptas el desafío, deja tus respuestas en los comentarios.


Un nuevo juego creado con jsGFwk

1

Ya que estoy de vacaciones (Y un poco aburrido), opté por crear un nuevo video juego.

Quería hacer algo que me recordara la vieja y querida ZX Spectrum, y así es como Valour Knight salió a la luz.

Por supuesto, fue creado usando jsGFwk lo que sirvió, también, para arreglar varios bugs y para agregarle nuevas características.

Como en otros post, si quieres descargarte el framework con todos los juegos y demos: https://github.com/MatiasIac/jsGFwk

Para ver el código de Valour Knight: https://github.com/MatiasIac/jsGFwk/tree/master/SampleGames/ValourKnight

Si quieres jugarlo online: http://gamejolt.com/games/arcade/valour-knight/23897/

Mi record es de 5. Alguien se anima a ganarme?


jsGFwk–Como desarrollar video juegos

Así como había estado escribiendo una serie de artículos sobre desarrollo de video juegos con HTML5 y JavaScript, ahora he iniciado otra serie pero usando jsGFwk.

Estos artículos serán publicados en el blog de la empresa donde trabajo.

El primero de ellos puede leerse aquí: http://blogs.kinetica-solutions.com/blog/2014/02/28/desarrollo-de-videojuegos-con-html5parte-9/


Adventurer English version online

Something that many of the players request from me and the game, was the possibility to have it on English.

Since the game was made in 48 hours, in a Game Jam from South America (Spanish), I hadn’t the chance to translate it to English.

Well, here we are, with the English version. If you want to try it: Adventurer English Version
All comments and recommendations will be really appreciated.