But I have no idea how to do something similar on the HTML side. I now have a single large (IMO) HTML file with lots and lots of elements in them, organized only by divs.
My gut feeling says that the main page should only contain overall layout, plus tags that say "the drawing UI goes here". While the actual HTML for the drawing UI is in some other file, where I can maintain it together with the drawign code behind it. So the main html page knows where the subparts' UIs are, the cooperation code knows the interface of the subparts, and the details of the subparts can change while the overall setup stays the same.
Is there some good way to do that? I have considered programmatically inserting the elements into the DOM, or using innerhtml to insert the code, but both feel clumsy.