> For the complete documentation index, see [llms.txt](https://developer.singular.live/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://developer.singular.live/support/performance-testing-and-browser-diagnostics.md). # Performance Testing and Browser Diagnostics ## Performance testing Use these test overlays to verify browser rendering, CEF rendering, and your full output pipeline. Run the tests in order. Start in a browser. Then test the same URLs in your production pipeline. Your goal is a stable `60fps` result with no dropped frames, stutter, tearing, or visual artifacts. {% hint style="info" %} GPU acceleration is strongly recommended. This matters most for animation, scrolling tickers, and high pixel fill rate scenes. {% endhint %} ### Run the tests in order #### 1. Static Rectangle Use this as the first smoke test for loading and rendering an output URL. Expected result: * The overlay loads quickly. * The rectangle stays stable. * No flicker, tearing, or scaling issues appear. #### 2. Moving Rectangle Use this to verify basic horizontal animation. Expected result: * Motion stays smooth at `60fps`. * Movement does not jitter. * Frames do not drop during playback. #### 3. Static 20 Text Elements Use this to verify text rendering performance and clarity. Expected result: * All text renders sharply. * Layout stays stable. * No missing glyphs or delayed text paint appear. #### 4. Static Example Graphics Use this to test a more realistic overlay with text, images, and basic widgets. Expected result: * All elements render correctly. * Images load cleanly. * Layering and alignment stay correct. #### 5. Pixel fill rate performance of CEF Use this as a stress test for heavy rendering load. Expected result: * Systems with a GPU should stay near `60fps`. * CPU-only systems usually render at much lower frame rates. * Performance should stay stable over time. #### 6. Combined test Use this as the final validation pass. It combines scrolling motion, frame timing, and color checks. Expected result: * The ticker scrolls smoothly. * The frame counter and FPS meter stay stable. * The color bar displays in the correct pixel order. ### Browser diagnostics Use this page to inspect browser and pipeline capabilities. Check for: * browser feature support * graphics acceleration behavior * rendering issues in your integration ### Common failures #### Static test fails This usually points to a basic browser, integration, or output loading issue. #### Animation test fails This usually points to frame pacing, GPU acceleration, or compositor issues. #### Text or graphics render incorrectly This usually points to font, scaling, image decode, or browser compatibility issues. #### Stress test drops frames This usually means the system cannot sustain the required rendering load. #### Color bar looks wrong This usually points to a pixel format or channel order issue in the pipeline. ### Next steps If these tests do not pass cleanly, review your browser configuration, GPU usage, and encoding pipeline before moving to production workloads. --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://developer.singular.live/support/performance-testing-and-browser-diagnostics.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.