Threads Constellation: Turning Conversations Into a Night Sky

Most social apps show conversations as one loooong feed. Scroll, scroll, scroll…

So I asked myself: what if a conversation network looked like a night sky? 🌌

That’s Threads Constellation. Each post becomes a star, replies branch out like trails of light, and whole conversations form their own little galaxies. Instead of scrolling through it, you get to explore it.

🔎 Overview

• Goal: Turn Threads conversations into a searchable, interactive star map.
• Core stack: Cloudflare Pages, Pages Functions, Workers, D1, and plain JavaScript with HTML Canvas.
• Special feature: Match a conversation to a real constellation figure when their visible star counts line up and their connection patterns look alike.
• Best part: Every star is still a real post or reply. It’s pretty, but you never lose the actual conversation ✨.

🗺️ How Everything Connects

The nerdy view

flowchart TB
    Visitor["Visitor"] --> Pages["Cloudflare Pages: HTML, CSS, JS"]
    Pages --> Canvas["Interactive Canvas sky map"]

    Canvas -->|GET /api/constellation| Proxy["Pages Function: API proxy"]
    Proxy --> Worker["Cloudflare Worker"]
    Threads["Threads API"] --> Worker
    Worker <--> D1[("Cloudflare D1")]

    Canvas -->|GET /api/constellation-catalog| Catalog["Pages Function: sky catalog"]
    Catalog --> Sky["D3-Celestial: J2000 constellation lines"]

The simple view: Threads data turns into connected stars. Then the app peeks at a catalog of real sky patterns to see if any conversation can take the shape of a constellation you’d recognize.

🔨 From Posts to Stars, Step by Step

1. Grab the conversations. A Cloudflare Worker with a D1-backed API makes Threads posts, replies, and how they’re connected available to the site.
2. Load the map. The browser calls /api/constellation through a Pages Function. Since the request stays on the same origin, no annoying CORS issues 🙌.
3. Build the stars. Posts and replies become nodes, and reply relationships become lines. Anything without visible text gets left out, and each conversation is grouped together.
4. Look for a sky match. A second endpoint, /api/constellation-catalog, serves cached astronomy data. To match, a conversation needs the exact same number of nodes as a real constellation figure. Then the app compares connections and branching to pick the closest fit.
5. Draw it! Matching groups take the real figure’s projected positions, with faint gold reference lines. Everything else gets a natural, branching layout.

Heads-up: the data refreshes every 30 seconds while the tab is visible. It’s regular polling, not a live stream.

🛠️ Behind the Scenes: The Sync Worker

This is the part nobody sees, but I’m kinda proud of it 🤭.

Visitors never talk to the Threads API directly. Instead, a Cloudflare Worker runs on a Cron schedule every minute and does the heavy lifting:

• It plays nice with rate limits. Each sync has a budget of 45 Threads API requests (fetching up to 20 posts and 50 replies per page), and 8 of those are saved for backfilling older posts so the history slowly fills in over time.
• It merges, then packs. New data is merged into the existing sky, then the whole snapshot is gzip-compressed and split into chunks of up to 1.5 MB to fit nicely in D1.
• It skips pointless writes. Each snapshot gets a SHA-256 hash. If nothing changed since last time, nothing gets rewritten. Lazy in a good way!
• It serves from cache. The public /api/constellation response is cached at the edge for 10 seconds, so lots of visitors don’t mean lots of database reads.

The database itself is tiny and simple: one table that points to the latest snapshot, one for the compressed chunks, and one for sync state.

✨ What You Can Do

• Wander around: Drag to pan, scroll to zoom, and double-click to fit the whole map.
• Follow the replies: Posts and replies have different star styles, and lines show how they connect.
• Search and jump: Look up usernames, posts, replies, or text, then smoothly zoom right to it. Press / to open search.
• Uncover sky patterns: Click a clue like The Hunter and boom, Orion (Ori) shows up.
• Read the real thing: Click a star to see the author, text, timestamps, and a Threads link when available.

🤔 Decisions I Made (and What They Cost)

💸 Cost & Performance

The site is mostly static, so there’s no always-on web server eating money in the background. I also made a few choices to avoid doing the same work over and over:

• Cache the astronomy catalog: Constellations don’t exactly change every day (lol), so the catalog uses browser and edge caching.
• Only refresh when it matters: The map polls while you’re looking at it, and checks again when you come back to the tab.
• Keep the frontend light: Plain HTML, CSS, JavaScript, and Canvas run the whole interface. The usage-based costs come from API requests, Worker execution, and D1 operations.

Real cloud costs depend on traffic and data, so I can’t give you an honest flat monthly number without actual usage.

🔭 Wait, Are the Matches “Real”?

Short answer: it’s art, not astronomy 😄.

The map is a creative visualization, not a scientific claim that online conversations naturally form star patterns. It uses equal node counts and similar graph structure to place conversations onto figures you’d recognize. If nothing matches, the conversation still shows up as its own organic star cluster. Every chat gets to shine!

The astronomy reference comes from D3-Celestial (BSD-3-Clause). Also, a fun fact: the International Astronomical Union recognizes 88 constellation names and sky regions, but there’s no single official way to draw their stick-figure lines.

💬 Closing

Threads Constellation makes reply chains easier to explore and way more fun to look at. Simple idea, creative twist: turn a conversation graph into a night sky, without losing the real stories behind the stars.

Go stargazing! 🌠