• After 15+ years, we've made a big change: Android Forums is now Early Bird Club. Learn more here.

Apps What might b the problem for slowdown of the game developed using html5 and javascript

U

uvamsi

Lurker
Hello everyone,
I have developed an Arkanoid game in html5, javascript and using phonegap i have converted it into .apk and run that in my AVD(android virtual device) the performance of the game is very very poor. The movements of objects is very bad and also the complete canvas tag is being selecting if we touch the screen to give inputs.

What might b the reason for this prob?
What might b the solution for this prob?
How to fix this?
Are html5 games work properly in Android?

Thanks in Advance
Vamsi.
 
First things first: Does it behave differently inside your APK than it does inside the browser? Are you sure you're doing evt.preventDefault on all, meaning touch and click, events?

About the performance..... there's simply no way to diagnose your problem without seeing your game, sorry.
 
I meant the Android browser: does it run differently in the Android browser than it does if hosted by your own APK?

Uhm... do you still have the JS with useful indention? It is very hard to read this way.

Aside from that there's the standard stuff:
1. You're using mouse, instead of touch events
2. Your events keep bubbling because you don't call stopPropagation & preventDefault
3. You're using setInterval.... always a bad idea, try a pseudo-recursive setTimeout
4. You're drawing everything on every frame update... try to use buffers and draw only rects that have actually changed.
 
This (the attached document: don't open it in notepad... it contains unix linebreaks) might help you... it doesn't really implement anything, but it might give you a rough idea how the skeleton, formatting and documentation of JS code should look like (of course, everybody has a different opinion on the details, but we actually agree on a lot of stuff... like indenting function bodies ;) ) and how timeouts and events interact.

It's actually playable, but the physics are really just stubs and the graphics consist solely of differently colored rectangles.

However the buffering path (there are two additional Canvas elements) would be the same for more fancy graphics, so it's about what you can expect performance-wise. It could be made even faster since, while the structure is OK, a lot of the code isn't actually very efficient: If you've got the time try to buffer more values & minimize usage of non-field variables (so that you don't trigger the GC).

Edit: A link might be slightly more pleasant than an attachment:
Breakout
 
hansschmucker said:
This (the attached document: don't open it in notepad... it contains unix linebreaks) might help you... it doesn't really implement anything, but it might give you a rough idea how the skeleton, formatting and documentation of JS code should look like (of course, everybody has a different opinion on the details, but we actually agree on a lot of stuff... like indenting function bodies ;) ) and how timeouts and events interact.

It's actually playable, but the physics are really just stubs and the graphics consist solely of differently colored rectangles.

However the buffering path (there are two additional Canvas elements) would be the same for more fancy graphics, so it's about what you can expect performance-wise. It could be made even faster since, while the structure is OK, a lot of the code isn't actually very efficient: If you've got the time try to buffer more values & minimize usage of non-field variables (so that you don't trigger the GC).

Edit: A link might be slightly more pleasant than an attachment:
Breakout
Click to expand...


thanks alot hansschmucker...

is there any tutorials available to achieve this...
 
Achieve what, specifically? The source is pretty well documented, just take a look and you should be able to figure out what it's doing pretty easily (well, except the utils at the top).
 
You must log in or register to reply here.
Back
Top Bottom