mary-ext/bluesky-embed

🧩 bluesky-embed — Nhúng bài viết & feed Bluesky ngay trên trang web

Một custom element nhẹ, gọi API Bluesky trực tiếp, hỗ trợ SSR và dùng được ngay cả khi JS bị tắt.

bluesky-embed là một bộ custom element giúp bạn nhúng bài viết (post), thẻ người dùng (profile card) và feed cá nhân từ nền tảng Bluesky vào bất kỳ trang web nào. Dự án được viết bằng Svelte và tích hợp sẵn trong ba gói con:

• bluesky-post-embed
• bluesky-profile-card-embed
• bluesky-profile-feed-embed

Dự án nhấn mạnh tính nhẹ và độc lập — toàn bộ gói cùng phụ thuộc chỉ chiếm khoảng ~20 KB (khoảng ~6 KB khi nén gzip), và giao tiếp trực tiếp với API của Bluesky mà không cần máy chủ trung gian.

✨ Điểm nổi bật

• Nhẹ và tối ưu: Toàn bộ thư viện chỉ ~20 KB, nén gzip xuống còn ~6 KB.
• Không qua trung gian: Gọi API Bluesky một cách trực tiếp, không cần server hỗ trợ.
• Hỗ trợ SSR: Có thể render phía máy chủ, phù hợp với các framework hỗ trợ server-side rendering.
• Dùng được khi JS bị tắt: Nhờ SSR, trang vẫn hiển thị nội dung dù người dùng không chạy JavaScript.
• Ba gói tích hợp sẵn: Hỗ trợ nhúng post, profile card và profile feed riêng biệt.
• Dựa trên Web Components: Sử dụng custom element chuẩn, dễ tích hợp vào mọi nền tảng.
• Xây dựng bằng Svelte: Tận dụng hiệu suất và kích thước nhỏ gọn từ Svelte.

💡 Vì sao đáng chú ý

Khác với các giải pháp nhúng Bluesky khác thường nặng nề và phụ thuộc vào backend, bluesky-embed cung cấp một cách tiếp cận rất sạch sẽ: nhẹ, nhanh, không cần trung gian, và vẫn hoạt động hoàn hảo ngay cả khi JavaScript bị vô hiệu hóa nhờ hỗ trợ SSR. Điều này khiến nó rất thích hợp cho các trang web tĩnh hoặc blog cá nhân muốn hiển thị nội dung từ Bluesky một cách nhanh chóng và hiệu quả.

---

#Bluesky #WebComponents #Svelte #Embed #TiniX