Live App: https://binance.github.io/crypto-trade-analyzer

📋 Important: Please review our Terms of Use and License before using this tool.
📝 Updates: See the Changelog for recent changes and version history.

Identify the most cost-efficient exchange by comparing spend and receive amounts from simulated order execution, using real-time order book data and fees.

• Multi-Exchange Support: Compare trade results across Binance, Bybit, Coinbase, and OKX.
• Configurable Order Inputs: Spot Market Orders, with order size configurable in either the base or quote asset, and symbols selectable from any available on the chosen exchange.
• Live OrderBooks side-by-side: Live streaming of order books from multiple exchanges.
• Trade Cost (Spend) Simulation: Simulate order execution to calculate the total trade cost, taking into account slippage and trading fees.
• Trade Receive Simulation: Simulate order execution to calculate the net amount received from a trade.
• Realistic Fee Modeling: Take into account taker fees, user tiers, and trading pair discounts.
• Tick Size Normalization: This tool queries exchanges' APIs for the trading pair's tick size (minimum price increment), then normalizes all order books to the largest tick size for fair and consistent price comparisons across exchanges.
• Live Best Exchange Badge: Automatically highlight the best exchange for your specific trade.
• Smart Startup Selection of Order Inputs: On first tool load, to better reflect real-life trading behavior:
  • Trading Pair: Random selection from a predefined list of popular cross-exchange pairs.
  • Order size: Random selection within a realistic, market-based range.
  • Order side: Probabilistic selection of the BUY/SELL side based on market sentiment derived from short-term candlesticks.

• Node.js 18.x or higher
• npm, pnpm, or yarn

# Clone the repository
git clone https://github.com/binance/crypto-trade-analyzer.git

# Navigate to project directory
cd crypto-trade-analyzer

# Install dependencies
npm install

# Start development server
npm run dev

# Start development server with hot reload
npm run dev

# Build for production
npm run build

# Preview production build locally
npm run preview

# Run ESLint
npm run lint

# Format code with Prettier
npm run format

• Frontend: React and TypeScript (Vite)
• Styling: Tailwind CSS
• Code Quality: ESLint, Prettier, Husky, lint-staged
• WebSocket: Native WebSocket connections for real-time data
• State Management: React hooks

Cached entries share a common shape:

{
  "ts": 1731345678901, // timestamp (ms)
  "data": 123.45, // cached value
  "meta": { "source": "coingecko" }, // optional metadata
}

• ts — timestamp (ms) used for freshness checks
• data — the cached value
• meta — optional metadata (e.g., source, etag, version)

Notes

• If localStorage is unavailable (private mode/restricted contexts), the app falls back gracefully and refetches as needed.
• Stablecoins are returned 1:1 to USD and typically aren’t cached.

• No ads, remarketing, or personalization (explicitly disabled).
• No fingerprinting or cross-site identifiers from our code.
• No analytics tracking if Do Not Track (DNT) is enabled.
• No emails, names, wallet addresses, exchange account IDs, order IDs, or other sensitive identifiers are persisted.
• No custom cookies for analytics.

This app uses Google Analytics 4 (GA4) to understand usage patterns and improve UX.

• The analytics runs client-side; events go directly from your browser to GA4.
• The app’s own caching and preferences live in your browser’s storage.

The app uses the browser’s storage to reduce API calls and speed up startup.

• Consent & events implementation: src/utils/analytics.ts.

• To ship without analytics, don’t load GA and/or pre-set:

  localStorage.setItem('GA4_ANALYTICS_CONSENT_KEY', 'denied');

The tool uses a few public APIs to stay lightweight and up-to-date:

• Pairs per exchange:

  • CoinPaprika is used to retrieve trading pairs for most exchanges. These results are normalized to BASE/QUOTE and cached in localStorage.
  • Coinbase special case: we query Coinbase Exchange’s own REST API (/products) instead of CoinPaprika. CoinPaprika’s data source is still based on the old “Coinbase Pro”, which lists pairs not tradable on api.exchange.coinbase.com.
    Using Coinbase’s official endpoint ensures the list of pairs always matches the real, unauthenticated market data API we use elsewhere.

• USD price equivalents: We fetch coin to USD conversion rates from CryptoCompare and CoinGecko. Price results are cached for 60s to reduce API usage and improve responsiveness.

• Market Signals:
  To generate a realistic default order side (BUY or SELL), the app uses Coindesk’s Market Data API. It fetches recent hourly open/close prices and computes short-term sentiment by analyzing price movements. The model blends long-term and recent interval ratios to derive probabilistic BUY/SELL weights. These results are cached briefly and used only for startup defaults — they never override explicit user choices.

├─ src/
│  ├─ app/
│  │  ├─ components/          # Reusable UI components
│  │  ├─ hooks/               # React hooks (e.g., useExchangeEngine)
│  │  ├─ icons/               # Icon components/assets
│  │  ├─ pages/               # Application pages
│  │  ├─ providers/           # Context providers
│  │  ├─ App.tsx              # App shell
│  │  └─ types.ts             # App-level types
│  ├─ core/                   # Interfaces, order-book & fee config
│  ├─ exchanges/              # Exchange adapters (binance, bybit, coinbase, okx, …)
│  ├─ utils/                  # Bucketize, formatting, helpers

We welcome contributions! Here's how to get started:

1. Fork the repository and create a feature branch
2. Make your changes
3. Run npm run format and npm run lint
4. Open a pull request

To add support for a new exchange, implement the following interface:

• watchLivePair() / unwatchLivePair() — manage WS and local book with resync
• onLiveBook() — push book updates to the UI
• getPairSymbol() — standardized trading pair mapping
• getTickSize() — REST once; cache per (exchange, trading pair)
• calculateCost() — call the shared calculator (bucket first if priceBucket is provided)
• disconnect() — clean shutdown

• Follow TypeScript best practices
• Use meaningful commit messages
• Ensure all CI checks pass

The application respects exchange API rate limits through:

• WebSocket connections for real-time data (preferred)
• Safe reconnection with jitter/backoff
• Request throttling for REST API calls
• Local caching to minimize API requests

This tool is designed for educational and research purposes. Trading cryptocurrencies involves significant risk, and past performance does not guarantee future results. Always verify costs independently before making trades. Exchange fees and policies may change without notice. You may view the full disclaimer in the Terms of Use.

This project is licensed under the Binance Source-Available and Non-Commercial License v1.0.
You may view the full text in the LICENSE file.