Consumo de juego HTML5

[gilber966]

hola ojala me puedas ayudar estoy haciendo un juego con canvas y veras no se como interpretar esta imagen que me da google crhome acerca de los recursos que consume el juego si es eso claro esta, te comparto la imagen.



lo raro es que todos los archivos de mi juego pesan apenas 178 kb, que significa lo anterios, por que sube a 15 o 16 mb, aun cuando NO estoy haciendo nada en el juego, las caidas q sigifica?

[ryugen]

Cuando de dibujar, animar y performance en un canvas se trata, lo primero a revisar es requestAnimationFrame (acá un muy buen recurso: http://www.paulirish.com/2011/reques...art-animating/ ).

De que se trata requestAnimationFrame? El ojo humano distingue una imagen 60 a 70 veces en un segundo. Entonces para que redibujar un canvas, más veces de lo que el ojo humano sería capaz de ver. Este es el primer paso para optimizar la performance en un juego.

A partir de aquí si los problemas continua habría que hilar fino sobre el código

[Carlangueitor]

No tiene nada que ver el peso de tus archivos con la cantidad de memoria RAM que usa. Y sin ver tu código no mucho se puede hacer.

Saludos

[gilber966]

ok esto es lo q tengo en lineas generales:

una funcion q inicia los disparos en orden dispara hasta 19 balas lo que hace es poner una variable JSON en true asi: bala0{mode:false, x:0,y:0}

la funcion:

Código Javascript:

function disparar(){
disparando=true;//console.log("si disparar : "+disparando);
        
if(bala0.mode==false){ bala0.angulo=controlAngulo* Math.PI / 180;//en rads
segundoAngulo0=180-(90+controlAngulo);//angulo para dibujar la linea de la bala de 20 px roja
segundoAngulo0=(180-(90+controlAngulo))* Math.PI / 180;
}
 

esta toma el angulo del cañon para calcular el angulo de la bala, la bala es una linea, en el loop pinto hasta 19 balas SI estan en mode:true asi:

Código Javascript:

if(bala1.mode==true){//ojo aqui solo se dibuja la bala
bala1f();//esta funcion hace los calculos sobre la bala
mundoContexto.beginPath();
mundoContexto.moveTo(bala1.X,bala1.Y);
mundoContexto.lineWidth = 2;
mundoContexto.strokeStyle = "red";
mundoContexto.lineTo(parseInt(bala1.iniX),parseInt(bala1.iniY));
 
 
mundoContexto.stroke();
 
}if(bala1.mode==false){//si la bala esta false por colision la volvemos al lugar inicial
iniX=parseInt(canonData.X)+90;
iniY=parseInt(canonData.Y)+53;
bala1.X=String(origenBalasX);
bala1.Y=String(origenBalasY);
bala1.iniX="0";
bala1.iniY="0";
hipotenusa1=1;
} //fin de la bala 1
 

como la anterior son 19 una por cada bala, pero noten que los calculos no se hacen aqui los hace bala1f()

esta es la funcion que realiza los calculos:

Código Javascript:

function bala1f(){
if(bala1.mode==true){
//ojo solo bala lineal 0 grados 
//primero mirar si la bala esta fuera de la pantalla
if(bala1.X > extremoXbala || bala1.Y < extremoYbala){
//inhabilitar la bala si esta fuera de la pantalla
sacarBala(bala1,1);
segundoAngulo1=0;
return;
}
 
//fin de revision si la bala esta fuera de la pantalla
hipotenusa1=hipotenusa1+2;//determinar el velocidad de la bala
cot=20*Math.sin(segundoAngulo1);//co del segundo angulo, atras de la bala
cat=20*Math.cos(segundoAngulo1);
//determinar los puntos donde termina la hipotenusa, la hi mide 
 
co=hipotenusa1*(Math.sin(bala1.angulo));
ca=hipotenusa1*(Math.cos(bala1.angulo));
bala1X=parseInt(bala1.X)+ca;//posicion de la bala en x
bala1Y=parseInt(bala1.Y)-co;//posicion de la bala en y
bala1.X=String(bala1X);
bala1.Y=String(bala1Y);
bala1.iniX=String(bala1X-cot);
bala1.iniY=String(bala1Y+cat);
//colisiones(); 
}
 

no esta implementada la colision pero es simple, cuando una bala esta fuera de la pantalla paso su modo a false, X y Y a 0, angulo a 0 y el origen a la punta del cañon, hay una funcion que actualiza la punta del cañon cada que este gira.

en fin eso es mi codigo, espero sus opiniones y les agradezco las observaciones que me puedan guiar

[gilber966]

ah ya cambie a setRequestAnimation

sube hasta 10mb+/-, por otro lado hize un listener sobre la tecla subir, ahora lo empleo para ejecutar la funcin disparo pero sorpresa si lo uso seguido mi pc se bloquea, y empiezan a haber muchas curvas en la grafica :( bueno aunqe el destino es un dispositivo movil