Slides from my talk at JSConf 2011. Covers the usage of asynchronous personalization, CDNs, and A/B testing with Finch.js at Groupon.

1. asynchronous personalization
[and CDNs and A/B testing and stuff]
Jon Pliske
Performance Engineering, Groupon
@jonpliske
jpliske@groupon.com

2. You might know me from this leaked photo on TechCrunch
Jon Pliske
Performance Engineering, Groupon
@jonpliske
jpliske@groupon.com

3. overview
background
CDN caching
async personalization
a/b/multivariate testing /w finch.js

4. performance anxiety
big rails app performance issues
big team === development process hurdles
big traffic drinking problems
Reaching limit of Rails' caching
Low-level optimizations too "incremental"
Rewriting SQL is boring
Improve platform architecture

5. super bowl party
prelude:
jan 1. "btw we have pre/post super bowl commercials"
jan 15. "scored an in-game spot, we good?"
feb 15. offend the world
"spike mode":
CDN cache it all!
disable login
offload geocoding/subscriptions/orders to EC2
limited functionality === unhappy users

6. pics or it didn't happen

7. pics or it didn't happen

8. CDNs are neat
pros cons
low latency dynamic content
"edge side nodes" personalization
high capacity complexity
static content overkill?
specifically:
personalized content (login menu, deals)
analytics tracking
a/b testing
Rails developers

9. async personalization
target: deal/division pages (> 50% of traffic)
approach:
1. cache "anonymous" page in CDN
2. hide stuff
3. make AJAX request for personalized data/content
4. show stuff
See Chris Williams' "Rails’ Best Caching Method is JavaScript"
from GoRuCo 2010

10. obligatory omnigraffle diagram

13. "Anonymous" user
before:
initial page response time: 0.8 sec
rendering time (e.g. loading css/js/images): 1 sec
total: 1.8 sec
after:
initial page response time: 0.1 sec
rendering time: 1 sec
total: 1.1 sec
only a little bit faster...(1.1 vs 1.8 sec)
basically no server load => huge capacity increase!

14. Logged-in User / Subscriber
before:
initial page response time: 3 sec
rendering time (e.g. loading js/css/images): 1 sec
total time: 4 sec
after:
initial page response time: 0.1 sec
rendering time (include AJAX call:1 sec): 1 sec
total time: 1.1 sec
Capacity constant: AJAX call still needs to hit Rails
300% faster!

15. [wait for applause]

16. development implications
less Rails, more JS
1 user !== 1 (Rails) request
goodbye:
current_user
session
cookies
testing

17. onCurrentUserReady(callback)
callback when personalize API returns (or callback immediately
for anonymous user)
before:
- if logged_in?
do stuff for logged-in user
- else
do stuff for anonymous user
after:
Groupon.onCurrentUserReady(function(){
if (Groupon.currentUser.isAuthenticated) {
do stuff for logged-in user
} else { do stuff for anonymous user }
});

18. analytics
Problem: Request logging
Solution: Tracking pixel (hit Nginx only, not Rails)
Problem: Content changes
Solution: Dynamic tracking pixel
Problem: Tracking params (e.g. utm params, affiliate id, etc...)
Solution: Store in cookie; append params to API request

19. a/b testing with Finch
Problem: Finch uses view/controller logic to choose and track
experiments and variants
- experiment 'Two vs. Three Step Subscription' do |e|
- e.variant 'Original' do
%h1 Fill out this form to subscribe now
- e.variant 'Two Step' do
%h4 Follow these two steps to subscribe
- e.variant 'Three Step' do
%p Subscribe now - it only takes a few seconds

20. Finch.js
Finch.Experiments.DelayedJSExperiment = {
defer: function() {
var experiment = this;
FinchDemo.onCurrentUserReady(function() {
experiment.deferedRun(this);
});
},
before: function() { $('#delayed').hide(); },
after: function() { $('#delayed').show(); },
variants: {
original: function() { $('#delayed .original').show(); },
alternate: function() { $('#delayed .alternate').show();},
}
};
$(function() {
Finch.run(window);
});

21. Finch.js
based on Google's "Overlapping Experiment Infrastructure"
written in coffee-script
open source soon-ishly
~ 15k of JS
doesn't handle tracking/analytics/analysis side of testing
(yet?)

22. the future
pure-JSON API requests
client-side rendering (/w mustache.js)
HTML5 storage
decouple from Rails
development practices:
front/back-end integration
better testing
better monitoring

23. Thank you!
@jonpliske
jpliske@groupon.com
groupon.com/techjobs