Is your Dapp displaying incorrect information to users? It probably is — through no fault of your own.

Since the start of the year, we have conducted more than 30 Dapp Transaction Usability Audits. Every Audit involves 50+ unique quantitative metrics and qualitative evaluations. One surprising finding: we have yet to audit a Dapp that cleanly handles either Canceled or Sped Up transactions. Why? 

Before we dive into the problems Canceled transactions cause and why most Dapps don't address them, let's first cover the basics. [Note: This post focuses on Canceled transactions. You can read about the ins-and-outs of Sped Up transactions in this post.]

What are Canceled transactions? 

On Ethereum, a Cancel transaction is an attempt to overwrite a currently pending transaction with a new transaction. It's important to note that Canceled transactions are a convention and not a standard. Typically, a Cancel transaction will have:

1. An identical nonce,
2. From the same Wallet address, 
3. At least a 10% higher ETH gas fee, but
4. Zero value, and
5. Gets signed-and-successfully-submitted before the original transaction is confirmed.

The core of the idea is that, since miners are incentivized to prioritize transactions with more gas, the cancel transaction should be confirmed before the original transaction – even though it entered the mempool later. In other words, Cancel transactions are kind of like probabilistic mulligans.

How do I cancel a transaction?

Many, but not all, web3 wallets can help you cancel a transaction. In the case of MetaMask, you must first find and click a pending transaction to show the transaction detail, and then click the Cancel button. Like this:

How to Cancel a transaction in MetaMask

While the Cancel function might seem somewhat buried, it turns out to be a commonly used feature among more sophisticated and engaged Dapp users. These users make a habit out of carefully monitoring their transactions and proactively managing gas costs. 

Straightforward enough... right? Not so much.

A critical piece of the puzzle is missing when it comes to Cancel transactions: your Dapp. While a user will engage with your Dapp to start a transaction, any Cancel activity occurs between that user and his or her wallet. Effectively, you and your Dapp are out of the loop.

How can I identify a Cancel transaction?

Can you spot the key differences in the fourth and fifth transactions in the illustration below?

A Canceled Transaction: Illustrated 

While the nonces are the same, the second transaction has:

• More gas.
• Zero value.
• A different timestamp.
• A different transaction hash. 

The first three are central to what makes a Cancel transaction a cancel. The fourth one, however, is a headache for you and your Dapp.

How do Canceled transactions affect Dapp UX?

Because the original and the Cancel transaction have different hashes, and the fact that your Dapp was not part of creating the Cancel transaction, your Dapp has no mechanism to connect the dots. This typically results in a transaction that will always show as pending. Here’s an illustrative example captured from a Dapp that we recently audited: 

The first transaction was Canceled — and is permanently shown as "Pending".

The first transaction was pending on Mainnet, but then was canceled and replaced by a new transaction. Because of this, the Dapp displays the status for a transaction that will never confirm nor fail. Instead, the original transaction will show as pending — permanently. Bummer.

As the Ethereum network grows, Canceled transactions are becoming increasingly common. So Dapps need to build a robust front-end that can handle these situations cleanly. 

Blocknative can help! 

We're not going to leave you hanging. We're happy to report that the Blocknative API now includes an Easy Button to solve the Cancel transaction UX headache. How? Our unique mempool monitoring framework detects Cancel transactions — in real-time. And, based on customer feedback, we recently extended our API to return the original transaction hash along with the Cancel transaction hash.

The Blocknative API can connect the dots for you and your Dapp. This lets you give your users real-time updates on the full spectrum of blockchain transactions — increasing engagement, improving retention, and driving growth. To learn more, click below to schedule a live demo.

Monitor Cancel transactions in Mempool Explorer:

Our Mempool Explorer is the easiest way to work with mempool data. It enables you to build real-time transaction event streams. It is fast, flexible and easy-to-integrate with your projects and trading strategies via a well-documented API. 

You can easily use Mempool Explorer to monitor Speed Up Transactions: 

• Monitor all Cancel transactions on top DEXs
• Monitor top Stable Coins for Cancel transactions
• Build your own feed to monitor Speed Ups on any contract or wallet address

Want to avoid stuck transactions in the first place? Use our ETH gas API to stream web3's most accurate gas fees. Combine it with our Ethereum transaction Simulation Platform for an unmatched set of pre-chain web3 developer tools.

This post was co-authored by Sean O'Connor, Chris Meisl, and Matt Cutler.  If you've encountered a Dapp that does a great job of handling Canceled transactions, please let us know.