Why does the original price flash before the discounted one?

Updated Oct 1, 20262 min read

Because live pricing runs in the shopper's browser after your theme has already drawn the page. Shopify renders your product's real price, then Hype fetches your campaign data and replaces the price element. The gap between those two moments is the flash. It is expected behavior for live pricing, not a fault in your store.

What happens in that gap

Shopify serves the page with the normal price.
The Hype: Discounts app embed loads and asks Hype which campaigns apply to this visitor and market.
For each product on the page, Hype reads that product's price data from your storefront.
Hype replaces the price element with the campaign price and the struck-through original.

Steps 2 and 3 are network requests, so how long the flash lasts depends on the shopper's connection. Collection pages do more work than product pages, because every card on the page is a separate product to resolve.

What makes it shorter

Nothing to configure. Hype already caches campaign data and product data for 10 minutes each, so repeat page views in the same session are faster than the first one.
Keep the number of products on a collection page reasonable. A grid that lazy-loads 100 products has 100 prices to resolve; cards are rewritten as they scroll into view.

What removes it: SSR live pricing

SSR live pricing (Beta) moves the work to the server. Hype writes your campaign's rates to a store metafield, and your theme renders the discounted price directly in the page's HTML, so there is nothing to replace and no flash.

Its limits:

It is available only on an Active, Automatic, Multi products discount campaign. You will not see the option on any other campaign.
Enabling it turns off client-side live pricing for that campaign — the modal says so: "Enabling SSR live pricing will disable client-side live pricing for this campaign."
It requires a change to your theme's Liquid, which our team makes for you. Ask support to set it up.
Because it lives in theme code, changing or republishing your theme removes it. Tell support before you switch themes and we will reapply it.

If the price never changes at all

That is a different problem — the price is not being rewritten, rather than being rewritten late. See How do I show discounted prices on product and collection pages?.

Was this article helpful?

Still stuck?

Ask a follow-up and we'll see it came from “Why does the original price flash before the discounted one?”.

Opens chat with your question and a link to this article.