First off, this is very cool - thanks for sharing!
But… man it’s slow to load! And that kind of delay on load can really affect the user experience. I haven’t looked at your code in any real detail and can’t comment on ways to speed it up there. Fortunately, there are ways to speed up the presentation of the embedded output. Here’s an alternate approach to the embedding that renders much more quickly:
The basic idea is to use Observable’s embed tool to generate the embedding code for you. Then place pre-rendered content into each of those DIVs. That pre-rendered content is replaced by the Inpector once it’s ready.
For example, if the embed tool generates something like so:
replace that with
For this example, I simply got the HTML CODE using the
Copy > Outer HTML contextual menu from my browser, though there might be a better way to get a handle on that - if you’re familiar with the material.
One caveat: This only affects the presentation. The cells aren’t actually live until there rendered from the code. Having said that, it’s generally a big improvement for user experience.