Video of this talk from the Velocity Conference 2012: http://www.youtube.com/watch?v=bM0yL0eQ9EM Large-scale sites are complex systems, where every page is generated with data pulled from multiple back-end data stores and services. Yet, not every piece of data on the page is critical to the user experience. The front-end of your site (i.e. front-end applications, templates, and user interface) needs to be designed to tolerate service outages. We can achieve this by teaching our product design teams about working with an operational mindset, and having our product teams inform our engineering and operations teams about business priorities so that they can anticipate the right patterns to use for fault-tolerance.

1. Resilient User Experiences
Mike Brittain
DIRECTOR OF ENGINEERING, ETSY
@mikebrittain

2. Interfaces and user experiences
that adapt to technical and
architectural failure

8. /**
* Creates a database connection.
*/
public function __construct($host, $user, $pass, $db) {
parent::__construct($host, $user, $pass, $db);
if (mysqli_connect_error()) {
throw new DBConnection_Exception(
sprintf("Error: %s, %s",
mysqli_connect_errno(),
mysqli_connect_error()));
}
}

9. try {
$conn = new DBConnection('viewsdb.host', 'db_read_user',
'ssssshh!', 'views_db');
} catch (DBConnection_Exception $e) {
// TODO: Someone should figure out what to do if
// we can't connect to the views db.
throw $e;
}

13. Critical path

14. Every back-end service is an
opportunity for failure.

18. 1 4
9
5 6
8
2 3
10
4
11
7
14
7
13
12

23. Are you showing your
visitors the door?

24. < 400 ms

25. Non-blocking Ajax

26. Google Calendar
Google Docs

27. GMail

28. “Oops, we aren’t able to access click
metrics right now, do not worry —
your data is safe.”

29. Product design doesn’t stop
at 100% availability.

30. Dev Ops
Product

31. 1 4
9
5 6
8
2 3
10
4
11
7
14
7
13
12

32. Operability reviews and
post-mortems

33. Operational Mindset
Dev Ops Product

34. Operational Mindset
Dev Ops Product
Business Priorities

35. page views for error template

36. This is hard

37. ... but the benefits are great.

38. Flickr: striatic
http://www.flickr.com/photos/34427466731@N01/2192192956/
Flickr: roboppy
PHOTO CREDITS http://www.flickr.com/photos/51035735481@N01/163374138/
Flickr: jamesjyu
http://www.flickr.com/photos/32593095@N00/3465022/
Flickr: circulating
http://www.flickr.com/photos/26835318@N00/2318226026/