I also posted a link to the playground yesterday noon CEST on HN, but the post didn't get much traction and went pretty much unnoticed into the eternal archives of HN. As I still think this playground could be of great help to many RxJS beginners and I put quite much effort into it, I posted it again to see whether a repost would share the same fate.
It's also how sequence diagrams are normally drawn, and is how I'd normally think about running through them, so I think it's a great idea to show Rx streams. However, I was kind of confused from playing with the interface a bit and trying to track what was happening, but I think it's an excellent first start to see how everything interacts!
One suggestion for trying to help visualize the interactions between different streams, I'd like to see onion skinned lines attaching events between streams. ie as the timeline hits the moment an event triggers between two streams you draw a horizontal line between the events and then as time goes on the line fades (to a controllable limit). Then you'll be able to see all the actual interaction lines between streams without cluttering the view.
I don't understand how the fading should work, as the visualization is not realtime but rather abstracts time away.
The fading doesn't have to work based on wall clock time. I'd probably start off with trying to make it fade over a distance of 10% of the screen height along the vertical time axis. But you could come up with a bunch of different ways to model your 0-1 fade boundaries.
Here are some gists where I used them together to explore the interactions; I was particularly interested in Ix's `batch`:
Note that Ix is undergoing a rewrite that brings more parity with Rx re: how the operators are organized: