EnableFramerateCounter, Setting your Framerate correctly


Debug tool
I posted about EnableFramerateCounter before — it is a simple little debugging setting that you can use when trying to figure out:



  1. Which of these designs hurts my framerate more?

  2. If I add this module in, does it hurt my framerate?

To figure these out, you can:



  1. Set the plugin’s desired framerate at 1000 (silverlightObject.settings.MaxFrameRate OR Silverlight.CreateObjectEx({properties:{framerate:’framerate‘}}))

  2. Turn on the EnableFramerateCounter, which should show up in the status bar (IE/Firefox –> View –> Status Bar).

Desired Framerates
Make sure to reset the framerate to the suggested framerates for your app: Media apps @60fps or RIA/Control apps @20fps before launching your app to the public.
When trying to figure out the desired framerate of an animation or control-heavy app, use real people (not developers/designers) to gauge whether increasing the fps above 20fps makes sense. If you set your framerate at an unnecessarily high value, it will throttle the computer’s cycles — and could result in a jerkier effect than if you just had a lower framerate. So where 60fps might be slick and easy for your devbox, it could be a pain for your customer’s machine — so only use what you need.


The desired framerate of plugin hosting media is always 60fps — this gives the media pipeline the most number of ticks to figure out the optimal timing of presenting a frame. Silverlight will decode at the framerate of the encoded video (this usually is <32fps), and we present the frames in sync with the audio. To summarize roughly, if the platform doesn’t receive a tick in sync with the audio, then the platform will decode the frame, and then just throw it away. If you don’t understand this, just trust me and use framerate=60.


Technically, you could set the framerate dynamically — I haven’t tried this, but it might be a useful thing to try out if your app has both media and heavy controls/animations.


Debugging Settings


So here are the debugging settings that I use (not all at once, of course)



Sys.Silverlight.createObjectEx({


     source: “xaml/Scene.xaml”,


     parentElement: document.getElementById(“SilverlightControlHost”),


     id: “SilverlightControl”,


     properties: {


          width: “500”, height: “500”,


          isWindowless: false,   


          background: “FF000000”,


          framerate: 10000      },


     events: { onLoad:onLoadHandler} });


 


function onLoadHandler() {


     agControl = document.getElementById(“SilverlightControl”);


     /* To see the framerate displayed in the browser status bar */


     agControl.settings.EnableFrameRateCounter = true;


     /* To see the redraw regions*/


     agControl.settings.EnableRedrawRegions= true;


}


I accidentally dumped the sugar canister into my tea, time to go home.
Seema