Add interactive demo

[Krinkle]

I currently use one of two approaches.

1. Existing demo with console hackery:

• https://qunitjs.com/
• Open "Browser Result" frame as its own tab (e.g. right-click view iframe, or cmd-click "QUnit Example" title link)
• Open browser console
• Page code sample (this fragily depends on being able to run additional tests on an HTML page, even after it has already completed the run, which kinda works but not really and is not actually documented or supported, and causes confusing errors in case of genuine failures).

2. CodePen / JSFiddle etc.

• Live edit at https://codepen.io/Krinkle/pen/vYXzMMo?editors=0010
• Fork first, if intending to share.

We either create a basic "Demo" page ourselves with an editable JS area and see a live demo (with the current example as starting default boilerplate), or we could embed a forkable demo that we host with something like CodePen.

Another option might be to do what MDN did (or used to do, they recently changed frontends and have not yet implemented it on the new side, ref mdn/yari#1428). The way MDN worked is that they render a locally owned iframe and source code preview, without third-party code or embeds. Much like the demo we have on our home page today. And then have a button to instantly create a new CodePen draft with the contents of the demo pre-filled. That seems like a pretty good trade-off. Especially because it means the demo will still render fast and independent of third parties, and it also means we don't have to keep a remote resource up-to-date during releases. Instead, the contents are transferred at runtime via a POST request if the user pressed the button.

MDN's old code for this, at:
https://github.com/mdn/kuma/blob/e145cf3c708326d7da57883b32dda9ab70cd1408/kuma/javascript/src/live-examples.js#L94-L105