By default, Milana does not record the contents of <canvas> elements — they appear as blank rectangles in replays. Enable canvas recording if your app uses canvas for charts, drawing tools, maps, or other visual content that is important to understand user behavior.
Enable canvas recording
Pass shouldRecordCanvas: true in your init options.
<MilanaProvider
productId="prd_YOUR_PRODUCT_ID"
clientKey="key_YOUR_CLIENT_KEY"
sessionInfo={{ environment: "production", version: "2.4.1" }}
options={{
shouldRecordCanvas: true,
}}
>
<YourApp />
</MilanaProvider>
Milana("init", "prd_YOUR_PRODUCT_ID", "key_YOUR_CLIENT_KEY",
{ environment: "production", version: "2.4.1" },
{ shouldRecordCanvas: true }
);
When to enable it
- Charts and data visualizations rendered on canvas (e.g. Chart.js, D3 with canvas renderer)
- Drawing or annotation tools where the canvas content is the core user experience
- Maps rendered on canvas (e.g. Mapbox GL, Google Maps)
- Games or interactive simulations
Canvas recording periodically snapshots the canvas content and includes it in the recording event stream. This increases payload size, which can affect:
- Network usage — larger event batches are sent to the ingest endpoint
- Recording buffer — sessions with frequent canvas updates fill the event buffer faster
If your canvas updates at a high frame rate (e.g. 60fps animations), canvas recording can significantly increase payload size. Test in staging before enabling in production.
For apps with small or infrequently updated canvases (e.g. a static chart rendered once), the overhead is minimal.