The core idiom I've used for years is deliberately tiny: fully encapsulated custom Web Components that simply re-render when matching an attribute and `window.state` changes. Data model is simply:

  window.state = new Proxy({}, {
    set(target, key, value) {
      target[key] = value
      document.querySelectorAll(`[data="${key}"]`)
        .forEach(el => el.render?.())
      return true
    }
  })

handles reactivity.. https://github.com/digplan/vanilla-light