feat: Update experimental features section

src/content/docs/browser/new-relic-browser/browser-pro-features/browser-features.mdx

@@ -22,3 +22,4 @@ Check out our key <InlinePopover type="browser"/> features:
 * <DNT>[Distributed tracing](/docs/browser/new-relic-browser/browser-pro-features/browser-data-distributed-tracing/)</DNT>: Connect backend and frontend performance
 * <DNT>[Browser apps index](/docs/browser/new-relic-browser/getting-started/browser-apps-index/)</DNT>: View a list of all your browser apps
 * <DNT>[Marks and measures](/docs/browser/new-relic-browser/browser-pro-features/marks-and-measures/)</DNT>: Automatically track native marks and measures
+* <DNT>[Page resources](/docs/browser/new-relic-browser/browser-pro-features/page-resources/)</DNT>: Automatically observe page resource timings

src/content/docs/browser/new-relic-browser/browser-pro-features/page-resources.mdx

@@ -0,0 +1,75 @@
+---
+title: 'Automatically observe page resource assets'
+tags:
+  - Browser
+  - Browser monitoring
+  - Experimental features
+metaDescription: "Observes and reports on the performance of your webpages by automatically observing page resource timings."
+redirects:
+  - /docs/new-relic-browser/browser-pro-features/browser-features
+freshnessValidatedDate: never
+---
+
+[Resource Assets](https://developer.mozilla.org/en-US/docs/Web/API/PerformanceResourceTiming) are reported natively by all major browser and allows you to observe and report on the performance of the assets your webpages import. New Relic Browser can automatically track these assets as `BrowserPerformance` events.
+
+<Callout variant="important">
+This feature is currently experimental and available only for opt-in on manual copy and paste, or NPM implementations of the agent. For more information on opting in, refer [experimental features](/docs/browser/new-relic-browser/configuration/experimental-features). Note that these features are subject to changes before GA.
+</Callout>
+
+Page resources detected by the browser agent will be queryable through the `BrowserPerformance` event type. You can use this data to create custom queries and dashboards in [New Relic One](/docs/new-relic-one/use-new-relic-one/get-started/introduction-new-relic-one).
+
+## Examine performance details [#view_details]
+
+Example queries to view page resource timing data:
+
+```nrql
+FROM BrowserPerformance SELECT * WHERE appName = 'My Application' AND entryName = 'resource'
+```
+
+```nrql
+FROM BrowserPerformance SELECT average(entryDuration) as 'ms' WHERE entryType = 'resource' facet initiatorType
+```
+
+```nrql
+FROM BrowserPerformance SELECT average(connectEnd - connectStart) as 'TCP Handshake', average(domainLookupEnd - domainLookupStart) as 'DNS Lookup', average(redirectEnd - redirectStart) as 'Redirection Time', average(responseStart - requestStart) as 'Request Time' timeseries 3 minutes
+```
+
+```nrql
+FROM BrowserPerformance SELECT percentage(count(*), where decodedBodySize <= encodedBodySize) as 'Compressed Payloads' where entryType = 'resource'
+```
+
+```nrql
+FROM BrowserPerformance SELECT percentage(count(*), where transferSize = 0) as 'Cached Payloads' where entryType = 'resource'
+```
+
+```nrql
+FROM BrowserPerformance SELECT percentage(count(*), where renderBlockingStatus is NOT NULL ) as 'Render Blocking Resources' where entryType = 'resource'
+```
+
+```nrql
+FROM BrowserPerformance SELECT max(responseStart - requestStart) as 'Request Time' facet entryName
+```
+
+```nrql
+FROM BrowserPerformance SELECT max(domainLookupEnd - domainLookupStart) as 'DNS Lookup Time' facet entryName
+```
+
+```nrql
+FROM BrowserPerformance SELECT max(responseStart - requestStart) as 'Request Time' facet currentUrl
+```
+
+```nrql
+FROM BrowserPerformance SELECT max(connectEnd - connectStart) as 'TCP Handshake Time' facet entryName
+```
+
+```nrql
+FROM BrowserPerformance SELECT count(*) where firstParty is true facet initiatorType limit 100
+```
+
+```nrql
+FROM BrowserPerformance SELECT count(*) facet cases(where firstParty is true as 'First Party Asset')
+```
+
+```nrql
+FROM BrowserPerformance SELECT average(entryDuration) facet cases(where firstParty is true as 'First Party Asset', where 1=1 as Other)
+```

src/content/docs/browser/new-relic-browser/configuration/experimental-features.mdx

@@ -4,10 +4,35 @@
 freshnessValidatedDate: never
 ---
 
-New Relic browser agent offers a range of features to enhance your application monitoring capabilities. Some features are released in experimental state to ensure stability and reliability. These features may change or may lack support. You must use them with caution.
-
+New Relic Browser features are exposed to customers in a controlled manner to ensure stability and reliability. However, some features are made available before they reach general availability. These are known as experimental features. To access them, you must opt in.
 
 ## Current experimental features
 
-The following experimental features are available:
-* Browser agent v1.272.0: [Automatically track native marks and measures as `BrowserPerformance` events](/docs/browser/new-relic-browser/browser-pro-features/marks-and-measures)
+The following experimental features are available in New Relic Browser:
+* Browser Agent v1.272.0 - [Automatically track native marks and measures as `BrowserPerformance` events](/docs/browser/new-relic-browser/browser-pro-features/marks-and-measures).
+* Browser Agent v1.276.0 - [Automatically observe page resource assets as `BrowserPerformance` events](/docs/browser/new-relic-browser/browser-pro-features/page-resources).
+
+
+<Callout variant="important">
+  Experimental features are available only for opt-in on manual copy and paste, or NPM implementations of the agent. These features are subject to change and should be used with caution.
+</Callout>
+
+## Opt in to use experimental features
+
+### Browser Performance - Marks, Measures & Resources
+1. Ensure you are using a version of the New Relic Browser agent compatible with the experimental feature, on a pro or pro+spa equivalent build.
+2. Find the New Relic browser agent code in your webpage HTML or JS application.
+3. In the `init` configuration object, add the `performance` feature configuration. Here's an example that enables both marks and measures detection:
+  ```js
+  <script type="text/javascript"> ;window.NREUM||(NREUM={});init={ …, performance: {
+    capture_marks: true, // enable to capture browser performance marks (default false)
+    capture_measures: true // enable to capture browser performance measures (default false)
+    resources: {
+      enabled: true, // enable to capture browser peformance resource timings (default false)
+      asset_types: [], // Asset types to collect -- an empty array will collect all types (default []). See https://developer.mozilla.org/en-US/docs/Web/API/PerformanceResourceTiming/initiatorType for the list of types.
+      first_party_domains: [], // when included, will decorate any resource as a first party resource if matching (default [])
+      ignore_newrelic: true // ignore capturing internal agent scripts and harvest calls (default true)
+    }
+  } }:
+  ```
+4. Deploy your app.

src/nav/browser.yml

@@ -80,6 +80,8 @@ pages:
         path: /docs/browser/new-relic-browser/browser-pro-features/browser-data-distributed-tracing
       - title: User actions
         path: /docs/browser/browser-monitoring/browser-pro-features/user-actions
+      - title: Page resources
+        path: /docs/browser/new-relic-browser/browser-pro-features/page-resources
       - title: Marks and measures
         path: /docs/browser/new-relic-browser/browser-pro-features/marks-and-measures
   - title: Monitor single page applications (SPA)