0

[Open Source] #72 - Follow: Kiến trúc trình đọc tin thế hệ mới với triết lý AI-First, Local-first và thiết kế Monorepo đa nền tảng

Dù giao thức RSS đã ra đời hơn 20 năm, nhưng nhu cầu về một công cụ tổng hợp tin tức (Information Aggregator) tập trung, sạch sẽ và không bị thao túng bởi thuật toán mạng xã hội vẫn luôn tồn tại. Follow (tên mã dự án là Folo) xuất hiện như một "thế hệ kế nhiệm" hoàn hảo cho RSS truyền thống, kết hợp giữa sức mạnh của AI, kiến trúc Local-first và khả năng hỗ trợ đa nền tảng (Web, Desktop, Mobile).

Dưới góc độ kỹ thuật, Follow là một dự án Monorepo đồ sộ, minh chứng cho sự kết hợp nhuần nhuyễn giữa React 19, ElectronDrizzle ORM để tạo ra trải nghiệm người dùng mượt mà như ứng dụng bản địa (Native-like).

Github: https://github.com/RSSNext/Follow


🛠️ 1. Nền tảng công nghệ: Chiếm lĩnh mọi thiết bị

Follow được xây dựng trên một Stack công nghệ cực kỳ hiện đại, tập trung vào việc chia sẻ logic giữa các nền tảng:

  • Lõi Frontend (React 19): Follow là một trong những dự án mã nguồn lớn đầu tiên ứng dụng React 19, tận dụng hiệu năng cao và các cải tiến mới về hook.
  • Hạ tầng Monorepo (Turborepo & pnpm): Giúp quản lý đồng thời ứng dụng Web, Desktop (Electron) và Mobile (Expo/React Native) trong cùng một codebase.
  • Quản lý trạng thái lai (Hybrid State): Sử dụng Zustand cho các store toàn cục, Jotai cho các tương tác nhỏ dạng nguyên tử (atomic) và TanStack Query để quản lý dữ liệu từ Server.
  • Local-first Database: Sử dụng Drizzle ORM kết hợp với SQLite (SQLite cho Desktop và Expo SQLite cho Mobile). Đây là chìa khóa để hỗ trợ đọc offline và tốc độ truy xuất dữ liệu cực nhanh.

🏗️ 2. Trụ cột kiến trúc: Local-first & AI-Centric

Kiến trúc của Follow không chỉ là một trình duyệt web hiển thị RSS; nó hoạt động như một hệ điều hành thông tin:

  • Triết lý Local-first: Mọi dữ liệu như trạng thái "đã đọc", bài viết yêu thích hay lịch sử đều được ưu tiên lưu trữ tại database cục bộ dưới máy người dùng. Điều này đảm bảo tính riêng tư tuyệt đối và trải nghiệm không có độ trễ (Zero-latency).
  • AI làm trọng tâm (BYOK): Follow tích hợp sâu AI để tóm tắt bài viết, dịch thuật và phân loại nội dung. Dự án hỗ trợ mô hình "Bring Your Own Key", cho phép người dùng tự dùng API Key cá nhân để tối ưu chi phí.
  • Hybrid Renderer: Phần Desktop được thiết kế để có thể chạy linh hoạt giữa chế độ ứng dụng Electron (truy cập API hệ thống, Shortcuts) và chế độ Web Standard mà không phải sửa lại code giao diện.

🔄 3. Workflow: Luồng xử lý và đồng bộ dữ liệu (Sequence Diagram)

Sơ đồ dưới đây mô tả cách Follow thu thập và làm giàu dữ liệu bài viết bằng AI:

image.png


⚡ 4. Các kỹ thuật "Pro-level" trong mã nguồn

  1. Hot Update cho Desktop Renderer: Dự án triển khai cơ chế hot-updater.ts riêng biệt cho Electron. Thay vì bắt người dùng tải lại toàn bộ file setup hàng trăm MB, Follow có thể cập nhật phần giao diện Vite bundle chỉ vài MB ngay trong runtime.
  2. Readability Engine tùy biến: Follow sử dụng thư viện trích xuất nội dung cực mạnh để loại bỏ quảng cáo, menu và các thành phần thừa từ website gốc, biến mọi link web thành một bài viết sạch (clean reading mode).
  3. IPC Decorators: Trong Electron, việc giao tiếp giữa tiến trình Main và Renderer thường rất rắc rối. Follow sử dụng các Decorators để đóng gói logic IPC, giúp code tường minh và tránh lỗi "Callback Hell".
  4. Hỗ trợ Model Context Protocol (MCP): Tích hợp giao thức mới từ Anthropic, cho phép trợ lý AI có thể tương tác với các công cụ bên ngoài ngay trong trình đọc tin.

⚖️ 5. So sánh chiến lược

Tiêu chí Follow (Folo) Feedly / SaaS NetNewsWire (Native)
Quyền sở hữu Tuyệt đối (Local-first) Bị kiểm soát bởi nhà cung cấp Tuyệt đối
Hỗ trợ AI Tích hợp sâu (Tóm tắt, Dịch) Hạn chế (Trả phí cao) Thường không có
Đa nền tảng Web, Desktop, Mobile Web, Mobile Chỉ Apple Ecosystem
Loại nội dung RSS, Podcast, Social, Video Chủ yếu RSS RSS

✅ Kết luận: Tại sao Follow là hình mẫu cho AI-First App?

Follow không chỉ tái định nghĩa trình đọc tin; nó là một bài học về Product Engineering hiện đại. Dự án chứng minh rằng với sự kết hợp đúng đắn của công nghệ (React 19, Drizzle, AI), chúng ta có thể mang lại sức sống mới cho những giao thức cũ như RSS.

Đối với các kỹ sư frontend và desktop, nghiên cứu Follow sẽ giúp bạn hiểu sâu về:

  • Cách xây dựng ứng dụng Local-first hiệu quả.
  • Kỹ thuật tối ưu hóa Electron cho ứng dụng quy mô lớn.
  • Tư duy thiết kế AI-native UI/UX để tăng hiệu suất tiêu thụ thông tin.

Hy vọng bản phân tích này mang lại cho bạn những cảm hứng mới về việc xây dựng các ứng dụng hiện đại. Đừng quên Upvote và Follow để theo dõi các "kỳ quan" mã nguồn tiếp theo nhé!


All rights reserved

Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí