Firefox Performance Issues - CopperLicht Forum

Ambiera Forum

Discussions, Help and Support.

	Ambiera Forum > CopperLicht
	Firefox Performance Issues

jquindlen Registered User
Quote
2013-11-07 00:31:52

Niko,

Thanks for the excellent work. Sorry about the long post, but I am trying to make a commercial successful indie game with Copperlicht, and need to get performance optimized. I have about a year left in development, so I have time to sort through issues, but the early the better. Thanks for your help.

On Chrome 30, my game runs at a smooth 60 FPS with infrequent stutters. Overall, it is great performance.

On Firefox 22 (XULRUNNER 22 to be exact, since this is a custom desktop game, using Copperlicht as the renderer inside of XULRUNNER 22) I still get 60 FPS, but, there are little stutters every 4 or 5 seconds which make it feel like a framerate drop. This is on an i7 at 4.9GHz and a Radeon 7970 GHz Edition, so I can max out all games without issues.

Now Chrome's Javascript engine is definitely a bit better than Firefox, but they are in the same ballpark. I like using XULRUNNER much better than trying to embed Chrome into my program though, so I'd love to tweak things so that I can continue to use XULRUNNER/GeckoFX instead of jumping ship to CefGlue.

To that end, is there anything I can do to increase performance of Copperlicht?

In this thread, it seems that modifying the source away from setInterval() for drawing the scene, and replacing it with requestAnimationFrame() would increase performance:
http://www.ambiera.com/forum.php...

Now I know you said in that thread that you didn't want a website taking down a user's computer, but I don't use Copperlicht for websites, I use it as a cross-platform game engine, so my main concern is squeezing the full performance available from a system.

In addition, requestAnimationFrame() shouldn't take down a person's web browser anyway, since the very nature of requestAnimationFrame() is to drop frames and allocate CPU/GPU time in the most efficient manner. I would think switching to requestAnimationFrame() would increase stability and performance, but perhaps I am wrong.

Is there anything else I can do to increase performance?

If you're not down to include requestAnimationFrame() how would I go about it?

niko Moderator
Quote
2013-11-07 08:25:42

Hi,
the requestAnimationFrame() is a nice-to-have but doesn't really do anything in terms of performance.
From your description, the behavior you are encountering sounds like what Firefox did a few years ago. I think it was the garbage collector kicking in, but it seems like they have fixed it long ago. I don't have any experience with xulrunner, but maybe this is using an old version of Firefox? Which still has this bug?

So the easy way to find if this is the case would be to check if the problem you have also appears in the current Firefox version. If not, then this xulrunner obviously maybe is a bit out of date.

jquindlen Registered User
Quote
2013-11-07 15:37:16

I'm running Firefox 22 and Xulrunner 22, so they are pretty close to up to date. However, you were on the right track with the garbage collector. I managed to fix my issue by overriding how often the garbage collector kicks in. Normally, Firefox is set to run the garbage collector at 3mb of data. However, my game scenes easily eat 60 to 120 MB of RAM. I raised the garbage collector threshold to 256 MB and now I don't have the microstutter issue.

Gecko.GeckoPreferences.User["javascript.options.mem.gc_allocation_threshold_mb"] = 256;

Thanks for the pointer in the right direction, much appreciated.

niko Moderator
Quote
2013-11-09 07:21:19

Interesting, thanks for posting the solution.

jquindlen Registered User
Quote
2013-11-10 01:43:03

Well, it didn't solve everything, now I'm trying to reduce javascript CPU usage drastically. Here's the full code I am currently using for memory & garbage collection:



                //MEMORY & GARBAGE COLLECTION
                Gecko.GeckoPreferences.User["browser.cache.memory.enable"] = true; // Cache stuff in RAM if possible
                Gecko.GeckoPreferences.User["browser.cache.memory.capacity"] = 2096128; // auto sets the RAM usage to 2GB. Game has a 3GB RAM minimum system requirement
                Gecko.GeckoPreferences.User["browser.cache.memory.max_entry_size"] = -1; // -1 means no max entry size
                Gecko.GeckoPreferences.User["javascript.options.mem.high_water_mark"] = 1536; // High memory usage at 1.5GB
                Gecko.GeckoPreferences.User["javascript.options.mem.max"] = 2096128; // just below 2GB max ram usage (32 bit, so duh)
                Gecko.GeckoPreferences.User["javascript.options.gc_on_memory_pressure"] = true;
                Gecko.GeckoPreferences.User["javascript.options.mem.gc_allocation_threshold_mb"] = 256;
                Gecko.GeckoPreferences.User["javascript.options.mem.gc_decommit_threshold_mb"] = 260;

                Gecko.GeckoPreferences.User["javascript.options.mem.gc_high_frequency_high_limit_mb"] = 2000;
                Gecko.GeckoPreferences.User["javascript.options.mem.gc_high_frequency_low_limit_mb"] = 256;

                Gecko.GeckoPreferences.User["javascript.options.mem.gc_dynamic_heap_growth"] = true;
                Gecko.GeckoPreferences.User["javascript.options.mem.gc_dynamic_mark_slice"] = true;
                Gecko.GeckoPreferences.User["javascript.options.mem.gc_incremental"] = true;
                Gecko.GeckoPreferences.User["javascript.options.mem.gc_incremental_slice_ms"] = 10000000;
                Gecko.GeckoPreferences.User["javascript.options.mem.gc_per_compartment"] = true;

