Embetty: Privacy-Preserving Embeds
Embetty is a self-hostable solution for displaying remote content like tweets or videos without compromising your users' privacy. It works by replacing standard embeds with a privacy-conscious placeholder. The actual content is only loaded from the original source after the user explicitly interacts with it.
This approach prevents external services from tracking your users, collecting their data, or setting cookies until they decide to engage with the content.
Core Architecture
Embetty consists of two main parts that work together:
-
@embetty/server
: A Node.js backend server that acts as a proxy. It fetches the necessary data (like tweet text, video thumbnails, etc.) from platforms like Twitter, YouTube, and Vimeo. This prevents the user's browser from making direct requests to these services on page load. -
@embetty/component
: A lightweight frontend library that provides Web Components (e.g.,<embetty-tweet>
,<embetty-video>
). These components display a placeholder with the data fetched by the server. When a user clicks on the placeholder, it's replaced with the standard platform embed (e.g., aniframe
).
Key Features
- Privacy First: No requests are sent to third-party services until the user clicks the embed.
- Self-Hostable: You run your own
embetty-server
, ensuring full control over the data proxy. - Wide Platform Support: Supports Tweets, Mastodon posts, and videos from YouTube, Vimeo, and Facebook.
- AMP Support: Provides AMP-compatible versions of embeds for accelerated mobile pages.
- Lightweight: The frontend component is small and loads quickly.
- Customizable: The look and feel can be customized with CSS variables.