A social news feed is a viewer-specific ranked session of stable post identities, delivered through cursor pages and presented without letting live arrivals, optimistic actions, or media loading steal the reader's position.
A feed looks like a vertical list of cards, but almost every card is changing. Ranking scores change. Authors edit or delete posts. Reaction counts move. Media becomes ready after text. New posts arrive while the reader is halfway down the page. Advertisements or recommendations may have placement rules that ordinary posts do not.
The frontend cannot treat each response as “the latest array.” It needs a session receipt that says which viewer, policy, ranking revision, experiment, and cursor boundary produced the order. It needs stable post identity for merging and actions. It also needs separate state for the current reading anchor, live-arrival notice, and pending mutations.
Clarify the feed contract
Ask whether the feed is chronological, ranked, or a blend. Determine whether it contains followed accounts only or recommendations too. Define the inventory types: text, link, image, video, reshare, poll, sponsored post, and moderation notice. Decide how edits, deletions, blocked authors, and permission changes appear.
Clarify what “live” means. Counts may update in place, but inserting a new story above the viewport is a different and more disruptive operation. Ask whether the user can return to the same reading position after opening a post and navigating back. Define offline expectations, data-saving modes, autoplay rules, and accessibility requirements.
The useful outcome is a narrow promise: an open feed keeps a stable reading session, while newer inventory and changing metadata are reconciled through explicit channels.
The public interview prompt
Design a browser-based personalized news feed. It contains heterogeneous post types, loads continuously, supports reactions, saves, comments, hides, and shares, receives new posts and counter updates in real time, and must work on slow networks and mobile devices.
Explain:
- ranking ownership, session identity, cursor pagination, and deduplication;
- normalized entities versus ordered feed entries;
- new-post insertion and scroll anchoring;
- optimistic mutation ledgers and server reconciliation;
- media loading, prefetch, playback, and memory budgets;
- accessible article semantics and focus preservation;
- edits, deletes, moderation, offline, and partial failure;
- caching, privacy, telemetry, testing, and rollout.
What the premium solution covers
The full solution follows one ranked session from request through authorization, page merge, media readiness, stable anchoring, and presentation. It separates feed entries, post entities, live notices, and mutation overlays. It includes a frame-checked lifecycle animation, three high-resolution decision diagrams, and a deterministic six-input feed-budget lab.