I'm currently using GeckoFX 22 (Xulrunner/Firefox 22) I've also got builds running using Awesomium and CefGlue, but so far, GeckoFX 22 is providing the best performance.

I'm coding a Copperlicht game, but I am writing game clients in Windows, Mac OS, Linux and hopefully Android/iOS at some point. The reason I'm doing it like this is that I have been able to code in XBox 360 controller support into my game, as well tweaking the game through a .ini file. Plus, as you can see, I am able to control the web browser and fine tune it for the game itself, instead of leaving the browser set up for general web surfing. I'm trying to make a full indie RPG in HTML5/Javascript/Copperlicht. I'm fairly far in development, but I'm still trying to get acceptable performance mixed with decent eye candy. The eye candy part hasn't been too hard thanks to CopperCube 4, but optimizing performance and providing the ability to scale down and run on lower end hardware may be hard to accomplish.

To that end, I'm still highly interested in ways to optimize my .ccbjs files, my Javascript, my browser, textures, shaders, anything to squeeze better performance from the game.

At some point soon, I hope to find the time to benchmark a bunch of Copperlicht features to measure impact of performance. My biggest barrier right now is Xulrunner 22 is single threaded, and my game maxes out one core of my 4.5GHz cpu to achieve 60 FPS. When I downclocked my CPU down to 1.6GHz it still maxed out a core on my CPU and achieved about 25 FPS. My next experiment was to remove all but two dynamic lights, and remove a large rotating plane to simplify the scene a bit. No changes in CPU/FPS.

Awesomium has two threads running, and it maxes 1 core as well, but only achieves 30 FPS at 4.5GHz with hardware acceleration.

So, my game logic is pretty barebones at this time, but it's clear the GPU is not the issue (GPU max load was 45%), it's a CPU bottleneck I'm left with. The garbage collector

niko Moderator
Quote
2013-11-10 20:39:09

It's basically a matter of optimizing your scene a bit, but basically, JavaScript apps will use a lot of CPU. For endtime (http://www.endtime.at/), I use a bit lower FPS setting (I think 30 FPS), and it's still nicely playable that way, while the browser isn't maxing the CPU out that much.

jquindlen Registered User
Quote
2013-11-10 23:12:11

Yeah, 30 FPS may be a better target framerate for performance. Thinking about making the canvas a little less than full screen and then stretching it after the fact, since I discovered on accident that it will still render to the original resolution instead of the changed canvas resolution, if you change canvas size after Copperlicht starts rendering. Perhaps my low setting could render at 50% less resolution to allow running on lower spec hardware.

I'm kind of just brainstorming out loud here and looking for hints, tips, etc. If you don't mind, I think I may continue to update this thread with performance tweaks.

jquindlen Registered User
Quote
2013-11-11 00:03:40

Setting FPS to 30 got my CPU usage down between 15% to 55% depending on scene, which brings things into a more realistic performance zone.

In addition, if you set the canvas width to small number, and then use CSS width and height to fill the page, Copperlicht will still render to the small canvas size, and then CSS stretches it to full size. This makes the image blurry, but seems to improve performance by between 10% to 40% on my system.

The problem with 30 FPS is my game uses a primarily top down 3rd person camera view. I am manually moving the camera with the player and adjusting X, Y, and Z of the camera each frame. However, at 30 FPS, each step when the character runs looks super choppy. My character moves 2 units when walking @ 30 FPS, and moves 5 units @ 30 FPS when running. This is to match the pace of the running and walking animations rigged with the model.

Now, I know there is a 3rd person camera behavior that can be used, and it has a smoothing setting. I'd like to use this, but my player model is dynamic and is loaded from a different .ccbjs file, meaning I'd need to assign this 3rd person camera behavior manually. Now, I know there is a CL3D.AnimatorCameraModelViewer class and a CL3D.AnimatorCameraModelViewer class, is there also one for the 3rd person camera that I can use? If not, any other help with this issue. Thanks again Niko for all the hard work.

jquindlen Registered User
Quote
2013-11-12 01:06:23

Ahh thank god. I finally got a smooth 60 FPS with decent CPU usage and no stuttering with a client I wrote in Lazarus (free pascal) using Chromium Embedded Framework 3.x implementation here: https://github.com/dliw/fpCEF3

I was considering ditching HTML5 completely and moving the game to Irrlicht, but now that I have proof that decent performance can be acquired, I will stick with Copperlicht.

I don't think I'll stick with Lazarus, as writing the XBOX 360 controls would be a whole process. I'll first try CEF3 on C Sharp (not Awesomium because it did not give me good performance.) If I can't get a C Sharp .NET port of CEF3 working well, I'll just migrate the project to CEF3's native C++ platform and rewrite the controls there.

niko Moderator
Quote
2013-11-13 13:43:59

Ah, nice :)

Create reply:

Possible Codes

Feature	Code
Link	[url] www.example.com [/url]
Bold	[b]bold text[/b]
Image	[img]http://www.example.com/image.jpg[/img]
Quote	[quote]quoted text[/quote]
Code	[code]source code[/code]

Emoticons