Case Study

TwiLix: Scalable React Native Social Platform with AI-Powered Feed

React Native · TypeScript · Firestore · OpenAI Embeddings · Media CDN · AI Moderation

Industry: Social MediaPlatform: iOS & Android

The Problem

Building a social platform that remains fast and relevant as it scales involves several compounding engineering problems: a naive social feed becomes unacceptably slow as follower counts grow; content quality degrades without moderation; media upload and playback performance directly affects retention; and recommendation systems that surface relevant content are the difference between daily active users and churn.

TwiLix required a production-grade architecture addressing all of these problems from day one — not as retrofits. The goal was a React Native app that felt as fast and intelligent as mature consumer social products, without a team of 50 engineers.

Technical Implementation

Firestore Fan-Out Feed Architecture

Rather than querying all posts from followed users at read time (which scales poorly), I implemented a fan-out-on-write feed model. When a user posts, a Cloud Function writes a copy of the post reference into each follower's personal feed document. Feed reads are then single-document reads — O(1) regardless of follow graph size. For high-follower accounts ("celebrities"), a hybrid fan-out-on-read strategy prevents write amplification on viral posts.

OpenAI Embeddings Recommendation Engine

Content discovery (the "Explore" tab) is powered by OpenAI text embeddings. Each post's text content is embedded using text-embedding-3-small and stored in a vector index (Firestore + Cloud Function aggregator). User preference vectors are built from interaction signals (likes, saves, time-on-post). The recommendation endpoint performs approximate nearest-neighbour search to surface semantically relevant posts — personalised without requiring explicit category selection from users.

Media CDN Pipeline

Images are uploaded to Firebase Storage and processed by a Cloud Function that generates multiple resolutions (thumbnail, medium, full) and converts to WebP. Video uploads are transcoded to HLS via a serverless FFmpeg pipeline, enabling adaptive bitrate streaming. All media is served through a CDN edge layer — keeping Time-to-First-Frame under 300ms globally.

Push Notification Architecture

Notifications (likes, follows, replies, mentions) are triggered by Firestore write events via Cloud Functions, which invoke FCM for Android and APNs for iOS. A notification preferences service allows per-type opt-out at the user level. Batching logic prevents notification storms on viral posts from overwhelming a user's lock screen.

AI Content Moderation

All text posts and image uploads pass through an AI moderation pipeline before appearing publicly. Text is evaluated by GPT-4 against a moderation policy prompt; images are checked via the OpenAI Vision API and a custom classifier. Posts above a confidence threshold are auto-rejected; borderline cases are queued for human review. This scales moderation coverage without proportionally growing the moderation team.

Technical Stack

React NativeTypeScriptFirebase FirestoreFirebase Cloud FunctionsFirebase StorageOpenAI Embeddings APIOpenAI GPT-4 (Moderation)OpenAI Vision APIHLS Video (FFmpeg)FCM / APNsCDN (Edge Delivery)Expo EAS Build

Key Engineering Challenges Solved

Building a Social or AI-Powered App?

I design scalable architectures for complex React Native products. Tell me what you're working on.

Say hi