Don't Get Math Wrong: Building a Lightweight Multi-Tier Discount Engine

How I Solved the "Stacked Discount" Logic Problem in Next.js

Retailers love running promotions like "20% OFF — Plus an Extra 10% at Checkout!"

To most consumers, mental math translates this into $20\% + 10\% = 30\%$ off. But computationally and financially, compound (or stacked) discounts don't work linearly. Each consecutive percentage reduction applies to the remainder of the previous price, not the base original price.

When building a utility tool suite for xplosole, I needed to design a flexible engine that could handle single markdowns, reverse percentages, and arbitrary multi-tier stacked discounts cleanly in the browser.

Here is how the logic works and how to implement it efficiently.