DEV Community

Cover image for Stop building AI Wrappers. Build AI "Injectors" instead.
Progfinity
Progfinity

Posted on

Stop building AI Wrappers. Build AI "Injectors" instead.

Chat UI is dead. If your "AI App" makes me switch tabs to use it, I’m deleting it.

We have enough wrappers. What we need are Injectors. Tools that modify the DOM of the apps we already live in (WhatsApp, Gmail, LinkedIn).

I just built one (Reple AI). Here is the hard truth about why it’s better, and how to do it without breaking the web.

The Problem: "Context Switching"
Every time a user has to Copy -> Switch Tab -> Paste -> Prompt -> Copy -> Switch Back... a startup dies. Injectors reduce 6 steps to 1 click.

The Spec (How to actually build it)

  1. Isolate with Shadow DOM Don't let LinkedIn's CSS bleed into your app.

  2. Win the "Z-Index War" Modals usually sit at z-index: 9999. Set your injector to 2147483647 (Max 32-bit integer). DOM dominance established.

  3. Don't Block the Send Button I used MutationObserver to find the chat footer and inject a sibling container. Never overlay. Always push.

The Verdict
Stop building destinations. Build augmentations. The next billion-dollar AI company won't be a website. It will be a

injected into someone else's.

(Code snippet for the Shadow DOM injection is below. Steal it.)

const shadow = container.attachShadow({ mode: 'open' });
// Your React App lives here, safe from global styles.

Top comments (0)