Tokamak icon indicating copy to clipboard operation
Tokamak copied to clipboard

Potential `DOMScene` design to support incremental rewrites

Open MaxDesiatov opened this issue 3 years ago • 0 comments

Maybe it could work with Scene, where you have a DOMScene type, which provides its host node, and it can take a scene as the child. You could then have one DOMScene for each part of your app you're replacing:

struct ProfileScene: Scene {
  var body: some Scene {
    DOMScene(node: { ... }) {
      WindowGroup { ... }
    }
  }
}
struct SearchScene: Scene {
  var body: some Scene {
    DOMScene(node: { ... }) {
      WindowGroup { ... }
    }
  }
}
struct Reddit: App {
  var body: some Scene {
    ProfileScene()
    SearchScene()
  }
}

Where DOMScene is something like:

struct DOMScene<Content: Scene>: Scene {
  let body: Content
  let nodeQuery: () -> JSObjectRef?

  init(node nodeQuery: () -> JSObjectRef?, @SceneBuilder body: Content) { ... }
  init(id: String, @SceneBuilder body: Content) { ... }
}

Then when App goes to mount the scenes, it can attempt to find the node with the nodeQuery function, and if it exists it computes the body of the DOMScene and puts it in the host node. We could use the MutationObserver API to be notified when the element has been added, and rerun the nodeQuery to check if the element exists yet.

Originally posted by @carson-katri in https://github.com/swiftwasm/Tokamak/issues/224#issuecomment-665991403

MaxDesiatov avatar Aug 01 '20 17:08 MaxDesiatov