Introduction

electron-messageport-trpc is a transport layer that connects tRPC v11 clients and routers through Electron’s MessagePort API.

It is for Electron apps that already want the tRPC model — routers, procedures, inference, middleware, and subscriptions — across process boundaries, backed by MessagePort connections between Electron processes.

What This Library Adds

Electron gives you IPC primitives. tRPC gives you typed routers and clients. This library connects the two without asking you to design a custom channel protocol for every procedure.

| Capability | What the package provides | |---|---| | tRPC v11 over MessagePort | Queries, mutations, subscriptions, inference, middleware, and errors across Electron processes | | Utility processes | Main-to-utility and renderer-to-utility topologies |

Supported Topologies

• Renderer to main: the default Electron app shape. A renderer tRPC client calls a router hosted in the main process.
• Main to utility: the main process calls a router hosted in an Electron utility process.
• Renderer to utility: the main process brokers the port, then the renderer talks to the utility process without main handling each request.

How It Works

The library uses Electron’s MessageChannelMain to establish direct MessagePort connections between processes. A lightweight message protocol carries tRPC requests and responses over these ports.

Renderer                Main Process
  |                         |
  |  MessagePort (port1)    |
  |<========================>|
  |  tRPC requests/results  |
  |                         |

1. The main process creates a MessageChannelMain and sends one port to the renderer via webContents.postMessage.
2. The preload script receives the port and exposes it to the renderer via contextBridge.
3. The renderer uses the port as a tRPC link, so query, mutation, and subscription procedures use the same typed client API as the rest of your tRPC code.

Architecture Overview

┌─────────────┐   MessagePort   ┌──────────────┐
│  Renderer   │<===============>│  Main Process │
└─────────────┘                 └──────┬───────┘
                                       │ MessagePort
                                       │
                               ┌───────┴────────┐
                               │ Utility Process │
                               └─────────────────┘

In advanced topologies, the main process can also hand a port off to a utility process so the main thread stays out of the request path.

Next Steps

• Installation — add the package to your project
• Quick Start — set up a working renderer-to-main example in minutes