feat(performance): Web Vitals transactions and spans documentation

src/docs/sdk/performance/modules/web-vitals.mdx

@@ -2,4 +2,62 @@
 title: 'Web Vitals Module'
 ---
 
-to be defined ...
+The SDK should auto-instrument:
+- [Page Loads](#pageloads-transaction-conventions) as Transactions 
+- [Interactions](#interactions-span-conventions) that trigger an [INP](https://web.dev/articles/inp) as standalone Spans
+
+## Pageloads Transaction Conventions
+
+### Properties
+
+| Property | Description |
+|:--|:--|
+| `transaction`           | A low cardinality string of the pageload route. Can be a route template if applicable to the frontend platform. e.g., `"/settings/{project}/"` |
+| `contexts.trace.op`     | Always `pageload` |
+| `contexts.browser.name` | The client browser on which the page was loaded. Supported values include `Chrome`, `Firefox`, `Safari`, `Opera`, and `Edge`. |
+
+### Measurements
+
+Web Vital metrics should be captured as measurements on the pageload transaction.
+```json
+{
+  "measurements": {
+    "lcp": { "value": 2049, "unit": "millisecond" },
+    "fcp": { "value": 2049, "unit": "millisecond" },
+    "cls": { "value": 0.21, "unit": "" },
+    "ttfb": { "value": 13, "unit": "millisecond" },
+  }
+}
+```
+
+| Measurement | Description |
+|:--|:--|
+| `measurements.lcp`      | The [Largest Contentful Paint](https://web.dev/articles/lcp) metric detected on the pageload. |
+| `measurements.fcp`      | The [First Contentful Paint](https://web.dev/articles/fcp) metric detected on the pageload. |
+| `measurements.cls`      | The [Cumulative Layout Shift](https://web.dev/articles/cls) metric detected on the pageload. |
+| `measurements.ttfb`     | The [Time To First Byte](https://web.dev/articles/ttfb) metric detected on the pageload. |
+
+## Interactions Span Conventions
+
+### Attributes
+
+| Attribute | Description |
+|:--|:--|
+| `transaction`      | A low cardinality string of the page route that the INP event occured on. Can be a route template if applicable to the frontend platform. e.g., `"/settings/{project}/"` |
+| `description`      | If applicable, the selector string that identifies the element which the interaction occured on. e.g. `"Sidebar > span.user > a"` |
+| `op`               | `ui.interaction.click`, `ui.interaction.press`, `ui.interaction.hover`, or `ui.interaction.drag` |
+
+### Measurements
+
+The Interaction to Next Paint metric should be captured as a measurement on the interaction span.
+```json
+{
+  "measurements": {
+    "inp": { "value": 500, "unit": "millisecond" },
+  }
+}
+```
+
+| Measurement | Description |
+|:--|:--|
+| `measurements.inp` | The [Interaction to Next Paint](https://web.dev/articles/inp) metric detected on the interaction. |