[StdPerf] kibana:plugin_render_time custom metrics documentation (ela…

…stic#190421)

This PR aims to document custom metrics usage introduced in
elastic#189115.

dev_docs/tutorials/performance/adding_custom_performance_metrics.mdx

@@ -294,6 +294,58 @@ This event will be indexed with the following structure:
 }
 ```
 
+#### Add custom metrics
+Having `kibana:plugin_render_time` metric event is not always enough, depending on the use case you would likely need some complementary information to give some sense to the value reported by the metric (e.g. number of hosts, number of services, number of dataStreams, etc).
+`kibana:plugin_render_time` metric API supports up to 9 numbered free fields that can be used to report numeric metrics that you intend to analyze. Note that they can be used for any type of numeric information you may want to report.
+
+We could make use of these custom metrics using the following format:
+
+```typescript
+...
+  // Call onPageReady once the meaningful data has rendered and visible to the user
+  onPageReady({
+    key1: 'datasets',
+    value1: 5,
+    key2: 'documents',
+    value2: 1000,
+  });
+...
+```
+
+where the `keys` will be the keys for the custom metrics we can later aggregate and analyze further.
+
+An event using custom metrics will be indexed with the following structure:
+
+```typescript
+{
+  "_index": "backing-ebt-kibana-browser-performance-metrics-000001",    // Performance metrics are stored in a dedicated simplified index (browser \ server).
+  "_source": {
+    "timestamp": "2024-08-13T11:29:58.275Z"
+    "event_type": "performance_metric",                                 // All performance events share a common event type to simplify mapping
+    "eventName": 'kibana:plugin_render_time',                           // Event name as specified when reporting it
+    "duration": 736,                                                    // Event duration as specified when reporting it
+    "meta": {
+      "target": '/home',
+    },
+    "context": {                                                        // Context holds information identifying the deployment, version, application and page that generated the event
+      "version": "8.16.0-SNAPSHOT",
+      "cluster_name": "elasticsearch",
+      "pageName": "application:home:app",
+      "applicationId": "home",
+      "page": "app",
+      "entityId": "61c58ad0-3dd3-11e8-b2b9-5d5dc1715159",
+      "branch": "main",
+      ...
+    },
+    "key1": "datasets",
+    "value1": 5,
+    "key2": "documents",
+    "value2": 1000,
+    ...
+  },
+}
+```
+
 ### Development environment
 
 The metric will be delivered to the [Telemetry Staging](https://telemetry-v2-staging.elastic.dev/) cluster, alongside with the event's context.