Building fb mobile

developers

Prashant Sridharan and Bear Douglasgithub/coolasspuppy

github/beardouglas@coolasspuppy

@beardigsit

Building Facebook’s Native Apps

Tuesday, May 7, 13

Agenda

▪ “Over the wall”: some history

▪Product Teams and the Core Team

▪Scheduling and Stabilizing Releases

▪How We Develop

▪Eating the Dogfood: Builds

▪A Culture of Unit Testing

▪Future of iOS at Facebook

Tuesday, May 7, 13

History

Tuesday, May 7, 13

Facebook for Mobile

▪Web deeply engrained in Facebook’s DNA

▪Use HTML!/Javascript within “wrapper” native app

▪Developed our own framework for advanced integration(image uploads, photo browsers, mixing native/web elements)

Tuesday, May 7, 13

HTML as an app platform

▪What does it bring us?

One CodebaseInstant Updates A/B Testing

Tuesday, May 7, 13

HTML as an app platform

▪Frequent performance problems

▪No coherent multithreading strategy in web apps

▪DOM manipulations and layout can spin out of control, lots of hacks

▪Difficult memory management (<img>)

▪Debugging and getting stack traces are extremely difficult

▪Limited animations and effects

Tuesday, May 7, 13

A few good engineers

▪Facebook for iOS !." began as an experiment

▪Could we achieve better results with native code?

▪High barrier: rewrite all of Facebook’s mobile UI!

▪Couldn’t disrupt company

▪Move this to a war room!

Tuesday, May 7, 13

Winding Road

▪Lots of changes along the way:

▪ Led to a rethink about how our APIs fetch data

▪ Experimented with advanced rendering to make feed smooth

▪ Sprinkle in some design changes

▪Plenty of wrangling with Core Data and Core Animation

▪Shipped internally starting in mid-#"$#

▪Reaction: we liked it…

Tuesday, May 7, 13

Reaction

▪Press loved it

▪More importantly…

▪ Perceived Speed way up

▪ User Ratings way up

▪#x Speed increase!

Tuesday, May 7, 13

Team

Tuesday, May 7, 13

Scaling it Up

▪We got it out the door, but…

▪A few iOS engineers in a room won’t cut it

▪Making Facebook a “mobile first” company

Tuesday, May 7, 13

Wake-up Call

▪News Feed team invented phenomenal new story type

▪ … but they weren’t thinking about !."

▪ … and we didn’t know about News Feed developments

▪Mad dash to port the story type to native code before !."

▪ Not an experience we wanted to repeat!

▪Lots of cooperation required to keep abreast of product developments:news feed, timeline, comments, photos, pages, places, events, …

Tuesday, May 7, 13

Prioritization and resources

▪Every product wanted their features in the new native app

▪Overwhelmed by prioritizing so many requests

▪ iOS Team still had very limited resources

Tuesday, May 7, 13

A multi-app ecosystem

Tuesday, May 7, 13

The Team Sandwich

Release Team: Release & Stabilization ProcessRelease Team: Release & Stabilization ProcessRelease Team: Release & Stabilization ProcessRelease Team: Release & Stabilization ProcessRelease Team: Release & Stabilization Process

Photos Feed Search Places Messages

Core Team: Shared LibrariesCore Team: Shared LibrariesCore Team: Shared Libraries

Tuesday, May 7, 13

Core Team: support and assist

▪Build core, shared libraries

▪ Infrastructure and integration

▪Keep the app fast and clean

Tuesday, May 7, 13

Product Cycle

Tuesday, May 7, 13

Timing Releases

▪Simple model: Release X will have features A, B, C

▪Next release at mercy of the slowest product team

▪No choice but to wait until it’s “done”

▪This slowed us down, and we want to move fast

Tuesday, May 7, 13

Fixed Release Cycle

▪Ship an update every x weeks

▪ … no matter what

At Facebook we target a release every % weeks (approximately)

Tuesday, May 7, 13

Building features with an “off switch”

▪Every feature must be built with a way to turn it off

▪ If a feature destabilizes the build or isn’t complete, turn it off and try again next time

▪#defines – or runtime switches (preferred)

Tuesday, May 7, 13

Road to a new “Like Bar”

Tuesday, May 7, 13

Development

Tuesday, May 7, 13

Process

▪Engineers make changes locally

▪Submit changes for review

▪Changes are automatically checked for build and unit test failures

▪Team members review & suggest changes

▪Once approved, submit to master

Tuesday, May 7, 13

