Shopify

remote-dom: Render Sandboxed UI in the Host Page

Remote DOM synchronizes a UI tree created in a sandboxed JavaScript environment with the real DOM on a host page. It suits teams that need remote code to render a controlled set of custom elements, including from a Web Worker.

Stars
1.3k
Forks
92
Stars, last 8 days
+0
Last commit
4 days ago
Contributors
46

Our take

Activeregular commits and releases

Health score

49/100

How it is scored
Activity
65
Community
67
Issues
21
Pull requests
42

+0 stars in the last 8 days

  • Merges more pull requests than 80% of the projects we track
  • Slower to merge pull requests than 96% of the projects we track

Remote DOM is an actively maintained, MIT-licensed synchronization library with a broad contributor base, though the measured lack of recently closed issues makes its issue-resolution pace hard to assess.

Good fit if

  • You need a remote iframe or worker to describe UI while the host controls the actual rendered elements and permitted members.
  • Your team can integrate both host and remote environments and wants framework options beyond the core TypeScript package.
  • The MIT license fits your distribution needs, and you can evaluate the open issue queue alongside the project's regular commits and releases.

Look elsewhere if

  • You need a turnkey extension sandbox or a complete security boundary. Remote DOM synchronizes UI; your application must configure and operate the sandbox and host policy.
  • You need the library to handle issue fixes on a demonstrated schedule. The project has recent commits and releases, but the supplied health data records no issues closed in the measured 90-day period.
All health signals
Last commit2026-10-02 (4 days ago)
Commits, last 90 days89
Releases, last 12 months8 (latest @remote-dom/polyfill@1.6.0, 2026-09-22)
Contributors46 (top contributor: 48% of commits)
Issues closed, last 90 days0
Project age6 years

Checked on 2026-10-07 with the GitHub API.

Overview

Remote DOM lets JavaScript running in a separate environment create a UI tree that a host page renders as real DOM elements. This separates UI-producing code from the main page while giving the host control over which elements and members the remote environment may use.

The project is most useful when an application needs to run extensions or other potentially untrusted UI code in an iframe or Web Worker. It is a synchronization layer rather than a complete sandbox or component framework, so the host and remote sides still need to be integrated by the application.

Key Features

  • Synchronizes remote DOM mutations with elements rendered in the host page.
  • Supports iframe and Web Worker environments, with a minimal DOM API polyfill for non-DOM contexts.
  • Lets hosts restrict which element names, attributes, events, methods, and properties remote code can access.
  • Provides RemoteElement to define how custom-element members are communicated across environments.
  • Includes companion packages for React, Preact, and signal-based rendering.
  • Offers examples combining the core with vanilla JavaScript, htm, Preact, React, Svelte, and Vue.

Use Cases

  • A web application team can isolate an extension's UI code in an iframe while allowing it to render only approved custom elements.
  • A team running UI logic in a Web Worker can use the polyfill and send its remote UI updates to the main page.
  • Component-library authors can expose host-rendered custom elements to remote clients through an explicit member allowlist.
  • Teams using React or Preact can integrate remote UI trees with the project’s framework-specific companion packages.

What you need

Detected in the repository

  • Node.js (from package.json)
  • A test suite and automated checks on GitHub Actions

License in plain words

MITpermissive

  • Commercial use: yes
  • Modify and redistribute: yes
  • You must keep: the copyright and license notice
  • Share your changes: no

A summary, not legal advice: the LICENSE file is what applies.

Getting Started

Install the core package:

npm install @remote-dom/core

See the README and @remote-dom/core documentation for setup and examples.

Alternatives

  • mcp-ui: mcp-ui renders sandboxed interfaces from MCP tools in compatible hosts, while remote-dom synchronizes a remote UI tree of custom elements with a host DOM.
ProjectLanguageLicenseStarsStatus
remote-domTypeScriptMIT1.3kActive
mcp-uiTypeScriptApache-2.05.2kQuiet

Considerations

  • Integration requires a host environment that renders the real elements and a remote environment that creates the mirrored tree. Choose and configure the communication mechanism, such as iframe messaging or worker messaging, for your application.
  • The README describes element allowlisting as a way to limit remote UI capabilities. Teams should define and review that policy, rather than treating synchronization itself as a security guarantee.
  • Node.js is listed as a runtime requirement. The repository includes CI and tests, and its measured activity indicates ongoing maintenance, but the supplied data reports no issues closed in the recent 90-day window.
  • Companion packages cover selected integrations, including React and Preact; the core project does not remove the need to connect the host and remote sides in your chosen stack.

Found this useful?

Share it with someone who would like remote-dom.

Comparisons