Performance Questions

I read that Firefox and Chrome should have similar performance, but I'm getting 20-30 fps in Firefox (v19) as opposed to a pretty stable 60 in Chrome (v25) in my game. WebGL is enabled in both browsers. Is this normal?

I'm running on Windows 7 Home 64 bit AMD Fusion Zacate E-350 1.6 GHZ dual core, 6GB RAM. It is a solid little netbook; its on the low end for desktops/laptops but should be much faster than mobile devices.

Live demo at mbcoffice.com/construct. Press middle mouse button and hover over the grid to see fps. Audio has been disabled to remove a potential performance factor.

This is my first project, to familiarize myself with the capabilities of Construct. I feel like it is relatively simple compared to what I might like to try in the future. Unfortunately as I was nearing completion the game started slowing down to ~50 fps even in Chrome. Is this a limitation of HTML5? Or am I coding it inefficiently? The capx is available at dropbox.com/s/aqhy1gvckcnckym/battleship.capx. I feel like I have refactored my code fairly well at this point. Any advice on further optimization would be greatly appreciated though! If my computer is already having trouble with a simple game like this, I'm worried I'd be wasting my time developing a more complex one. Also, I have tried removing the background animation, but that did not have any noticeable effect on fps.

I did find one performance factor, (which could perhaps be a bug?) when I added the list object for difficulty setting.

<img src="http://www.mbcoffice.com/construct/capture1.png" border="0" />

Without the "Trigger Once" condition, FPS in Chrome would drop from 60 down to 30 when ShotsFired>0. I assume it came from disabling the dropdown list every tick rather than just once (it doesn't happen when setting the list to enabled, while ShotsFired=0). When "Trigger Once" is added, the problem goes away. I've uploaded a version where the condition is disabled as in the screenshot at mbcoffice.com/construct/triggeroncedisabled, to see if this happens for others as well, in case it really is a bug that needs fixing. I didn't notice any difference between the two version in Firefox, but that may be because it was running pretty slowly in Firefox to begin with.

I also didn't mention IE, which only gets 15-20 fps on my computer, but to be fair that is probably because it is running canvas2d. When I disabled webgl, both Firefox and Chrome only got around 10 fps, so IE is performing rather admirably in that case. A friend running Safari on a Mac told me his FPS was even more miserable, which is what got me to start looking at the FPS in different browsers in the first place.

So far, as a graphic designer with several failed attempts at learning programming languages, I'm loving Construct! It has let me put together something on my own at last (in only a few days too!). I just hope that HTML5 is capable enough to support some of my crazier ideas ;)

On a side note, when I link to images on dropbox, it shows it as broken in the forum post. You can copy and past the link in a browser and it works though. Am I doing it wrong? For example:

<img src="https://www.dropbox.com/s/ohug88xa3d66br2/Capture.PNG" border="0" />

(https://www.dropbox.com/s/ohug88xa3d66br2/Capture.PNG)

Have you read Performance tips?

Generally the rendering happens at native-speed in HTML5 games when WebGL is enabled, so if the game is slowing down due to drawing too much then you've probably just reached the limits of what your hardware can handle.

I have read the performance tips page, as well as the various blogs articles as well. Mostly I was wondering about the discrepancy between Chrome and Firefox.

There are about 100-200 objects on screen with maybe 20 particles at most (I did test adding a lot more objects/particles without any huge difference in frame rate). Was hoping that wasn't the limit of my system!

I suspect it may be a processing bottleneck, like the issue I had when setting the list object to disabled every tick cutting the frame rate in half.

I did try on a faster computer and everything was zippy in all browsers.

Guess I'll go through the action sheet and disable things one at a time to see if there are any performance gains to be had for low end systems.

Thanks for the reply!

Most browsers v-sync the display to avoid tearing, so if a browser can only achieve 59 FPS, it might end up only rendering alternate frames and falling all the way to 30 FPS. (In other words since the time to render one frame could be *just above* the time it takes for the display to update, it is always still rendering when the display updates, so it has to wait for the next display update to show what was drawn.) So it may be that Firefox is only fractionally slower than Chrome, which seems likely.