Firefox OS/Performance/App Performance Validation

This page outlines a simple process for manually auditing and improving the performance of an app.

Section listed first have a higher priority. This means that for example fixing over-invalidation and responsiveness will lead to vastly improved checker-boarding thus should be performed first when possible.

Over-invalidation

What does it mean: Over-invalidation means that we're repainting content that isn't changing. This leads to higher CPU usage & bandwidth.

Verification Steps:

  • In the Developer menu turn on 'Flash repainted area'.
  • Perform all common interaction with the app. Look for areas of the page that are flashing but where the content hasn't changed. Here are some example:
 
Good: GIF invalidates every frame, links invalidates on mouse over because of style change. Static content is not repainted
 
Good: When scrolling, new content is painted but it doesn't repaint once on the screen.
 
Bad: Clicking repaints the whole page.