Welcome to the Stream 🌊

Hey there! Welcome to the official documentation for non-activity.stream.

If you're tired of the corporate, walled-garden approach to social media—and even the slightly-less-corporate-but-still-heavy "orthodox" ActivityPub approach—you're in the right place.

We're building a fast, offline-first, anti-corporate social stream that you actually own. It's emergent, it's fun, and it's built entirely on standard web components.

What is this thing?

At its core, non-activity.stream is a set of framework-agnostic UI components (like <non-activity-stream>) that know how to render ActivityStreams 2.0 data.

But it's more than just UI. It's a philosophy:

• Bring Your Own Backend: We don't want to host your data. You can plug these components into Mastodon, a local SQLite database, or a Raspberry Pi under your desk.
• Offline-First: The web is flaky. Your social feed shouldn't be. We use robust local caching (IndexedDB) so you can read and interact even when you're on a train.
• Lightweight: No massive server infrastructure required. Just drop a script tag on a page and you're good to go.

The "Hello World"

Want to see it in action? It's literally just HTML.

<script type="module" src="https://unpkg.com/@nonactivity.stream/elements"></script>

<!-- A dumb, read-only stream -->
<non-activity-stream id="my-feed"></non-activity-stream>

<script>
  const feed = document.getElementById('my-feed');
  
  // Feed it standard ActivityStreams 2.0 data!
  feed.collection = {
    "@context": "https://www.w3.org/ns/activitystreams",
    "type": "OrderedCollection",
    "totalItems": 1,
    "orderedItems": [
      {
        "type": "Note",
        "content": "Hello, decentralized world! 🌍",
        "published": "2026-02-19T12:00:00Z"
      }
    ]
  };
</script>

Where to next?

• Getting Started: Learn how to install and use the components in React, Next.js, or plain HTML.
• The Components: Deep dive into <non-activity-stream> and <non-activity-note>.
• Theming: All CSS custom properties — card backgrounds, thread lines, typography, accent color, and dark mode patterns.
• Controllers & Data: Learn how to make the "dumb" UI smart by connecting it to real data sources.
• Deep Linking: Discover how we use Multibase SHA-256 hashes for deterministic, serverless deep linking.

Let's build a better web together. ✊