Rotate me! This website works best in landscape mode.

BitcoinRain.io

This website is a live visualisation of the transactions and blocks received by a node on the bitcoin network.

Blue Raindrop = Transaction

= Transaction Purple Raindrop = Segwit Transaction

New transactions this node receives enter its memory pool. They are held in the node's memory for up to 72 hours.

The node also recevies blocks (every 10 minutes on average). A block takes transactions from the memory pool and adds them them to the blockchain.

Keyboard

Left/Right Arrow = Change Raindrop Size (between Bytes and Transaction Value)

= Change Raindrop Size (between Bytes and Transaction Value) Up/Down Arrow = Change Currency

= Change Currency Enter = Show/Hide Labels (visualisation is a bit faster without labels)

About Me

My name is Greg Walker, an this is my first attempt at real-time visualisation. I'm also currently working on learnmeabitcoin.com, which is a website with simple documentation for bitcoin, including a rudimentary blockchain explorer. I occasionally like to play poker with bitcoin in my spare time.

Two things I like:

Comments for improvements: greg[at]learnmeabitcoin[dot]com or Twitter

or Twitter Donations for beer: 1RainRzqJtJxHTngafpCejDLfYq2y4KBc (donations are highlighted in the visualisation)

FAQ:

What's the use of this?

It's cool to watch bitcoin transactions as they're happening. You can see the current transaction rate, as well as how much money is being moved per second.

Personally, I use it to watch and wait for the next block to get mined.

Are these transactions really live?

Yes. I do add a tiny delay between transactions to create a smoother rain effect, but aside from that this website is showing every new transaction on the bitcoin network as my node receives it.

Why do transactions bounce off the memory pool?

Because I thought it would look cool, so it doesn't symbolise anything. However, I did make transactions bouncier if they're moving a high quantity of bitcoins in a small number of bytes of transaction data (i.e. more "efficient").

Where's the code for this website?

To summarize how this website works:

I'm using Ruby to connect to my node so I can receive all the transactions and blocks it is relaying.

I also send the node RPC requests to get extra information from it.

I'm using websocketd turn this stream of data in to a WebSocket server.

I use Javascript in the browser to read from the websocket, and p5.js to create the visualisation.

And where's that live websocket feed?

Here: http://bitcoinrain.io:8082

Don't use it for anything serious though as I'm likely to change it.

Credits

Thanks to Daniel Shiffman for the p5.js tutorials.

The font is White Rabbit by Matthew Welch.

I found this simple color picker particularly handy.

BitListen.com was an inspiration for working with live bitcoin data in the browser.