[HTML5] optymalizacja gry

Dla specjalistów Programowanie
#1

Witam,

jestem początkujący jeśli chodzi o HTML5, niedawno zacząłem coś w tym grzebać i pisząc swoją grę zauważyłem że coś jest nie tak jeśli chodzi o płynność.

Z resztą zobaczcie sami: …

Raptem kilka prostokątów, a ilość FPS u mnie wacha się między 15 a 20 (ctrl+shift+c i tryb konsoli). Gdybym miał słaby komputer to by mnie to nie dziwiło, ale że (jeszcze kilka lat temu) to była niezła machina to coś tu jest nie tak. Tym bardziej że takie Cut the Rope chociażby działa u mnie płynnie.

Czy ja coś robię źle? Jak takie coś przyśpieszyć?

Cały kod macie w trybie developera w przeglądarce.

Z góry dziękuję za pomoc.

#2

ja moge dodać że mam 4 rdzeniowy procesor 2,5 ghz 4 gb ram i to samo:D na pewno nie ma 24 fps:D

na chwile było spokojnie ponad 30 ale to trwało sekunde:D

#3

co nie zmienia faktu ze nadal nie wiem co zrobić żeby działało płynnej. albo chociaż powiedzcie gdzie pytać żeby uzyskać odpowiedź.

#4

Popracuj nad funkcją main(), powinno w niej być najmniej ile się da.

I spróbuj wywalić to:

clear();

console.log(“FPS” + FPS);

Clear zastąp czyms innym, np clear rectangle

Kolory zdefiniuj jako globalne

#5

Wywaliłem już wszystko co się dało (chyba), no ale skoro uważasz że nadal jest źle… :stuck_out_tongue: Ewentualnie zrobię globalne kolory (jak z resztą mówiłeś) ale nie wierzę żeby aż tak zamulały grę.

Co to jest to clear rectangle? Rozumiem że nie chodzi ci o zmianę nazwy funkcji?

#6

Nie chce mi się patrzyć w kod ale w tego typu animacjach warto wyrendować scenę szerszą niż widać na ekranie, potem zamiast rysować od nowa przesuwamy jedynie scenę(left: 40px itp.). Kiedy kończy nam się scena przesuwamy ją na sam początek i przerendowywujemy. (zamiast rysować od nowa lepiej wyciąć widoczny fragment i dorysować jedynie dalszą część). No i trzeba pamiętać żeby nie przerysowywać sceny częściej niż 40ms bo oko tego nie wychwyci.