whatisgithub

What is hl-orderbook-peel?

quicknode/hl-orderbook-peel — explained in plain English

Analysis updated 2026-05-18

0TypeScriptAudience · developerComplexity · 2/5Setup · easy

In one sentence

An interactive visual tool that lets you slide between four levels of detail in a live Hyperliquid crypto order book.

Mindmap

mindmap
  root((Orderbook Peel))
    What it does
      Visualizes order book levels
      Slider from L1 to L4
      Shows order ownership
    Tech stack
      TypeScript
      Node relay server
      Vite Canvas2D
    Use cases
      Learn order book concepts
      Explore simulated market
      View live Hyperliquid data
    Audience
      Developers
      Trading learners
    Setup
      Node.js 22 plus
      npm install two folders
      Sim mode needs no account

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Learn what order book levels L1 through L4 mean by interactively peeling between them.

USE CASE 2

Run the tool in simulation mode to explore order book visuals without needing a trading account.

USE CASE 3

Connect it to a real Quicknode Hyperliquid endpoint to visualize genuine live market data.

What is it built with?

TypeScriptNode.jsVitegRPCCanvas2D

How does it compare?

quicknode/hl-orderbook-peel0xradioac7iv/tempfs52191314/web-agent-proxy-sdk
Stars000
LanguageTypeScriptTypeScriptTypeScript
Setup difficultyeasymoderatemoderate
Complexity2/53/54/5
Audiencedeveloperdeveloperdeveloper

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · easy Time to first run · 5min

Runs fully in simulation mode with no credentials, live mode needs a Quicknode Hyperliquid gRPC endpoint and token.

The README does not state a license for this project.

So what is it?

This project is an interactive visual explainer for understanding order books, the live lists of buy and sell orders that drive trading on an exchange. It focuses specifically on order book data from Hyperliquid, a crypto trading platform, and demonstrates how the same underlying data can be shown at four different levels of detail, from the simplest view down to the most detailed. A slider lets you drag between these levels and watch the visualization morph in real time. The four levels build on each other. The simplest level shows only the current best price someone is willing to buy or sell at. The next level up groups all orders at each price into a single bar, showing total size, which is what most trading apps display. The third level breaks that bar apart into the individual orders sitting inside it, though still anonymous. The fourth and most detailed level colors each order by the wallet that placed it, so you can see specific traders, spot one wallet stacking orders, or notice suspicious orders that appear and disappear quickly. Under the hood, the tool has two parts working together. A small backend server connects to Quicknode's data feed for Hyperliquid and passes a simplified version of the order book to a browser based frontend over a local connection, since browsers cannot talk to this kind of data feed directly. The frontend then draws everything on a canvas. The project can run entirely without any account or credentials using a built in simulated market with fake but realistic looking data, or you can connect it to a real live Quicknode account to see genuine market data. Setting it up locally requires a fairly recent version of Node.js and running a couple of install commands for both the server and web pieces. The README notes this is an unofficial project built on top of Quicknode's own data service, and does not mention a license.

Copy-paste prompts

Prompt 1
Help me run this project locally in simulation mode using npm run dev.
Prompt 2
Explain the difference between L2 and L3 order book data as shown in this README's table.
Prompt 3
Walk me through connecting this app to a real Quicknode Hyperliquid gRPC endpoint.
Prompt 4
How does the relay server keep my Quicknode token out of the browser?

Frequently asked questions

What is hl-orderbook-peel?

An interactive visual tool that lets you slide between four levels of detail in a live Hyperliquid crypto order book.

What language is hl-orderbook-peel written in?

Mainly TypeScript. The stack also includes TypeScript, Node.js, Vite.

What license does hl-orderbook-peel use?

The README does not state a license for this project.

How hard is hl-orderbook-peel to set up?

Setup difficulty is rated easy, with roughly 5min to a first successful run.

Who is hl-orderbook-peel for?

Mainly developer.

Open on GitHub → Ask about another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.