Design an Image Feed: Uploads, Image Delivery, and Feed Generation

Design an image feed. Users upload images to share as posts, and each user scrolls a feed of other users' images. The feed must load quickly and scroll smoothly on web and mobile, including over slow connections, and a new post should appear in the relevant feeds shortly after it is uploaded. ```hint Images are not rows Decide where the image bytes live and how they reach a viewer, separately from where the feed's metadata lives. ``` ```hint Build the feed when? Consider whether a user's feed is assembled when they open it or prepared in advance when someone posts, and which kinds of accounts break each approach. ``` ```hint Scrolling must feel instant Think about what the client should request and render so that scrolling never waits for full-resolution images. ``` ### Constraints and Clarifications - Assume a social feed: users follow other accounts, and the feed shows images posted by the accounts a user follows. Confirm this, because the feed could also be a global or recommended stream. ### Clarifying Questions - Whose images appear in the feed: accounts the user follows, a global or recommended stream, or both? - Is the feed reverse-chronological or ranked? - Should the design cover the client, the backend, or both end to end? - How many users, uploads per day and feed views per day are expected, and what image sizes and formats are uploaded? - Do posts carry captions, likes or comments that must appear in the feed? - Are some accounts followed by a very large number of users? ### What a Strong Answer Covers - An upload path that keeps image bytes off the application servers and turns originals into delivery-ready versions - A delivery path built on a CDN, appropriately sized renditions, cache headers and progressive loading - Feed generation that weighs fan-out on write against fan-out on read, handles high-follower accounts, and paginates with cursors - A data model and partitioning for posts, the follow graph and feed timelines - Client rendering: virtualized infinite scroll, lazy loading, placeholders and prefetching - Failure handling, deletion and moderation, and metrics such as time to first image ### Follow-up Questions - An account with a very large number of followers posts. Walk through what happens. - How would you switch the feed from chronological to ranked without rewriting the storage layer? - The feed is slow on poor mobile connections. What do you change on the client and in delivery? - A user deletes a post. How quickly does it disappear from followers' feeds and from CDN caches?