Rendering

Web components may use different rendering mechanisms that may need to be interoperable.

Example strategies:

• If a web component uses a triple store as a central state, it may subscribe to changes, which then trigger a rerender, e.g. with rdflib.js, listening for added or new triples using a particular subject
• If state is instead passed from parent to child through properties or attributes of components, web components might use a virtual dom to control rerender

In other component systems:

• SolidOS uses rdflib.js' store.updater.addDownstreamChangeListener. When the remote resource is changed a notification is received via Websocket, the resource is reloaded and a rerender is triggered.
  • see https://github.com/search?q=org%3ASolidOS%20addDownstreamChangeListener&type=code
• https://ldo.js.org defines a useSubject react hook. Internally, it uses a subscribable RDF dataset that emits events for specific quad matches, which triggers rerender of the react component, apparently by updating a forceUpdateCounter state variable.
  • https://github.com/o-development/ldo/blob/main/packages/subscribable-dataset/src/SubscribableDataset.ts
  • https://github.com/o-development/ldo/blob/deb21048be7548f1cf1c81f6e7887e3ada410223/packages/solid-react/src/util/TrackingProxyContext.ts#L40
  • https://github.com/o-development/ldo/blob/main/packages/solid-react/src/useSubject.ts