Problem
A fast brand with a slow website
Heat Wave Visual embodies a thriving high-performance brand — sleek design, rich media content, and a lineup of killer products.
Built on Shopify Plus, heatwavevisual.com is a reflection of the brand’s bold, expressive identity, setting it apart from bland competitors.
As the company grew, scaling their site to meet customer demand revealed significant site speed bottlenecks. This risked frustrating their loyal customers, losing revenue, and diminishing their competitive edge.
Key challenges included:
- Data from Google showed that the most important content was taking over 3.6 seconds to show up, leading to customer frustration and lost sales opportunities.
- 100% of the site’s pages, across both mobile and desktop visitors, were categorized as performing poorly.
- Failing Google’s Core Web Vitals assessment jeopardized search engine visibility and ranking.
Approach
Hit Top Speed before Black Friday
Like so many digital leaders, Justin, Heat Wave Visual’s co-founder, had tried everything in his marketing toolbox to prepare for the holiday rush and boost sales including Shopify apps promising to increase AOV, spending ad dollars on social media to get eyeballs onto the site.
Despite all that, performance issues continued to be a hurdle. Often, the more plugins and apps that run on a site, the slower the performance. Of course, you can’t simply turn off everything without killing the user experience.
The challenge was clear: improve performance before the 2024 Black Friday/Cyber Monday holiday rush without disrupting operations or impacting the UX and ecommerce conversion rate of the site.
SpeedSense tackled Heat Wave Visual’s challenges with a four-week optimization plan tailored to its Shopify store.
Solution
Assess, Diagnose, Prescribe, Implement
To get started we first set up Sensai, the world’s first Site Speed Intelligence Platform. Sensai monitors site speed performance across thousands of pages and aggregates its results so that users know what to fix, and where.
The SpeedSense performance team used Sensai to audit Heat Wave Visual’s Shopify implementation and delivered a roadmap of performance improvement recommendations ranked by reach, impact, confidence and effort.
Next, the SpeedSense team rolled up our sleeves and got to work in the code, making the following optimizations to their Shopify templates:
- Reprioritize render-blocking CSS and JS files based on the UX.
- Remove excessively long page transitions by disabling certain settings in the Shopify theme.
- Optimize the HTML payload by auditing third party apps which were injecting thousands of excessive DOM nodes, disabling or deprioritizing app execution as required..
- Audit the necessity for jQuery and opt for modern, native JS features when needed.
- Optimize the use and loading of Vue.js only to templates where required.
- Resolve cache misses on the initial load by minimizing dynamic content in the base HTML response.
- Optimize the use and loading of third party libraries which were used to build on-page elements.
Occasionally, fixing one thing may inadvertently break another. and regressing may occur on other metrics unintentionally. Two steps forward, one step back In this case, since rendering was initially so poor, we expected to see a regression in layout shift once the initial low hanging fruit were picked. Sure enough, as predicted, Cumulative Layout Shift took a hit. We caught the regression in Sensai immediately and deployed a fix.
Results
Smoking the Competition
After just four weeks, Heat Wave Visual saw transformative results, passing Google Core Web Vitals on desktop and mobile yielding a record-breaking Black Friday/Cyber Monday shopping weekend.
As far as the competition goes, the king of shades is now throwing shade on performance-behemoths like Amazon surpassing them in both interactivity and rendering performance.
The raw numbers don’t lie: Largest Contentful Paint (LCP) improved from 3,643ms to 1,594, site-wide, a 56% improvement. And all those URLs with poor performance? 99% of pages are now passing Google Core Web Vitals.
