Integrating Bluesky Comments as a Static Site Solution

The challenge of adding dynamic features to a static site is a familiar one for developers who value the performance and simplicity of static generation. Hosting comments traditionally requires a backend service, which introduces complexity, cost, and operational overhead. For a blog built with React Server Components and Parcel, the author sought a solution that could bridge this gap without compromising the site's static nature.

{{IMAGE:1}}

The core problem is architectural: a static site hosted on a CDN has no server-side execution environment to handle dynamic requests. While services like Disqus or giscus (which uses GitHub Discussions) exist, they often come with trade-offs in terms of performance, privacy, or platform lock-in. The author's search for an alternative led to a blog post by Cory Zue demonstrating the integration of Bluesky comments, which presented a compelling model. By leveraging Bluesky's public API, the author could offload the entire burden of user authentication, data storage, spam moderation, and hosting to a dedicated social platform, while still displaying the conversation directly on their own site.

Bluesky's appeal in this context is twofold. First, its foundation on the AT Protocol represents an open, decentralized social graph, offering a degree of resilience against the whims of a single corporate entity. This contrasts sharply with platforms like X (formerly Twitter), which have become increasingly hostile to third-party developers and API access. Second, as a full-featured social network, Bluesky is inherently better suited for fostering public conversation than a platform like GitHub, which is designed for code collaboration rather than general discussion.

The implementation, while conceptually straightforward, required careful technical decisions. The author initially explored using Cory Zue's bluesky-comments package but opted to build a custom solution. This decision was driven by a desire for stylistic integration with the existing site and the flexibility to add features in the future. The resulting codebase is remarkably lean, totaling approximately 200 lines of code between UI components and API functions.

The architecture hinges on a simple data flow. Each blog post's metadata, validated with a Zod schema, includes a bskyPostId field that links the article to a specific Bluesky post. When a page loads, the frontend fetches the thread of replies for that post using the Bluesky API's getPostThread endpoint. The author chose to manage this data-fetching logic with TanStack React Query, a library that elegantly handles loading states, error boundaries, and caching, abstracting away the complexity of manual fetch and useEffect management.

Parsing the Bluesky API response presents its own challenges. The platform supports rich content, including markup, mentions, and attachments. For the initial implementation, the author made a pragmatic choice to extract only the plain text content from each reply, prioritizing simplicity over a full-fidelity rendering of every post's formatting. The UI for displaying threaded comments was also designed with mobile readability in mind, using indentation and a left border to visually distinguish reply threads. The final component includes a link back to the original Bluesky post, encouraging readers to continue the conversation on the native platform.

This approach is not without its limitations. The author initially considered allowing users to post comments directly from the blog via an OAuth flow but abandoned the idea due to the significant development effort required to build a robust, custom Bluesky client. The read-only nature of the current implementation means engagement is ultimately driven back to Bluesky itself, which may not be ideal for all users. Furthermore, the solution is inherently tied to Bluesky's API stability and terms of service.

However, the trade-offs are favorable for a developer seeking a low-maintenance, high-performance comment system. By treating Bluesky as a specialized backend for conversation, the author achieves a decoupled architecture where each component does what it does best: the blog handles content delivery, and Bluesky manages the social layer. This pattern offers a viable alternative to traditional comment systems, demonstrating how modern, open APIs can be leveraged to enrich static sites without sacrificing their core principles.