Over the past year, our web performance toolkit has matured significantly. This post is for merchants, partners, and agencies looking to improve storefront performance, and it distills the workflow we use internally into steps you can run yourself.
If you only do one thing: use Shopify's Web Performance dashboards to identify your real problem areas, then validate the issue using the Chrome DevTools Performance panel to confirm the root causes.
We don't need to guess anymore, we have the technology.
Shopify's RUM Data Jump to heading
The foundation of our performance work is real user metrics (RUM) information collected from actual Shopify storefronts. This same data powers the web performance dashboards available to merchants in their Shopify admin. Internally, we have more detailed reports and querying capabilities, but it's all built on the same underlying data.
RUM data has become even more valuable now that Safari exposes LCP and INP metrics. For the first time, we can measure Core Web Vitals across all major browsers, including the significant portion of traffic from iOS devices. If you've only been relying on CrUX or Lighthouse data, you have a huge gap in knowledge about how your store is truly performing.
What makes this data exceptional:
- Real user data: Not synthetic tests, but actual experiences from real customers
- Target element identification: See exactly which elements are causing LCP, CLS, or INP issues
- Event annotations: Correlate performance changes with theme updates and app installations
- Scale: We can analyze trends across the entire platform, not just individual stores
If you're a merchant, you have access to this same underlying data through your admin dashboards. We wrote extensively about how to get the most out of them in our post on mastering Shopify's new performance dashboards. Once you've identified problem elements, our series on debugging Core Web Vitals with CSS selectors walks through exactly how to fix LCP, CLS, and INP issues.
Programmatic Access via GraphQL Jump to heading
For developers who want to build custom tooling, all of this RUM data is accessible via the GraphQL Admin API. You can query web performance metrics using ShopifyQL through the API, enabling use cases like:
- Automated performance alerting via Shopify Flow
- Custom dashboards tailored to your specific needs
- Integration with your existing monitoring infrastructure
- Scheduled reports delivered to your team
We'll cover the specifics in a future post, but the key point is that this data isn't locked away in the admin UI. If you can build it, you can build it with real user data.
Chrome DevTools Performance Panel Jump to heading
The Chrome DevTools Performance panel has evolved significantly and is one of our bedrock tools for diagnosing performance issues. The Performance panel excels at answering the "what" and "why" questions that RUM data raises. When we see a spike in LCP times, DevTools helps us pinpoint the exact cause.
Recent features worth exploring:
- Field data comparison: Compare your local performance traces against real CrUX data to see how lab results align with field metrics
- MCP server integration: Connect your AI coding agent directly to DevTools for automated debugging workflows
- Custom tracks: Frameworks like React can now display rendering information directly in the Performance panel via the DevTools Extensibility API
- Annotations: Mark up traces with notes and share annotated recordings with your team
Check out the What's New in DevTools page to stay current on the latest features.
Shopify CLI for Local Theme Development Jump to heading
The Shopify CLI tool allows us to run theme previews locally, which is great for validating performance fixes before they go live. Being able to test changes in a local environment, with full access to Chrome DevTools, means we can iterate quickly without affecting production stores.
This is particularly powerful when combined with the Chrome DevTools Performance panel. We can make a change, run a local performance trace, and immediately see the impact.
AI-Powered Analysis Tools Jump to heading
Perhaps the most significant shift in our toolkit is the integration of AI-powered tools into nearly every part of our workflow. Shopify as a whole has been all-in on AI, and our team is no exception. We're constantly finding new ways to use it to help us do our jobs better.
To be clear, AI isn't doing the work for us. It's helping us make faster, more intelligent decisions. The expertise still comes from our team. AI just removes friction and lets us spend more time on the problems that actually require human judgment.
Having mountains of RUM data is only useful if you can actually extract insights from it, and AI tools have democratized access to that data, letting us ask questions and get answers right away.
Ad-hoc data querying Jump to heading
The real game-changer has been using LLMs in conjunction with tools (including MCP tools) to analyze data quickly. You can follow the same workflow by exporting reports from your Shopify admin (or pulling via API), saving them to CSV, and having an LLM help you slice, summarize, and spot patterns.
It's worth being explicit about the limitations of data analysis: asking an LLM for the root cause of your performance problems when it can't see the actual code is like asking it why your back hurts. It can suggest common culprits and some generalities, but the real answer comes from looking at a DevTools trace, a waterfall, the rendered html, or the theme/app code itself.
Internally, we can get super niche with our questions ("What's the p90 LCP for product pages on mobile devices in Germany for stores using Dawn theme?") or answer broad questions on the fly ("Which app categories have the biggest impact on INP scores?"). Store owners won't have this level of access, but you can still use the same approach: export a report from your Shopify admin (or pull data via API), then ask an LLM to summarize it, segment it, and propose a short list of hypotheses to validate.
Some ways we use this capability:
- Site-specific investigations: Quickly pull performance data for a specific store we're helping
- CSV report generation: Generate lists of pages that need attention, sorted by impact
- Trend analysis: Ask natural language questions about performance changes over time
- Correlation discovery: Explore relationships between different metrics without writing a single line of manual SQL
Browser automation MCP tools Jump to heading
Browser automation MCP tools have proven to be useful for diagnostic and development work:
- Automated issue identification: Point an LLM at a performance trace and get a summary of the key issues
- Fix validation: After making changes, use the LLM to verify that the issues have been resolved
- RUM validation: When we spot something in the RUM data, we can immediately run a diagnostic test with browser automation to confirm and investigate
- Pattern recognition: LLMs excel at spotting patterns across multiple traces that humans might miss
The AI-powered workflow Jump to heading
The combination of these tools creates a powerful feedback loop:
- Identify: Export reports from your Shopify admin (or pull via API) to find pages with performance issues
- Verify: Use browser automation MCP tools to run performance traces and get AI-assisted analysis
- Fix: Fix the issue, spin up a local theme preview with Shopify CLI, and validate the fixes locally by running another trace to confirm the fix, with AI helping to compare before and after
This entire workflow can happen in a single session, without excessive context-switching between a dozen different tools or waiting on other teams.
Sidekick Jump to heading
If you're a merchant, you can also access web performance reporting through Sidekick. Sidekick can work with the report data, but it doesn't have access to your theme code or app code. If you haven't used it before, start with Shopify's help docs on setting up Sidekick.
Conclusion Jump to heading
The tools have evolved, but the goal remains the same: making the web faster for everyone. Whether you're a merchant trying to improve your store's performance or a developer building themes and apps, the key is to focus on real user data. Lab tests have their place for debugging and controlled experiments, but they can't capture the diversity of devices, networks, and conditions that your actual users experience.
Here's a quick summary of our 2026 toolkit:
| Tool | Primary Use |
|---|---|
| Shopify RUM Data | Foundation for all analysis |
| Chrome DevTools Performance Panel | Debugging, root cause analysis |
| Shopify CLI | Local theme development and testing |
| AI + MCP Tools | Ad-hoc queries, trace analysis, fix validation |
| Sidekick | Natural language access to performance reports |
| GraphQL Admin API | Programmatic access, custom alerting (advanced) |
The performance tooling landscape will continue to evolve, but by grounding our work in real user data, we're confident that our optimizations are making a meaningful difference for the people who matter most: your customers.
Photo by Todd Quackenbush on Unsplash
