Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Tumblr iOS architecture

Tumblr iOS architecture

Bryan Irace

August 06, 2014

More Decks by Bryan Irace

Other Decks in Technology


  1. Purpose of this talk • The iOS codebase should not

    be this magical, black box that you’re scared to look at or touch • All engineers should feel comfortable reading through the code (and opening pull requests)
  2. Relational DB File system Tumblr API Local storage Networking and

    storage Run loop (waits for user interaction)
  3. Sync engine UI Sync engine User requested posts User created

    a post, liked/followed something, etc. New posts persisted No Internet? No problem Local storage Outgoing posts are queued, retried when connected Fetch new posts if connected, no worries if not
  4. Our database is (mostly) just a cache Provides speed plus

    a nice offline experience without complication
  5. Controller Controller View View MVC Controller View View View View

    What you see on screen and interact with Exists in a hierarchy Drawn programatically or using a visual editor (Interface Builder) Manages a screenful (or so) of information Responds to user interaction Contains only presentation logic Has a single view Populates its view with data
  6. Adaptive layout • iOS 1-7 • Check if we’re running

    on an iPhone or iPad • Check if we’re in portrait or landscape • iOS 8 • At any point, app will be either vertically/horizontally “regular” or “compact” • This can change based on rotation, other factors
  7. Post rendering <p><a href="http:// ryan.tumblr.com/post/ 93783287034/the-site-may- crash-16-bitch-met- david">ryan</a>:</p> <blockquote> <p>The

    site may crash. <a href="http:// tmblr.co/mqneDxY- aNcK8DhWHP23qvw">16- bitch</a> met <a href="http://tmblr.co/ mJmaPYlIVDe7tP9jhKEHlRw"> david</a>.</p> </blockquote> <p>Tumblr - making dreams come true (for David)</p> API response XML parser Mapping of character ranges to semantic section types (and attributes) Output string + data structure Or “Why inline embeds and stuff don’t show up”
  8. <p> <a href=“http:// ryan.tumblr.com/post/ 93783287034/the-site-may- crash-16-bitch-met- david">ryan</a>: </p> <blockquote> <p>The

    site may crash. <a href="http://tmblr.co/ mqneDxY- aNcK8DhWHP23qvw">16-bitch</ a> met <a href=“http:// tmblr.co/ mJmaPYlIVDe7tP9jhKEHlRw">da vid</a>. </p> </blockquote> <p> Tumblr - making dreams come true (for David) </p> (0, 4): [ { type: 'link', attributes: { url: ‘http://ryan.tumblr.com/post/…’ } } ], (0, 6): [ { type: 'paragraph' } ], (46, 45): [ { type: 'paragraph' } ], (6, 40): [ { type: 'blockquote' }, { type: 'paragraph' } ], (26, 8): [ { type: 'link', attributes: { url: ‘http://tmblr.co/…’ } } ], (39, 5): [ { type: 'link', attributes: { url: ‘http://tmblr.co/…’ } } ] ryan:\nThe site may crash. 16-bitch met david.\nTumblr - making dreams come true (for David)
  9. TextKit NSMutableAttributedString *string = [[NSMutableAttributedString alloc] initWithString: @"ryan:\nThe site may

    crash. 16-bitch met david.\nTumblr - making dreams come true (for David)"]; ! // Loop through ranges, add the right attributes to each range ! [postContent addAttributes:@{ NSLinkAttributeName : [NSURL URLWithString:@“http://ryan.tumblr.com/post/…”] } range:NSMakeRange(0, 4)]; ! // Lots of work required to support things like nested blockquote indentation, nested lists, inline images, etc.
  10. Yes, I realize we’re kind of implementing a web browser

    here All in the name of performance
  11. GIFs • Save each individual frame as a JPEG (plus

    a metadata file) • Play by looping through the individual frames • Don’t read them all into memory at once
  12. • Think Gems/Bundler, NPM, etc. • Used for both internal

    and third-party dependencies • Downloads as well as integrates with Xcode project file, compilation settings, etc.
  13. Application lifecycle • Apps can be purged from memory at

    any time, if iOS needs to reclaim memory • iOS 7 added “background fetch” – app can periodically update itself even if it had previously been killed • Apps can perform “background tasks” (within reason) • e.g. User creates a post and then backgrounds the app – post will continue uploading
  14. Push notifications Notification App is foregrounded App is backgrounded App

    is foregrounded and given payload App is given payload immediately iOS displays notification without app’s involvement
  15. Inter-app communication • Apps define protocols that they can handle,

    e.g. “tumblr://“ • We’ve support a number of URLs, including: • tumblr://x-callback-url/tag?tag=gif • tumblr://x-callback-url/blog?blogName=bryan • tumblr://x-callback-url/quote? quote=Quote&source=Source • x-callback-url is an unofficial specification for how iOS URLs should be structured • x-success and x-error URL parameters are used to return the user to the app where they came from