With our Blazor WebAssembly dashboard, you can easily monitor your golden metrics, track end user experience, and see your total page views over time.
Built with our browser monitoring agent, the Blazor WebAssembly integration gives you a set of default that let you view your most critical query data, all in one place.
After setting up the Blazor WebAssembly integration with New Relic, your data will display in dashboards like these, right out of the box.
Install the infrastructure agent
You don't need the infrastructure agent to integrate Blazor WebAssembly with New Relic, but we recommend installation if you want full observability of your system. The infrastructure agent collects logs and other data about your hosts, showing your performance metrics alongside your application metrics.
There are two methods to install the infrastructure agent:
- Follow our guided install to instrument your system with the infrastructure agent.
Integrate Blazor WebAssembly with New Relic
To collect data from Blazor WebAssembly, follow the below procedures:
From one.newrelic.com, go to the Integrations & Agents page.
Click Browser and mobile, then click Browser monitoring.
Select the Select copy/paste JavaScript code option (for more about this code, see our browser install docs).
Complete the rest of the steps and click Enable.
Go to the
wwwrootdirectory of your Blazor WebAssembly application.Open the
index.htmlfile.Paste our browser code snippet right before the body tag ends (
</body>).Restart your application.
Go to one.newrelic.com, then click Metrics & events. Run a sample NRQL query to confirm New Relic is collecting data:
SELECT average(windowLoad) FROM PageViewTiming WHERE (deviceType = 'Desktop') FACET `userAgentName` SINCE 604800 seconds AGO TIMESERIESInstall the default dashboards by going to the Blazor WebAssembly instant observability page, then clicking Install at the top of the page.
Go to Dashboards from one.newrelic.com and click Blazor WebAssembly to view your dashboards.
What's next?
To learn more about building NRQL queries and generating dashboards, check out these docs:
- Introduction to the query builder to create basic and advanced queries.
- Introduction to dashboards to customize your dashboard and carry out different actions.
- Manage your dashboard to adjust your dashboards display mode, or to add more content to your dashboard.