Source Control: Git

▪Distributed development

▪Designed for speed

▪Open source

▪Optimized for non-linear development

▪Allows local branching

Tuesday, May 7, 13

Phabricator

Text

Tuesday, May 7, 13

Arcanist▪ The command line counterpart to Phabricator

▪ arc lint

▪ Checks for common errors:

▪ Null pointers

▪ Syntax errors and style guideline violations

▪ Using APIs unavailable in all supported Android versions

▪ arc land

▪ Pushes code into the tree

Tuesday, May 7, 13

Buildbot

Tuesday, May 7, 13

Builds

Tuesday, May 7, 13

Downloading builds

▪Deployed to entire company

▪Signed with Enterprise Distribution profile

▪Daily builds posted to internal web site

▪ Installed directly on device

▪Use different Bundle IDs for different builds

Tuesday, May 7, 13

Tuesday, May 7, 13

Rage Shake

▪Take out your stress on the device

▪Captures:

▪ Screen shot (with annotations!)

▪ Network logs

▪ Last crash log

▪ Last x-seconds of logging

▪ Dumps the view hierarchy

▪Automatically files a bug and sends it to Facebook

Tuesday, May 7, 13

Branching

▪Two concurrent branches:

▪Master

▪ Engineers make progress on future features

▪ All changes checked in here first

▪ …including bug fixes for Releases

▪Release

▪ Once verified in Master…

▪ …“Release team” pulls them into Release branch

Tuesday, May 7, 13

Testing

Tuesday, May 7, 13

Testing is important to Facebook

▪Not in Facebook’s culture:

▪ SDEs “in Test”

▪ Large QA departments

▪Definitely in Facebook culture:

▪ High quality, reliable user experience

▪We believe in developer-authored unit tests

Tuesday, May 7, 13

http://github.com/facebook/xctool

xctool

Tuesday, May 7, 13

Unit Testing on iOS▪Some built-in Xcode support:

▪ OCMock & SenTestingKit

▪Uses dynamic nature of Objective-C

▪Easy to set-up, and well documented

▪BUT

▪ Many iOS engineers unfamiliar with testing

▪ Frameworks are immature

▪ Incomplete support in xcodebuild▪ Doesn’t understand “Test” action in your Schemes

▪ Can’t run tests that require Simulator

Tuesday, May 7, 13

xctool

▪Replacement for ‘xcodebuild’

▪Runs Simulator tests

▪Structured output

▪ Phabricator support built-in

▪ Customizable to other build systems

Tuesday, May 7, 13

Tuesday, May 7, 13

Tuesday, May 7, 13

http://github.com/facebook/buck

Buck

Tuesday, May 7, 13

We needed a better tool▪ Minimal overhead in creating a module

▪ Keep boilerplate out of the codebase

▪ IDE friendly

▪ Faster clean builds

▪ Faster incremental builds

▪ Support ad-hoc build steps

Tuesday, May 7, 13

Buck: an Android build system▪ build rule procedure for producing output files from input files

▪ build file file (named BUCK) where build rules are declared

▪ build target string identifier for a build rule

Tuesday, May 7, 13

Build Target

//java/com/facebook/share:ui

Root of the repository

Directory where the build file can be found

Name of the build rule

Tuesday, May 7, 13

Build Rule

android_library( name = 'ui', srcs = glob(['**/*.java']), deps = [ '//android_res/com/facebook/share:res', '//java/com/facebook/base:base', '//third-party/java/guava:guava', ], visibility = [ 'PUBLIC' ],)

Tuesday, May 7, 13

Build File: Rules and Macros

Tuesday, May 7, 13

Dependency Graph

AR AR

AR

ALAL AL

AL AL

AL

AB

GR

AB

GR

Tuesday, May 7, 13

Dependency Graph

AR AR

AR

ALAL AL

AL AL

AL

AB

GR

AB

GR

Tuesday, May 7, 13

How does IntelliJ feel about all of this?

buck project FTW!

Tuesday, May 7, 13

Focus on Speed▪ Parallel builds

▪ Unit tests take ! minutes instead of "# by using $ threads

▪ Incremental

▪ Only rebuild what is necessary

Tuesday, May 7, 13

Migration: August !"#!

AntBuck

!m"#s$m!#s

Tuesday, May 7, 13

http://github.com/facebook/xctool

Now open source:xctool and Buck

http://github.com/facebook/buck

Tuesday, May 7, 13

Future of Mobile @ Facebook

Tuesday, May 7, 13