We’ve had realtime features on CodePen for ages. Back when it was pretty damn hard. Our Collab Mode is an obvious one, where users can code together. (This “just works” in the 2.0 editor, it’s not called anything special.) That and Professor Mode used to have realtime chat (until we pulled it because very few people used it). We went through iterations of this including our own implementations and using services like PubNub.

Code collaboration in realtime is particularly difficult. We used FirePad/FireBase for a while for this, and honestly that was a nice abstraction. Increasing the difficulty though, we need to layer on additional needs like syncing settings, presence, and just arbitrary message delivery (e.g. “a new build is ready!”). We used Ably for much of this for quite a while.

These days, our whole realtime system integrates with our caching layer, goes over the network using standard web sockets to our beefy Go servers, and is integrated with CRDTs/Y.js to keep everybody looking at the same thing. Plenty of open source software at work, but no more third-party services. This means lower operating costs and a simpler architecture. The cost is that problems are, well, our problems.

Time Jumps

Video Subscribe on YouTube