<?xml version="1.0" encoding="UTF-8"?>
<rss xmlns:dc="http://purl.org/dc/elements/1.1/" version="2.0"><channel><atom:link rel="hub" href="http://tumblr.superfeedr.com/" xmlns:atom="http://www.w3.org/2005/Atom"/><description></description><title>bjk5</title><generator>Tumblr (3.0; @bjk5)</generator><link>http://bjk5.com/</link><item><title>Sharing the inspiring, personal stories of Khan Academy users</title><description>&lt;p&gt;
We have these emails hanging up all over our office, sent in from Khan Academy users with incredible, personal stories to tell. Every time I read a new one I’m emotionally affected, which means my robot emotion chip is faulty.
&lt;/p&gt;

&lt;p&gt;
So when some curious soul (like a reporter) wanders in and asks me, “How will you know if Khan Academy is really successful?” I always answer their (totally valid) question with an explanation of our data, analytics, and fancy metrics — but what I’m really thinking is, “&lt;em&gt;You haven’t read these letters.&lt;/em&gt;”
&lt;/p&gt;

&lt;p&gt;
Let’s change that. &lt;a href="http://www.khanacademy.org/stories"&gt;These students’ and parents’ and teachers’ stories are now available for anyone to be inspired by.&lt;/a&gt; It is impossible to read them…go ahead, I challenge you…and not come away with the conclusion that a free educational resource like Khan Academy simply must exist.
&lt;/p&gt;

&lt;p class="center"&gt;&lt;a href="http://www.khanacademy.org/stories"&gt;&lt;img src="http://static.tumblr.com/9hgswys/oZWlyao2j/stories.png"/&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;
Call me a softie. It’s not like I don’t believe in data as the final arbiter of any learning tool’s effectiveness. I do. But if our key data metric happened to be “# of page-long, authentic stories sent in from users who have &lt;a href="http://www.khanacademy.org/stories/paesan"&gt;turned their lives around in the face of drug addiction&lt;/a&gt;, &lt;a href="http://www.khanacademy.org/stories/dan"&gt;unleashed their 2nd-grade son on the advanced math he’s fully qualified to handle&lt;/a&gt;, or &lt;a href="http://www.khanacademy.org/stories/rayana"&gt;earned acceptance into a university despite being stuck in a country that does not value education&lt;/a&gt;,” I don’t think I’d second guess seeing that number skyrocket.
&lt;/p&gt;

&lt;p&gt;
Hopefully these stories inspire others as much as everybody on our team. We spent time designing the page to celebrate the authors, their letters, and the fact that these are real lives, not product testimonials.
&lt;/p&gt;

&lt;p&gt;Does the page accomplish this? Feedback welcome, good and bad.&lt;/p&gt;</description><link>http://bjk5.com/post/16401068120</link><guid>http://bjk5.com/post/16401068120</guid><pubDate>Tue, 24 Jan 2012 03:50:07 -0500</pubDate></item><item><title>Khan Academy Internship, Fall '11</title><description>&lt;blockquote&gt;
I already can’t wait to drop some major challenges in the laps of our two incoming Fall interns to see what they can build.&lt;br/&gt;&lt;br/&gt;
- &lt;a href="http://bjk5.com/post/8826207372/khan-academy-internship-summer-11"&gt;Khan Academy Internship, Summer ‘11&lt;/a&gt;
&lt;/blockquote&gt;

&lt;p&gt;&lt;img class="shadowless" src="http://static.tumblr.com/9hgswys/w9Ylxgcf0/green_checkmark_thick24.png"/&gt; Check!&lt;/p&gt;

&lt;p&gt;&lt;a href="http://david-hu.com"&gt;David Hu&lt;/a&gt; and &lt;a href="http://www.julianpulgarin.com"&gt;Julian Pulgarin&lt;/a&gt; stepped up to the plate this Fall during their &lt;strike&gt;coops&lt;/strike&gt;internships from University of Waterloo. We call ‘em &lt;em&gt;internships&lt;/em&gt; because we’re from Amurrrrica, you crazy Canadians.&lt;/p&gt;

&lt;p&gt;When hanging with friends and family recently, I found myself shocked by how willing my brain is to completely forget stories that were surely once described as unforgettable. I don’t have any desire to forget what we’re doing at Khan Academy, and that’s kinda sorta why &lt;a href="https://sites.google.com/a/khanacademy.org/forge/for-developers"&gt;being as open as possible is one of our core dev principles&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;&lt;a href="http://bjk5.com/post/8826207372/khan-academy-internship-summer-11"&gt;The Summer ‘11 story&lt;/a&gt; is already a nice piece of shared history that helps me answer every intern candidate who asks, “What kind of project do interns work on at Khan Academy?”. Here’s my version of the Fall story.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/f9plxgd7f/bison_bull_photo.jpg"/&gt;&lt;br/&gt;&lt;em&gt;If tales about &lt;a href="http://www.amazon.com/Ride-ebook/dp/B006QXE2OA"&gt;battling a bison for the right to cross a road&lt;/a&gt; can get up and walk out of my head,&lt;br/&gt; then…well…better keep blogging.&lt;/em&gt;&lt;/p&gt;

&lt;h1&gt;David&lt;/h1&gt;

&lt;p&gt;It doesn’t get much more open than David’s post about &lt;a href="http://david-hu.com/2011/11/02/how-khan-academy-is-using-machine-learning-to-assess-student-mastery.html"&gt;how we use machine learning to assess student mastery&lt;/a&gt;. If I tried to summarize it for you, you’d see my managerial hair start spiking up and up and up toward the ceiling, Pinocchio-style. I won’t insult the work by talking about the statistics. Instead, I’ll just say that we now have a much better understanding of how competent each Khan student is in each math subject. Thanks, David.&lt;/p&gt;

&lt;p&gt;That’s not all he did. From a dashboard to emphasize the importance of our exercises to a much smoother way of asking students to review work they’ve done in the past, he covers it all in &lt;a href="http://david-hu.com/2012/01/05/khan-academy-internship-post-mortem.html"&gt;this Vi Hart-inspired internship post-mortem&lt;/a&gt;.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/vv4lxgdtk/dashboard.png"/&gt;&lt;br/&gt;&lt;em&gt;Keeping an eye on our students’ activity via David’s dashboard&lt;/em&gt;&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/2nWlxgdw8/teach-all-the-things.jpg"/&gt;&lt;br/&gt;&lt;em&gt;Forgetful Ben from the future is grateful for &lt;a href="http://david-hu.com/2012/01/05/khan-academy-internship-post-mortem.html"&gt;this video&lt;/a&gt;. And he’s also super-jacked and smart.&lt;/em&gt;&lt;/p&gt;

&lt;h1&gt;Julian&lt;/h1&gt;

&lt;p&gt;If anybody reading this has ever beaten Julian Pulgarin in chess, please rub his nose in it. Julian wiped the floor with me so many times that he would beg me to play him while he was blindfolded. My ego can’t handle that sort of hit, so I usually just deleted some data from production and pretended to be disappointed at each newfound emergency’s particularly poor timing.&lt;/p&gt;

&lt;p&gt;When he wasn’t humoring me, Julian made major contributions across the board.&lt;/p&gt;

&lt;p&gt;He started by building a number of new exercises for students to learn from, including an experimental crack at a new way of teaching fraction intuition. While working on this, he realized that it was painful to test our open source contributor’s GitHub pull requests, so he disappeared for a few days and came back with &lt;a href="https://github.com/jpulgarin/sandcastle"&gt;Sandcastle&lt;/a&gt;. Sandcastle automatically tags every pull request with a link that lets our developers test out the requests’ new exercise content in one click.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/gpKlxgedd/sandcastle.png"/&gt;&lt;/p&gt;

&lt;p&gt;It’s a shining example of the reason we hire smart people and set them free to get things done. The first time Julian told me about his Sandcastle idea, I didn’t even really understand the direction. Now it’s indispensable.&lt;/p&gt;

&lt;p&gt;Julian also gave our first KA Friday Tech Talk about how to do gradual feature rollouts for various segments of a large userbase. He ended up bringing this full-circle at the end of his internship by building Gandalf, our tool for doing the following:&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/irllxgemx/gandalf.png"/&gt;&lt;br/&gt;&lt;em&gt;Gandalf lets us selectively roll out features to all sorts of different subsections of our userbase.&lt;/em&gt;&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/O84lxgeqn/pass.jpg"/&gt;&lt;br/&gt;&lt;em&gt;“YOU SHA — ok, you guys, Hey!, you guys over there, you can pass — BUT OTHER THAN THEM YOU SHALL NOT PASS.”&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Julian even “accidentally” left his chess set in Mountain View for us to mail back to him, which I’m pretty sure was his way of dropping the mic and walking off stage. “You clean up.”&lt;/p&gt;

&lt;p&gt;In conclusion, University of Waterloo is legit. I skipped over plenty of work done by both David and Julian, and it still makes for an impressive &lt;strike&gt;Fall&lt;/strike&gt; &lt;strike&gt;Winter&lt;/strike&gt; there are seasons in Mountain View? As argued in the previous internship’s summary, any team that’s not dedicating tons of resources to both recruiting and mentoring interns is plain old missing out. We’re loving every minute of working with our interns.&lt;/p&gt;

&lt;h1&gt;BONUS!&lt;/h1&gt;

&lt;p&gt;Much like the phoenix or a &lt;a href="http://twitter.com/dino_joel"&gt;tyrannosaurus flying a fighter jet&lt;/a&gt;, Summer ‘11 intern Joel Burget has risen from out of nowhere and dropped &lt;a href="http://joelburget.com/video-progress-indicators/"&gt;entertaining stories&lt;/a&gt; about &lt;a href="http://joelburget.com/khan-summer/"&gt;his summer’s work&lt;/a&gt;. If you read them, are impressed, and want to hire Joel…you can forget it. He’s now full-time Joel.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;If you wanna tag in next, &lt;a href="http://www.khanacademy.org/r/jobs"&gt;the Summer ‘12 internship class still has openings&lt;/a&gt;.&lt;/em&gt;&lt;/p&gt;</description><link>http://bjk5.com/post/15500332273</link><guid>http://bjk5.com/post/15500332273</guid><pubDate>Sun, 08 Jan 2012 02:49:00 -0500</pubDate></item><item><title>.end() makes jQuery DOM traversal beautiful</title><description>&lt;p&gt;
This is my new favorite jQuery trick. I just learned it this year and have mentioned it in enough code reviews to decide it’s worth sharing.
&lt;/p&gt;

&lt;p&gt;
When manipulating the DOM with jQuery, you often see code that looks something like:
&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;$("#container").show();
$("#container .error").hide();
$("#container .zoo").css("background-color", "white");
$("#container .zoo .monkeys").empty();
$("#container .zoo .title").text("The zoo is empty");
$("#container .zoo input").val("");
$("#container .zoo").animate({height: 250});

&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;…or, if somebody gets concerned about performance, they might try to reduce DOM lookups:&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;var container = $("#container");
container.show();
container.find(".error").hide();
container.find(".zoo").css("background-color", "white");
...

&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;…and so on. Odds are, when you’re manipulating a single element like &lt;code&gt;container&lt;/code&gt;, you’ll probably be doing something to nearby elements in the next few lines of code.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/Icglwtqya/emma.png"/&gt;&lt;br/&gt;&lt;em&gt;Readers of this blog, meet Emma. Emma, meet the three readers of this blog.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Enter &lt;a href="http://api.jquery.com/end/"&gt;&lt;code&gt;.end()&lt;/code&gt;&lt;/a&gt;, newlines, indentation, and chaining. When you have one jQuery chain going and modify it with, say, &lt;code&gt;.find()&lt;/code&gt;, &lt;em&gt;you’re actually pushing the new chained set of elements onto a stack&lt;/em&gt;. &lt;code&gt;.end()&lt;/code&gt; pops the current jQuery chain off the stack, which lets you do stuff like this:&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;$("#container")
    .show()
    .find(".error")
        .hide()
        .end()
    .find(".zoo")
        .css("background-color", "white")
        .find(".monkeys")
            .empty()
            .end()
        .find(".title")
            .text("The zoo is empty")
            .end()
        .find("input")
            .val("")
            .end()
        .animate({height: 250});

&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;It’s easy to read, because the indentation is significant and matches up with DOM nesting levels. It gets rid of unnecessary DOM lookups. But most importantly for me, it feels natural to indent in and out as I write the code, using small additional selectors to step deeper into the DOM and .end() to find my way back out.&lt;/p&gt;

&lt;p&gt;I’ve been destroying my old, ugly &lt;code&gt;var&lt;/code&gt;’s left and right with this trick. I hope it helps somebody else.&lt;/p&gt;</description><link>http://bjk5.com/post/14819494947</link><guid>http://bjk5.com/post/14819494947</guid><pubDate>Mon, 26 Dec 2011 13:52:46 -0500</pubDate></item><item><title>Laughing at Others' Code</title><description>&lt;p&gt;
Those who have worked with me will know that I’m an expert on this topic because my code gets laughed at all the time.
&lt;/p&gt;

&lt;p&gt;
I’ve seen Good laughing and Bad laughing. Good is what I imagine happens when Robert De Niro sits next to Al Pacino as they’re watching Al’s cameo in &lt;a href="http://www.rottentomatoes.com/m/jack_and_jill_2011/"&gt;some trainwreck of an Adam Sandler movie&lt;/a&gt;, and Bob turns to Al smiling and says, “This is awful.” It’s when you stare at some code and think, “Good grief. I can just &lt;em&gt;imagine&lt;/em&gt; whatever took priority over making this code more reasonable.” There’s a knowing wink and a friendly jab between the laughed-at ghost-coder and the laugher:
&lt;/p&gt;

&lt;blockquote&gt;
Hah! I almost feel bad that you wound up solving it this way. I’ve been there before. You must be exhausted. Why don’t you sit down, I’ll take it from here.
&lt;/blockquote&gt;

&lt;p&gt;
Good laughter contains respect for the fact that &lt;em&gt;this code exists at all and is being worked on by more than one programmer&lt;/em&gt;, which is more than you can say for what I’d bet is a whole boatload of perfectly refactored, unused files littering hard drives around the world right now.
&lt;/p&gt;

&lt;p&gt;
That’s the type of laugher that’s erupting at Khan Academy these days, and it’s no coinkydink that now is right about when a team of top-notch coders are getting their first gazes into some of my previous &lt;strike&gt;creations&lt;/strike&gt;abysses. I can say with certainty that in these cases the knowing winks and playful jabs are well-deserved.
&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/Zyglw97i8/laughing-dog-article.jpg"/&gt;&lt;br/&gt;&lt;em&gt;The rare (and best) third type of laughter.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;
A quick story before we get to the Bad laughter. Did you know that when Sal was a one-man show, the entire Khan Academy application was one big main.py file? At least the server-side stuff. All the request handlers, URL mappings, datastore models, data migrations, and even some HTML generation in one big 1000+ line file.
&lt;/p&gt;

&lt;p&gt;
How funny is that! And it stayed that way for months! I mean, &lt;u&gt;please&lt;/u&gt;. Who the heck wants to work on a codebase that’s one big file? If you haven’t detected the dripping sarcasm yet, recalibrate your sarcasm detector and start this paragraph again.
&lt;/p&gt;

&lt;p&gt;
It’s easy to see how judging Sal by that one big file while he was busy making 2400+ free educational videos would be like judging a geek for wearing a t-shirt while she was just trying to look presentable enough to get to her computer to start writing code. Guess what? Sal’s code is still around, and it’s responsible for helping teach literally millions of students. Yet, as time goes on, it gets more and more likely that one day somebody will laugh at an out-of-place line with the type of judgment that can only come from being out-of-touch with what really mattered back then…and the fact that that line helped change many students’ lives.
&lt;/p&gt;

&lt;p class="center"&gt;&lt;a href="http://twitter.com/#!/patio11/status/145188512109576193"&gt;&lt;img src="http://static.tumblr.com/9hgswys/nqjlw8n87/screen_shot_2011-12-15_at_1.19.07_am.png"/&gt;&lt;/a&gt;&lt;br/&gt;&lt;em&gt;You’ve gotta bend this brilliant tweet a bit to apply it to non-profit education,&lt;br/&gt;but you’ll notice “good code” and “bad code” aren’t on the list.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;
Bad laughter doesn’t need much explanation, it just lacks respect. It happens too much in our industry, and I’m not sure why. I’m proud to say that it’s not a problem at Khan at all, but we haven’t always been 100% immune. We weren’t always 100% immune at Fog Creek.  I’ve been guilty of this laughter myself, and I’d bet money it exists elsewhere. It’s most common among coders who feel like they need to prove themselves, and it can be combatted by a team that emphasizes shipping and the healthy laughter that comes from reminiscing about the last crappy &lt;a href="http://bjk5.com/post/2954631955/messy-solutions-work-just-as-well"&gt;hack you were responsible for when you decided to Just Ship It&lt;/a&gt;.
&lt;/p&gt;

&lt;p&gt;Here’s (just one of) ours:&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;PLAYLIST_STRUCTURE = [
    {
        "name": "Math",
        "items":
            [
                {
                    "name": "Arithmetic",
                    "playlist": "Arithmetic"
                },
                {
                    "name": "Developmental Math",
                    "items": [
                    ...

&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;That’s our current Khan playlist structure, defined in code. When Sal adds or renames a playlist, we have to change the code. Laugh it up.&lt;/p&gt;

&lt;p&gt;This will actually go away soon in favor of something much nicer, and I’m not arguing for crappy code. I’m putting this example here because it got us this far, without many problems, and who knows where we’d be if Sal had spent the first iteration of &lt;a href="http://www.khanacademy.org"&gt;khanacademy.org&lt;/a&gt; trying to decide on the perfect playlist data structure.&lt;/p&gt;

&lt;p class="center"&gt;&lt;object width="425" height="344"&gt;&lt;param name="movie" value="http://www.youtube.com/v/PaGTQMAIMhY&amp;hl=en&amp;fs=1"&gt;&lt;param name="allowFullScreen" value="true"&gt;&lt;embed src="http://www.youtube.com/v/PaGTQMAIMhY&amp;hl=en&amp;fs=1" type="application/x-shockwave-flash" allowfullscreen="true" width="425" height="344"&gt;&lt;/embed&gt;&lt;/object&gt;&lt;br/&gt;&lt;em&gt;…and a more rambling attempt to get a similar point across to a group of UIUC students by playing &lt;a href="http://www.khanacademy.org/video/thank-you-khan-academy"&gt;this powerful Thank You, Khan Academy video&lt;/a&gt; before revealing main.py.&lt;/em&gt;&lt;/p&gt;</description><link>http://bjk5.com/post/14265572563</link><guid>http://bjk5.com/post/14265572563</guid><pubDate>Thu, 15 Dec 2011 11:39:00 -0500</pubDate></item><item><title>After giving logged out users access to pretty much everything*</title><description>&lt;p&gt;We had some heated debates a while ago about &lt;a href="http://bjk5.com/post/3716277312/should-khan-academy-follow-stack-overflows"&gt;what would happen if we opened up all of Khan Academy’s content for logged out users&lt;/a&gt;. Sal’s videos have always been open in this way, of course, but all the interactive exercises and statistical tracking and badges and stuff required an account.&lt;/p&gt;

&lt;p&gt;It felt like the right move when we reconfirmed our belief that educational content should be as open and available as possible. We were also persuaded by &lt;a href="http://www.avc.com/a_vc/2011/06/dont-forget-your-logged-out-users.html"&gt;Fred Wilson’s belief&lt;/a&gt; that giving logged out users more power is an effective way to empower your community. But we worried that registrations would drop, because by handing our 250+ exercises to logged out users, we’d be drastically shrinking the carrot on the other side of the “please login!” boundary.&lt;/p&gt;

&lt;p&gt;&lt;a href="http://bjk5.com/post/8826207372/khan-academy-internship-summer-11"&gt;We decided to go for it this summer&lt;/a&gt;. Figured I’d share some results.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/KvFlw19kj/flossi-golden-retriever1.jpg"/&gt;&lt;br/&gt;&lt;em&gt;A dog&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;4+ months after the change, we know a little more. Jace looked at the data and found:&lt;/p&gt;

&lt;ul&gt;&lt;li&gt;Registration rate &lt;strong&gt;hasn’t&lt;/strong&gt; changed. Bit of a surprise for both sides of the debate.&lt;/li&gt;
&lt;li&gt;Percentage of our visitors who try an exercise problem increased by (relative) 10-15%.&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;So more visitors are trying exercises, but they’re not converting into more registered users…yet. We could have fun making up all sorts of explanations. Maybe we need to show off the badges and points unregistered users are accumulating a little bit more, maybe we’re not asking visitors to login forcefully enough, maybe doing math exercises makes people tired, maybe we don’t have enough pictures of golden retrievers on the login page.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/Q9Llw199d/exusers.png"/&gt;&lt;br/&gt;&lt;em&gt;Percentage of all visitors who use our exercises&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Far more important than any random explanation is the fact that we’re now getting X% more data about how users learn (or don’t learn) thanks to these new exercise visitors. That data is powering some of the &lt;a href="http://david-hu.com/2011/11/02/how-khan-academy-is-using-machine-learning-to-assess-student-mastery.html"&gt;best work coming out of Khan Academy so far&lt;/a&gt;, so feeding more logged out users into our exercises is, as Jace puts it, a big win on data collection.&lt;/p&gt;

&lt;p&gt;Plus, we’re confident that we could iterate and A/B test our way to higher registration rates for our new exercise users. It’s not our priority (for this week, at least). We’re busy cooking up important changes to the core learning experience.&lt;/p&gt;

&lt;p&gt;*They don’t have access to &lt;em&gt;everything&lt;/em&gt;. The ability to coach and communicate with other users is still restricted to users who have logged in.&lt;/p&gt;</description><link>http://bjk5.com/post/14059107433</link><guid>http://bjk5.com/post/14059107433</guid><pubDate>Sun, 11 Dec 2011 04:48:25 -0500</pubDate></item><item><title>How to make "consecutive days of Khan Academy activity" badges</title><description>&lt;p&gt;&lt;ol&gt;&lt;li&gt;Think how cool it would be if users were rewarded after learning for X consecutive days.&lt;/li&gt;
&lt;li&gt;Think about implementation for a second and then go, “Sweet! This’ll be trivial Let’s knock it out Here we go I’ve got things to do!”
&lt;br/&gt;&lt;br/&gt;&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/mdxlvge1g/2.png"/&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;Write a line of code or two.&lt;/li&gt;
&lt;li&gt;Get sucker-punched by &lt;a href="http://bjk5.com/post/2877789021/to-all-the-big-boys-solving-the-internets-identity"&gt;the gruesome specter of timezones&lt;/a&gt; when realizing that a student doing work at 8am on Thursday and 9pm on Friday should probably still earn their badge even though over 24 hours of non-work elapsed.
&lt;br/&gt;&lt;br/&gt;&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/Zt2lvge07/1.png"/&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;Think “How does Stack Exchange do this?” and discover that while they suffer from the timezone bug, &lt;a href="http://meta.stackoverflow.com/questions/55483/proposed-consecutive-days-badge-tracking-change"&gt;passionate Stack Exchange users have &lt;em&gt;written actual code&lt;/em&gt; to do the trick&lt;/a&gt; without asking users for timezone information.&lt;/li&gt;
&lt;li&gt;Follow those passionate users’ suggestions, knock it out, and enjoy a few weeks later when the most dedicated users start earning badges for 30 days of consecutive learning.
&lt;br/&gt;&lt;br/&gt;&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/mg6lvge1q/3.png"/&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;/ol&gt;&lt;/p&gt;</description><link>http://bjk5.com/post/13529957109</link><guid>http://bjk5.com/post/13529957109</guid><pubDate>Tue, 29 Nov 2011 22:17:04 -0500</pubDate></item><item><title>A/B testing still works. [Sarcastic *PHEW*].</title><description>&lt;p&gt;After releasing &lt;a href="http://bjk5.com/post/10171483254/a-bingo-split-testing-now-on-app-engine-built-for-khan"&gt;GAE/Bingo&lt;/a&gt;, we received a number of worried correspondences from various very worried correspondents. It seems that GAE/Bingo, along with practically every other A/B testing framework out there, &lt;a href="http://www.evanmiller.org/how-not-to-run-an-ab-test.html"&gt;violates some purist principles of how to do significance testing&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;The crux of the argument, reworded so simply that I’m pretty sure all statisticians (I admittedly know nothing about stats) would string me up:&lt;/p&gt;

&lt;blockquote&gt;If you repeatedly check the results of an experiment, sometimes you’ll see statistically significant results that aren’t actually significant.&lt;br/&gt;&lt;br/&gt;
So if you’re constantly checking your A/B dashboard and making decisions based on what it tells you, you’re often screwing up.&lt;/blockquote&gt;

&lt;p&gt;It’s a mathematically sound argument, as explained to me by my much smarter teammates. And it must be absolutely devastating for all the programmers who went out and bought the &lt;a href="http://store.razerzone.com/store/razerusa/en_US/pd/productID.231103000/parentCategoryID.35208800/categoryId.36716300"&gt;Razer Mamba Elite Wireless Gaming Mouse&lt;/a&gt; just to increase their click speed so they could mash the refresh button on their A/B dashboards as fast as possible.&lt;/p&gt;

&lt;p&gt;Here’s the thing. I know of absolutely nobody who runs an A/B test like a crazed puppy who keeps sprinting loops around your legs hoping that…..ohboyohboyohboyohboy…..after the next 360° you’ll have lowered the puppy treat to the floor.&lt;/p&gt;

&lt;p&gt;That doesn’t mean the argument isn’t valid. If you &lt;em&gt;do&lt;/em&gt; check your dashboard every 5 seconds like a crazed puppy and immediately end experiments at the first sign of stat sig, &lt;a href="http://www.evanmiller.org/how-not-to-run-an-ab-test.html"&gt;then you probably should read the article&lt;/a&gt; and…..ummmmm…..find better uses for your time.&lt;/p&gt;

&lt;p&gt;Luckily for us, one of my much smarter teammates with much more experience analyzing numbers’n’stuff landed an early modification to GAE/Bingo that should pacify all worried correspondents:&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/sTuluoxp8/ab.png"/&gt;&lt;br/&gt;&lt;em&gt;A historical graph of one of our A/B tests and each alternative’s performance. On our dashboard it’s interactive, weeeeeeeee.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;By showing this graph everywhere our dashboard shows A/B results and waiting for the results to stabilize, we can be confident that we’re not making a snap judgment in the zone of idiotic decisions.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/nxgluprjk/idiotic.png"/&gt;&lt;br/&gt;&lt;em&gt;“&lt;a href="http://www.dangerzone.me/"&gt;Danga zone&lt;/a&gt;”&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Ok, good. We’re safe. But what about everybody else? Did &lt;a href="http://blog.fogcreek.com/our-marketing-is-up-fog-creek-and-what-we-did-about-it/"&gt;Fog Creek&lt;/a&gt; and &lt;a href="http://37signals.com/svn/posts/2991-behind-the-scenes-ab-testing-part-3-final"&gt;37signals&lt;/a&gt; and everybody including Google immediately start hemorrhaging money due to their reliance on faulty A/B tests which this truth came to light???&lt;/p&gt;

&lt;p&gt;My guess is no, because A) they aren’t making snap judgments at the first sign of stat sig and B) with significant traffic, many of our A/B test experiments don’t even &lt;em&gt;have&lt;/em&gt; a zone of idiotic decisions. Lots of ‘em look something like this:&lt;/p&gt;

&lt;p class="center"&gt;&lt;nobr&gt;&lt;img src="http://static.tumblr.com/9hgswys/qnPluoyqr/1.png"/&gt; &lt;img src="http://static.tumblr.com/9hgswys/Lf2luoyyr/22.png"/&gt;&lt;/nobr&gt;&lt;br/&gt;&lt;img src="http://static.tumblr.com/9hgswys/q6Rluoys1/3.png"/&gt;&lt;/p&gt;

&lt;p&gt;…and it’s pretty clear in which cases a difference has been made.&lt;/p&gt;</description><link>http://bjk5.com/post/12829339471</link><guid>http://bjk5.com/post/12829339471</guid><pubDate>Tue, 15 Nov 2011 02:51:00 -0500</pubDate></item><item><title>App Engine Performance Hacks You'll Probably Never Need, Part I </title><description>&lt;p&gt;&lt;a href="http://bjk5.com/post/10171483254/a-bingo-split-testing-now-on-app-engine-built-for-khan"&gt;Building GAE/Bingo&lt;/a&gt; required reaching into the bag of performance tricks a couple times. We needed long-term persistence of the data behind many A/B experiments, with stats accumulating at 500 reqs/sec, without slowing down pageloads.&lt;/p&gt;

&lt;p&gt;Some of the wabbits we pulled out of the hat are pretty cool. Some are probably really stupid &lt;a href="http://bjk5.com/post/2954631955/messy-solutions-work-just-as-well"&gt;but get the job done&lt;/a&gt;. I’ll throw a couple your way and let you choose which is which.&lt;/p&gt;

&lt;h1&gt;Access a select few from a list of entities on every single request — and you don’t know which until the request is done&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;GAE/Bingo makes it easy to run A/B experiments in one line of code: &lt;code&gt;ab_test("monkeys")&lt;/code&gt;. This means during any given request, an individual user might interact with a number of different experiments depending on various code paths. Without knowing ahead of time which &lt;code&gt;ab_test("monkeys") or ab_test("gorillas") or ab_test("chimpanzees")&lt;/code&gt;’s are going to run, we need to minimize the number of roundtrips spent talking to memcache or the datastore.&lt;/p&gt;

&lt;a href="http://www.offrench.net/photos/gallery-3_photo-406.php"&gt;&lt;img src="http://static.tumblr.com/9hgswys/uq6ltgjdm/boat.jpg" align="right" class="rightInset"/&gt;&lt;/a&gt;

    &lt;p&gt;At first it makes sense to put a collection of all &lt;code&gt;Experiment&lt;/code&gt; models in a single memcache slot. This is kinda helpful because at the beginning of the request you can:&lt;/p&gt;

    &lt;pre&gt;&lt;code&gt;experiments = memcache.get("experiments")

&lt;/code&gt;&lt;/pre&gt;

    &lt;p&gt;…and then each time you need to work with an experiment you can:&lt;/p&gt;

    &lt;pre&gt;&lt;code&gt;experiment = experiments[experiment_name]

&lt;/code&gt;&lt;/pre&gt;

    &lt;p&gt;You’ve only got one memcache call regardless of how many experiments you’ll be interacting with on each request.&lt;/p&gt;

    &lt;p&gt;There’s a big problem. Getting a bunch of objects out of memcache also involves deserializing all of those objects, not just transferring them over the wire. And at least until the &lt;a href="https://sites.google.com/site/gaepython27testing/"&gt;2.7 release&lt;/a&gt; ships, deserializing objects innnn ppuuurreeee Pyyyyttthhhooonnnnn iiiiiiiiiisssssssssssssss rrrreaaaaaaaaaaaaalllllllllllllyyyyyyyyyyyyy ssssssssssssssssssslllllllllllllllllllllloooooooooooooooooooowwwwwwwwwwwwwwwwwwwwww. If you’re running, like, 50 live A/B experiments and your user needs to interact with, like, three of them when requesting &lt;code&gt;/profile&lt;/code&gt;, you’ve got, like, 47 experiment-deserializations worth of performance waste.&lt;/p&gt;

    &lt;p&gt;Here’s where we pulled out the same trick we first used when building a &lt;a href="http://bjk5.com/post/2562662487/badges-on-app-engine-implementing-a-real-time-badge"&gt;fast real-time badging system for Khan Academy&lt;/a&gt;. Since you’ll almost never be interacting with all of the experiments in an individual request, you really really Really don’t want to spend time deserializing them. So what happens if you serialize the objects once (in this case using protocol buffers) &lt;em&gt;before&lt;/em&gt; putting them in the memcache collection?&lt;/p&gt;

    &lt;p&gt;Things are a little bit slower when creating the collection:&lt;/p&gt;

    &lt;pre&gt;&lt;code&gt;memcache.set(
    "experiments",
    {
        "monkey": db.model_to_protobuf(experiment_monkey).Encode(),
        "gorilla": db.model_to_protobuf(experiment_gorilla).Encode(),
        ...
    }
)

&lt;/code&gt;&lt;/pre&gt;

    &lt;p&gt;Getting the collection from memcache is MUCH faster:&lt;/p&gt;

    &lt;pre&gt;&lt;code&gt;experiments = memcache.get("experiments")

&lt;/code&gt;&lt;/pre&gt;

    &lt;p&gt;…because instead of deserializing 50 experiment models, you’re unpacking 50 pre-serialized protocol buffers. Fast. Many much fast.&lt;/p&gt;

    &lt;p&gt;Now, when you need an actual experiment model, you just:&lt;/p&gt;

    &lt;pre&gt;&lt;code&gt;experiment = db.model_from_protobuf(entity_pb.EntityProto(experiments[experiment_name]))

&lt;/code&gt;&lt;/pre&gt;

    &lt;p&gt;…and only pay the deserialization penalty when you actually need to use the object.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/wKVltginu/screen_shot_2011-10-22_at_12.42.34_am.png"/&gt;&lt;br/&gt;&lt;em&gt;This screenshot from my recent Khan Academy Friday tech talk should make everything totally clear. Especially without any context, I’m pretty sure seeing a picture of a gnome riding a platypus while carrying a monkey explains everything.&lt;/em&gt;&lt;/p&gt;

    &lt;p&gt;Bottom line: we make one single memcache call coupled with the minimum amount of experiment deserialization necessary, regardless of how many A/B experiments are running or which experiments are used by each request. There are &lt;a href="http://kovshenin.com/archives/pickle-vs-json-which-is-faster/"&gt;lots of arguments over the fastest way to (de)serialize objects in App Engine&lt;/a&gt; — the fastest is to avoid the issue as much as possible.&lt;/p&gt;

    &lt;p&gt;&lt;em&gt;Where we use this:&lt;/em&gt;&lt;/p&gt;

    &lt;p&gt;&lt;a href="http://bjk5.com/post/10171483254/a-bingo-split-testing-now-on-app-engine-built-for-khan"&gt;Split testing experiments&lt;/a&gt; and our &lt;a href="http://bjk5.com/post/2562662487/badges-on-app-engine-implementing-a-real-time-badge"&gt;real-time badge framework&lt;/a&gt;.&lt;/p&gt;

&lt;h1&gt;put_async without waiting for the put to finish — someone’s gonna yell at me&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;I’ll get in trouble for this or maybe even ruin the fun for everyone. This involves starting an asynchronous datastore put via &lt;code&gt;db.put_async&lt;/code&gt; and then walking away with your hands in your pockets acting like nothing happened.&lt;/p&gt;
    
    &lt;p&gt;There are &lt;a href="http://stackoverflow.com/questions/7244081/appengine-put-async-doesnt-work-at-least-in-the-development-server/7250613#7250613"&gt;very clear instructions by the talented App Engine team&lt;/a&gt; that you should find some time to wait for the &lt;code&gt;get_result()&lt;/code&gt; of any call to &lt;code&gt;db.put_async(monkey)&lt;/code&gt;. It’s also very clear that if you don’t wait for put_async to finish, App Engine is going to wait for you. In other words, you can’t magically send off a bunch of put_async’s and then send your response to the user without waiting for the put to complete.&lt;/p&gt;

    &lt;pre&gt;&lt;code&gt;db.put_async(experiment_monkey)
return render_template("mwuuahaha_im_not_doing_anything_else.html")

&lt;/code&gt;&lt;/pre&gt;

    &lt;p&gt;You can, however, send off a &lt;code&gt;put_async&lt;/code&gt; and then do everything else your request could possibly think of doing (including rendering templates and such) without waiting for the response. App Engine will make sure the response finishes, but if you just kick off the &lt;code&gt;put_async&lt;/code&gt; and then walk away and handle the rest of your request, you can maximize concurrency of your request’s work w/ the asynchronous put.&lt;/p&gt;

    &lt;p&gt;There are *lots* of other ways to get a very similar effect. All of them are probably more kosher. I won’t list them here. This just happens to be a neat little trick that you can trigger with one line of code without worrying about any other boilerplate.&lt;/p&gt;

    &lt;p&gt;&lt;em&gt;Where we use this:&lt;/em&gt;&lt;/p&gt;

    &lt;p&gt;&lt;a href="https://khanacademy.kilnhg.com/Repo/Website/Group/stable/Files"&gt;Find the spots yourself&lt;/a&gt; and make fun of me. I have a strong feeling this’ll be replaced in the future.&lt;/p&gt;

&lt;h1&gt;Long-term persistence without waiting on the datastore&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;This one doesn’t belong in a “you’ll probably never need” post. It’s extremely common and handy: throw data in memcache (fast) and then run a background task or cron job that persists the data from memcache to the datastore (slow).&lt;/p&gt;

    &lt;p&gt;
&lt;a href="http://www.flickr.com/photos/livenature/444275529/"&gt;&lt;img align="left" class="leftInset" src="http://static.tumblr.com/9hgswys/ugcltgj78/boat.jpg"/&gt;&lt;/a&gt;
We actually get a little trickier because we need to persist lots of data that’s coming in quite often: each and every user’s participation and conversions in each and every A/B test. These events could be triggered multiple times per request for each user. It’s not quite clear how we’d put this data in memcache and what scheme would be running in the background to send it all to the datastore.&lt;/p&gt;

    &lt;p&gt;We opted for a bucketing system. Every time a user participates or converts in an A/B test, we randomly choose one of 50 memcache buckets and throw their user id in the bucket. When any of those buckets begins to overflow, we fire off a deferred task queue task to poke through the overflowing bucket, pull each user’s data out of memcache, and whisk it into the datastore.&lt;/p&gt;

    &lt;pre&gt;&lt;code&gt;bucket = random.randint(0, 50)
key = "_gae_bingo_identity_bucket:%s" % bucket

list_identities = memcache.get(key) or []
list_identities.append(ident)

if len(list_identities) &gt; 50:
    deferred.defer(persist_gae_bingo_identity_records, list_identities)

&lt;/code&gt;&lt;/pre&gt;

    &lt;p&gt;&lt;em&gt;Where we use this:&lt;/em&gt;&lt;/p&gt;

    &lt;p&gt;&lt;a href="http://github.com/kamens/gae_bingo"&gt;GAE/Bingo&lt;/a&gt; and, in simpler fashions, pretty much all over the place.&lt;/p&gt;

&lt;h1&gt;More wabbits where those came from&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;If any of these hacks help someone else out, &lt;a href="http://twitter.com/kamens"&gt;please let me know ASAP&lt;/a&gt; so I can win the bet against myself.&lt;/p&gt;

&lt;p&gt;Regardless, expect more of these posts in the future. Tricks like these have been critical to keeping Khan Academy fast while adding &lt;a href="http://github.com/kamens/gae_mini_profiler"&gt;new&lt;/a&gt; &lt;a href="http://github.com/kamens/gae_bingo"&gt;tools&lt;/a&gt;.&lt;/p&gt;</description><link>http://bjk5.com/post/11766098283</link><guid>http://bjk5.com/post/11766098283</guid><pubDate>Sat, 22 Oct 2011 04:08:43 -0400</pubDate></item><item><title>A/Bingo split testing now on App Engine, built for Khan Academy</title><description>&lt;p&gt;Continuing my trend of straight-up &lt;a href="http://bjk5.com/post/6944602865/google-app-engine-mini-profiler"&gt;copying the work of the smartest people I know&lt;/a&gt;, I recently decided to tackle &lt;a href="http://www.khanacademy.org"&gt;Khan Academy&lt;/a&gt;’s A/B testing problem (we didn’t have any A/B testing) by bringing &lt;a href="http://www.kalzumeus.com/"&gt;Patrick McKenzie&lt;/a&gt;’s &lt;a href="http://www.bingocardcreator.com/abingo"&gt;A/Bingo&lt;/a&gt; into App Engine land.&lt;/p&gt;

&lt;p&gt;So here you go: &lt;a href="https://github.com/kamens/gae_bingo"&gt;GAE/Bingo is released and should get anyone on App Engine up and A/B testing in minutes&lt;/a&gt;. It’s currently in production on Khan Academy and performing well with hundreds of requests per second.&lt;/p&gt;

&lt;h1&gt;Cool! But what’s A/Bingo?&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;
&lt;a href="http://www.bingocardcreator.com/abingo"&gt;A/Bingo&lt;/a&gt; is an &lt;a href="http://en.wikipedia.org/wiki/A/B_testing"&gt;A/B testing&lt;/a&gt; framework for Ruby on Rails. It’s specifically designed to make the creation of split test experiments as quick and painless as possible.
&lt;/p&gt;

&lt;p&gt;&lt;em&gt;GAE/Bingo&lt;/em&gt; is a re-imagining of &lt;a href="http://www.bingocardcreator.com/abingo/design"&gt;this framework’s core design principles&lt;/a&gt; inside of Google App Engine. GAE/Bingo was specifically built for use at Khan Academy, which means:
&lt;/p&gt;

&lt;ul&gt;&lt;li&gt;GAE/Bingo is highly optimized for App Engine. Drop it right into any Python App Engine app and you’ll be all set. It’s running in production for us with minimal impact on page load times.&lt;/li&gt;
&lt;li&gt;GAE/Bingo works hard to persist experiment data for long periods of time without sacrificing performance.
&lt;ul&gt;&lt;li&gt;Unlike most A/B experiments out there, we may keep an eye on the educational results of an experiment for months and months after a student started down their A/B path.
&lt;/li&gt;
&lt;li&gt;Heck, we may even need to correlate our A/B student splits with offline data, like end-of-the-year test scores.&lt;/li&gt;
&lt;/ul&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;h1&gt;Why do this?&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;
We’ve got a million and one ideas to try out at Khan Academy. What tweak to our game mechanics will best motivate students to challenge themselves? What message makes it most likely for a student to sit back and watch a video when they really need to take time, slow down, and re-learn a core concept?
&lt;/p&gt;

&lt;p&gt;
An A/B testing framework gives us the tools necessary to start answering these questions with experiments and hard(er) data. With ~1.5MM practice exercises answered per school day by Khan Academy students, we have a treasure trove of student activity from which to learn.
&lt;/p&gt;

&lt;p&gt;
We also wanted to spread the love. Patrick helped out the Rails community by open sourcing &lt;a href="http://www.bingocardcreator.com/abingo"&gt;A/Bingo&lt;/a&gt;, and we wanted to do the same for App Engine. I also couldn’t find any Python split testing framework that satisfied our needs and stayed true to the &lt;a href="http://www.bingocardcreator.com/abingo/design"&gt;design principles of A/Bingo&lt;/a&gt;.
&lt;/p&gt;

&lt;p&gt;Plus, why not take advantage of the fact that App Engine’s vertical stack empowers framework creators to go pretty far when it comes to creating a drop-in, It Just Works experience? We hope GAE/Bingo accomplishes this and helps out some others in the community.
&lt;/p&gt;

&lt;h1&gt;How’s it work?&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;Start an A/B test in one line:&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;# Returns "chimpanzee" to half your users and "zorilla" to the other half
animal = ab_test("cute_logo_animal", ["chimpanzee", "zorilla"])&lt;/code&gt;&lt;/pre&gt;&lt;br/&gt;&lt;p&gt;…and when something good happens, score a conversion in one line:&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;bingo("cute_logo_animal")&lt;/code&gt;&lt;/pre&gt;&lt;br/&gt;&lt;p&gt;
These two lines will automatically take care of experiment creation, user tracking, consistent A/B results for each individual user, and statistical analysis. &lt;a href="https://github.com/kamens/gae_bingo#readme"&gt;You can do a lot more, of course, when it comes to specifying alternatives and tracking conversions — check out the docs.&lt;/a&gt; There are some pretty simple (optional) hooks that make it very easy to get consistent A/B results even when your users transition from anonymous to logged-in.
&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/Yrplrh6l1/screen_shot_2011-09-13_at_12.09.52_pm.png"/&gt;&lt;br/&gt;&lt;em&gt;Trivial example: an A/B test proving that messaging a student with “You’re ready to move on!” is statistically more likely to encourage a student to move into to new content than “Nice work!”&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Once at least one user causes the above lines of code to execute, you’ll get statistical analysis and be able to control your experiment from the dashboard.&lt;/p&gt;

&lt;h1&gt;Can I use it? Can I tweak it?&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;Please do. &lt;a href="http://twitter.com/kamens"&gt;Let me know how it goes via Twitter&lt;/a&gt; or &lt;a href="mailto:ben@khanacademy.org"&gt;email&lt;/a&gt;. Patch up all the inevitable bugs and fill in &lt;a href="https://github.com/kamens/gae_bingo#non-features"&gt;all the major holes left by our desire to ship v1&lt;/a&gt;. We’ll be continuing to improve the framework, and all help is welcome.&lt;/p&gt;

&lt;p&gt;Enormous thanks goes out to Patrick McKenzie for his framework’s inspiration and the encouragement to follow his lead. I’ll be blogging more in the future about how we’re using GAE/Bingo and how we keep track of hundreds of requests per second w/ persistent storage and minimal impact on page load times.&lt;/p&gt;</description><link>http://bjk5.com/post/10171483254</link><guid>http://bjk5.com/post/10171483254</guid><pubDate>Tue, 13 Sep 2011 15:32:41 -0400</pubDate></item><item><title>Khan Academy Internship, Summer '11</title><description>&lt;p&gt;&lt;em&gt;Want to be handed a major portion of Khan Academy ownership, ridiculously high expectations, and a bunch of mentorship from our full-time devs? &lt;a href="http://www.khanacademy.org/jobs"&gt;Sign up now.&lt;/a&gt; We believe anybody can help the world get a great education, and we accept interns year-round.&lt;/em&gt;&lt;/p&gt;

&lt;hr&gt;&lt;br/&gt;&lt;p&gt;I can’t remember a time in my history of small company software development that hasn’t felt like sitting in a rickety donkey kong cart with jet afterburners attached and blazing, and everybody inside is just trying to keep the staples (why did they use &lt;em&gt;staples?&lt;/em&gt;) to hold long enough for us to make it around the next bend in the tracks.&lt;/p&gt;

&lt;p&gt;That being said, at least in my limited donkey kong cart experience, summer internship seasons always stand out in my mind as new high watermarks for shipping speed and dev intensity.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/7d2lpt36s/sincos.png"/&gt;&lt;br/&gt;&lt;em&gt;Just like Sal’s videos, our practice exercises are at the very heart of Khan Academy.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;This summer’s class of Khan Academy interns has been no different. Our interns come in with promises of being handed ownership and control over major, user-facing features, and in return we demand excellence; it’s pretty similar, actually, to Khan Academy’s educational belief of &lt;a href="http://www.ted.com/talks/salman_khan_let_s_use_video_to_reinvent_education.html"&gt;encouraging experimentation but expecting mastery&lt;/a&gt;. They were shipping features on day one.&lt;/p&gt;

&lt;p&gt;Any dev team out there not acknowledging the fact that high school and college students are capable of showing up on your doorstep and almost immediately redefining major portions of your product for the better is either failing to recruit well or is plain old missing out. Big time.&lt;/p&gt;

&lt;p&gt;If that’s you, I hope to change your mind with this post.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Each of the following improvements to Khan Academy was contributed either largely or entirely by our interns this summer. Four of ‘em are in college, one just graduated high school, and one hasn’t even started applying to colleges yet.&lt;/em&gt;&lt;/p&gt;

&lt;br/&gt;&lt;h1&gt;An entirely new collection of practice exercises built on &lt;a href="http://ejohn.org/blog/khan-exercise-rewrite/"&gt;an entirely new exercise framework&lt;/a&gt;.&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;This is a &lt;em&gt;major&lt;/em&gt; body of work.&lt;/p&gt;

&lt;p&gt;We learned about all types of weaknesses in our old exercises after last year’s pilots, and we’ve tackled them head on by improving our hints, removing multiple choice answers, focusing on the user’s exercise experience, and building new ways of asking old questions.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/zuDlpt3gg/choice.png"/&gt;&lt;br/&gt;&lt;em&gt;Almost all multiple choice questions are gone.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;We’ve focused on &lt;a href="http://github.com/khan/khan-exercises"&gt;helping our developers and our community create new exercises quickly&lt;/a&gt;. We’ve written better documentation, shipped simpler dev tools, and built solid bug reporting workflows to maintain a healthy stream of new, quality exercises. Our interns are responsible for not only porting all existing exercises to our new tools but also developing brand new frameworks to help exercises draw graphs, randomize questions, generate procedural hints, and more.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/Qyzlpt3i1/mult.png"/&gt;&lt;br/&gt;&lt;em&gt;The Summer 11 interns’ recently launched new exercises have already served up over 5,000,000 math problems to Khan Academy students.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;We know that at the end of the day, the only thing that matters is whether or not Khan Academy students are really learning, and a large quantity of quality interactive exercise content is core to that mission. KA wouldn’t be what it is today without the large quantity of quality videos Sal has created. As a development team and community, we should consider ourselves challenged to match his videos with quality exercises. The team’s efforts this summer have given us the tools necessary to take a crack at this considerable challenge.&lt;/p&gt;

&lt;p&gt;In fact, exercises are so important to us that we’re now hiring &lt;a href="http://www.khanacademy.org/jobs"&gt;full-time exercise developers&lt;/a&gt; to come push these tools to their limits and redefine what it means to learn online. If you want to join some very passionate devs, either &lt;a href="http://www.khanacademy.org/jobs"&gt;apply now&lt;/a&gt; or join our &lt;a href="https://github.com/khan/khan-exercises"&gt;open source exercise community&lt;/a&gt;.&lt;/p&gt;

&lt;br/&gt;&lt;h1&gt;Full access for unregistered users&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;Followers of this blog (also: leprechauns, unicorns) may remember a post in which I struggled to decide &lt;a href="http://bjk5.com/post/3716277312/should-khan-academy-follow-stack-overflows"&gt;if Khan Academy should follow Stack Overflow’s registration model&lt;/a&gt; by allowing non-logged-in users to participate in all of our content and automatically transferring their work to a permanent account after they log in.&lt;/p&gt;

&lt;p&gt;The more we thought about it and read &lt;a href="http://www.avc.com/a_vc/2011/06/dont-forget-your-logged-out-users.html"&gt;posts about unregistered users like Fred Wilson’s&lt;/a&gt;, the more we realized that making access to our educational content as easy as possible was the right thing to do.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/odSlpt3r5/login.png"/&gt;&lt;br/&gt;&lt;em&gt;We track users’ progress and encourage them to log in, but we never get in anyone’s way when they’re trying to learn.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Two interns completely owned the design and implementation of this feature. If you go to Khan Academy now, you can start earning points and badges for watching videos and working on exercises without ever logging in. We encourage users to login at various milestones in their progress, but we never stop them from continuing to use the site or force them to close a popup.&lt;/p&gt;

&lt;p&gt;If you log in, you keep all your progress. This has significantly reduced our bounce rate by getting rid of painful login walls, and we’re continuing to watch other statistics to see the effects of this change.&lt;/p&gt;

&lt;br/&gt;&lt;h1&gt;Video progress tracking&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;I can’t count of the number of times I’ve heard users ask us to display individual video progress next to each one of the 2,500+ video links on our homepage. I’m not gonna get into the various technical challenges here (maybe a different blog post), but this is nontrivial for a brain like mine.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/jiylpt3ud/videoprogress.png"/&gt;&lt;/p&gt;

&lt;p&gt;Luckily, we hire interns that are way smarter than me and are able to solve such problems. These days, whenever you watch a piece of a Khan Academy video, skip around it, pause it, play it, or whatever, we keep track of extremely precise video progress statistics and display useful progress indicators next to every video link.&lt;/p&gt;

&lt;br/&gt;&lt;h1&gt;Twitter and Facebook sharing&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;One of the earliest features launched during Summer ‘11 was the ability to share videos, exercises, and badges on Facebook and Twitter.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/kjrlpt3xq/facebook.png"/&gt;&lt;br/&gt;&lt;em&gt;Facebook sharing has slowly gone up (even during the natural academic lull of summer), and we hope this trend will continue.&lt;/em&gt;&lt;/p&gt;

&lt;br/&gt;&lt;h1&gt;All that and more, powered by interns&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;…and those are just the bigger changes. Our interns continue to claw for &lt;a href="http://www.joelonsoftware.com/items/2007/06/07.html"&gt;inch after inch after inch&lt;/a&gt; of improvements like nicer internal statistics, faster deploy scripts, performance tweaks, and better user account management.&lt;/p&gt;

&lt;p&gt;Summer’s not over yet. &lt;a href="http://omarrizwan.com/"&gt;Omar Rizwan&lt;/a&gt;, &lt;a href="http://twitter.com/#!/rubergly"&gt;Jeff Ruberg&lt;/a&gt;, &lt;a href="http://twitter.com/#!/joelburget"&gt;Joel Burget&lt;/a&gt;, &lt;a href="https://plus.google.com/100044714483635073835/"&gt;Igor Terzic&lt;/a&gt;, &lt;a href="http://twitter.com/#!/ParkerKuivila"&gt;Parker Kuivila&lt;/a&gt;, and &lt;a href="https://plus.google.com/101013822660106280579/posts"&gt;Ben Alpert&lt;/a&gt; continue to set the current bar for Khan Academy internship classes. As an organization, we aim to beat this mark in the future. But those six are pushing hard to make it a tough task, and khanacademy.org is improving for the better, quickly.&lt;/p&gt;

&lt;p&gt;Don’t doubt the inexperienced. Get your team’s &lt;a href="http://www.amazon.com/Smart-Gets-Things-Done-Technical/dp/1590598385"&gt;recruiting&lt;/a&gt;, mentorship, and &lt;a href="http://bjk5.com/post/3994859683/code-reviews-as-relationship-builders-a-few-tips"&gt;code reviews&lt;/a&gt; right (easier said than done), and a summer internship can be one of the best things that’s ever happened to your product. I already can’t wait to drop some major challenges in the laps of our two incoming Fall interns to see what they can build.&lt;/p&gt;

&lt;br/&gt;&lt;h1&gt;Join us&lt;/h1&gt;&lt;br/&gt;&lt;p&gt;Want to be handed a major portion of Khan Academy ownership, ridiculously high expectations, and a bunch of mentorship from our full-time devs? &lt;a href="http://www.khanacademy.org/jobs"&gt;Sign up now.&lt;/a&gt; We believe anybody can help the world get a great education, and we accept interns year-round.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/BF7lpt4ay/badge.png"/&gt;&lt;br/&gt;&lt;em&gt;Big shoes to fill.&lt;/em&gt;&lt;/p&gt;</description><link>http://bjk5.com/post/8826207372</link><guid>http://bjk5.com/post/8826207372</guid><pubDate>Fri, 12 Aug 2011 12:47:00 -0400</pubDate></item><item><title>Fast and slow queues on App Engine</title><description>&lt;p&gt;&lt;strong&gt;tl;dr&lt;/strong&gt; — If you’re using task queues on App Engine and your task execution speeds vary greatly, you can get yourself into serious performance trouble. We addressed this by explicitly separating fast and slow tasks, and &lt;a href="https://github.com/kamens/gae_fast_slow_queue"&gt;we released a little utility to help you do the same&lt;/a&gt;.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/fAblokjgq/screen_shot_2011-07-18_at_11.58.53_pm.png"/&gt;&lt;br/&gt;&lt;em&gt;Only one user has ever earned this badge&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Quick story: even though &lt;a href="http://bjk5.com/post/2562662487/badges-on-app-engine-implementing-a-real-time-badge"&gt;we put in a lot of work making sure Khan Academy users are awarded badges in real-time&lt;/a&gt;, we also run background badging processes to make sure we didn’t miss any. This process uses &lt;a href="http://code.google.com/p/appengine-mapreduce/"&gt;GAE’s mapreduce framework&lt;/a&gt; to map over all users and make sure their badges are up-to-date, and it looks something like:&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;# Called once for every user
def badge_background_check(user):
    if user.has_recent_activity():
        user.update_badges()

&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;&lt;code&gt;has_recent_activity&lt;/code&gt; is really fast, and &lt;code&gt;update_badges&lt;/code&gt; can be really slow. This doesn’t play nice with App Engine’s request scheduler, and here’s why.&lt;/p&gt;

&lt;p&gt;When you start firing off a bunch of tasks to a specific task queue, App Engine keeps a running average of how long tasks in that particular queue are taking. If they’re really fast (&lt; 1000ms is what we’ve heard…), you can think of the task queue being painted with a shiny yellow smiley face. If they’re slow, the queue gets a sad red frowny face stamped on its forehead.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/ZdPlokl1e/untitled.png"/&gt;&lt;br/&gt;&lt;em&gt;Don’t judge just because the sad one sounds like Eeyore. Neither of these situations cause problems.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;If you’ve got a shiny yellow smiley face, App Engine’s scheduler will try to get your tasks done quickly by queuing up your fast tasks in the same lines that your users’ requests wait in. As long as these tasks stay fast, your app will scale when more instances are needed, your users should never notice that they’re standing in the same line as the fast tasks, and all is good.&lt;/p&gt;

&lt;p&gt;Thing is, it’s even ok to have a frowny face. App Engine will use a different, slower scheduler to hand out your work without interrupting user facing requests. You’ll never wait in the same line as a user request, and you can take all the time in the world (as long as the world only lasts for the next 10 minutes) without worrying about someone emailing and complaining that your site’s gotten really slow lately.&lt;/p&gt;

&lt;p&gt;The misery starts when you have a queue that’s mostly fast but hits sporadically slow tasks. Now your queue is all shiny and yellow and smiley and sharing the same checkout lines as user facing requests, but every once in a while a grumpy red frowny face stands in line, takes &lt;em&gt;five full minutes&lt;/em&gt; at the cash register asking about the store’s raincheck coupon policy, and ruins everybody’s day. Your queue’s sporadic behavior is now directly hurting your users’ perceived performance.&lt;/p&gt;

&lt;p&gt;This has caused us some very serious perf hiccups. 90% of our users don’t need to run update_badges on any given day, so the average task speed is very fast. When we hit a slow task, instance request queues can grind to a halt. At our worst, we’ve seen user facing requests sit waiting in the request queue for 9000ms (that’s approximately one full eternity) before our code even gets a chance to run.*&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/tFelokllr/mud.jpg"/&gt;&lt;br/&gt;&lt;em&gt;I was going to put an animated gif of a yellow smiley face that suddenly flashes a red frowny face here, but then I remembered that I’d have to kill myself for having an animated gif.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;The &lt;a href="https://github.com/kamens/gae_fast_slow_queue"&gt;gae_fast_slow_queue utility helps work around this as quickly as possible&lt;/a&gt; by making it easy to run a bunch of fast tasks while identifying slow tasks and splitting them off into a separate queue:&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;@fast_slow_queue.handler(lambda user: user.has_recent_activity())
def badge_background_check(user):
    user.update_badges()

&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;Now, when badge_background_check gets queued up, it’ll always only run the fast lambda function to keep the main queue yellow and smiley. If real work needs to be done, it fires off a different task in a different queue, and this one is guaranteed by our utility to take at least 1000ms so it stays red and frowny forever. GAE’s scheduler will steer these clear of user facing requests, and you don’t have to worry about your task impacting users’ perceived perf.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;* We noticed this after deploying &lt;a href="http://bjk5.com/post/6944602865/google-app-engine-mini-profiler"&gt;gae_mini_profiler&lt;/a&gt; and browsing around the site — every once in a while a developer got frustrated waiting forever for a page to load, then the profiler would come back and add insult to injury by screaming, “Woohoo this page only took 150ms!” You can confirm issues like these by looking for high pending_ms values in your logs.&lt;/em&gt;&lt;/p&gt;</description><link>http://bjk5.com/post/7796556212</link><guid>http://bjk5.com/post/7796556212</guid><pubDate>Tue, 19 Jul 2011 03:59:00 -0400</pubDate></item><item><title>App Engine Mini Profiler and Temporary Redirects</title><description>&lt;p&gt;We just made a small change to &lt;a href="https://github.com/kamens/gae_mini_profiler"&gt;Google App Engine Mini Profiler&lt;/a&gt; to deal with the fact that spitting out profiling stats on every rendered page still misses all the pages that aren’t rendered: the POST side of temporary redirects.&lt;/p&gt;

&lt;p&gt;It’s super common to submit a POST and redirect to a GET. When using a profiler that spits out performance data about the currently rendered page, you lose all of that profiling data about the POST request, even though the user still had to wait for the request to finish.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/jHPlo01kh/redirect-corner.png"/&gt;&lt;br/&gt;&lt;em&gt;Not no more&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Sticking with the belief that making the path from developers to profiling data as short as possible will produce a faster site, we now automatically expose these redirects and all of their performance stats. App Engine Mini Profiler handles this with ajax requests as well (you’ll see two profiler entries in the corner when sending an ajax POST and getting redirected to a GET full of JSON data), and in the unfortunate event that you’re bouncing the user around a long chain of redirects (more than one and you should feel guilty), it’ll keep track of all ‘em.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/LmQlo01ll/redirect-details.png"/&gt;&lt;br/&gt;&lt;em&gt;Exposing the redirect’s data&lt;/em&gt;&lt;/p&gt;</description><link>http://bjk5.com/post/7373318608</link><guid>http://bjk5.com/post/7373318608</guid><pubDate>Fri, 08 Jul 2011 01:23:00 -0400</pubDate></item><item><title>Google App Engine Mini Profiler</title><description>&lt;blockquote&gt;Patrick Bateman: &lt;em&gt;(Looking at the business card) “Look at that subtle off-white coloring. The tasteful thickness of it. Oh my god…”&lt;/em&gt;&lt;/blockquote&gt;

&lt;p&gt;I finally understood the full extent of Bateman’s jealousy recently when reading about the &lt;a href="http://code.google.com/p/mvc-mini-profiler/"&gt;MVC Mini Profiler&lt;/a&gt; created by the Stack Exchange team. My eyes scanned all the features, and I started to lose my mind:&lt;/p&gt;

&lt;ul&gt;&lt;li&gt;“…live, instant feedback on the performance characteristics of the pages we are visiting – in production,”&lt;/li&gt;
&lt;li&gt;“…ubiquitous,”&lt;/li&gt;
&lt;li&gt;“…only visible to developers and has no noticeable impact on the site’s performance,”&lt;/li&gt;
&lt;li&gt;“…drill-down on and share profile sessions,”&lt;/li&gt;
&lt;li&gt;“…ajax calls are displayed as they happen,”&lt;/li&gt;
&lt;li&gt;“…duplicate query detection,”&lt;/li&gt;
&lt;li&gt;“…drop in module for any MVC project,”&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;…my god, it even had a watermark.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://gae-mini-profiler.appspot.com/images/gae-mini-profiler/corner.png"/&gt;&lt;br/&gt;&lt;em&gt;&lt;a href="http://www.codinghorror.com/blog/2011/06/performance-is-a-feature.html"&gt;As Jeff said&lt;/a&gt;, simply showing a render time for all pages can be critical&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;It really hit home for me when reading &lt;a href="http://samsaffron.com/archive/2011/06/09/+Profiling+your+website+like+a+true+Ninja"&gt;Sam Saffron’s post&lt;/a&gt;: “No web frameworks seem to provide a comprehensive approach to page profiling out of the box.” It’s true. This level of ubiquitous profiling baked right into all major web frameworks would really change the game. I decided I couldn’t live without something like mvc-mini-profiler any longer, so we just released &lt;a href="https://github.com/kamens/gae_mini_profiler"&gt;gae_mini_profiler&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://github.com/kamens/gae_mini_profiler"&gt;gae_mini_profiler&lt;/a&gt; is a drop-in, ubiquitous, production profiling tool for Google App Engine &lt;em&gt;heavily&lt;/em&gt; inspired by &lt;a href="http://code.google.com/p/mvc-mini-profiler/"&gt;MVC Mini Profiler&lt;/a&gt;. Since App Engine and MVC have so many fundamental differences, the tools aren’t identical, and it’s not really a port as much as a ridiculously kindred spirit. If you want, you can play around with &lt;a href="http://gae-mini-profiler.appspot.com/"&gt;a gae_mini_profiler-enabled demo of GAE’s example chess app&lt;/a&gt; — in this demo case, the profiler is enabled for all users.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://gae-mini-profiler.appspot.com/images/gae-mini-profiler/ajax-profile.png"/&gt;&lt;br/&gt;&lt;em&gt;Taking a glance at one of our slower pages in production&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;I’m confident that always having all of this data right in front of our developers as we browse around the live Khan Academy site will improve performance. I’ve already noticed a few problems I didn’t previously know about in just the first few hours after deploying.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://gae-mini-profiler.appspot.com/images/gae-mini-profiler/ajax-corner.png"/&gt;&lt;br/&gt;&lt;em&gt;AJAX calls stack up as they come in, ready for examination&lt;/em&gt;&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/ljtlne32e/small.png"/&gt;&lt;br/&gt;&lt;em&gt;You can dive deep on the details of each request&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;All props go to &lt;a href="http://twitter.com/#!/jarrod_dixon"&gt;Jarrod&lt;/a&gt;, &lt;a href="http://samsaffron.com/archive/2011/06/09/+Profiling+your+website+like+a+true+Ninja"&gt;Sam&lt;/a&gt;, and probably the rest of the Stack Exchange team for blazing the path with &lt;a href="http://code.google.com/p/mvc-mini-profiler/"&gt;mvc-mini-profiler&lt;/a&gt; and inspiring this tool. I borrowed ideas ranging from basic UI to dupe query detection to jQuery.tmpl usage to ajax request stacking to lots of other stuff I can’t remember. The sizable differences in the tools really spawn from the type of data I get from &lt;a href="http://code.google.com/appengine/docs/python/tools/appstats.html"&gt;Appstats&lt;/a&gt; and &lt;a href="http://docs.python.org/library/profile.html"&gt;cProfile&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;The project is obviously young, but any App Engine app should be able to drop it in quite quickly with minimal configuration. Instructions are at &lt;a href="https://github.com/kamens/gae_mini_profiler"&gt;the repo&lt;/a&gt;, and I hope others find it useful.&lt;/p&gt;

&lt;blockquote&gt;&lt;a href="http://www.imdb.com/title/tt0144084/quotes?qt=qt0453383"&gt;“…relief washes over me in an awesome wave.”&lt;/a&gt;&lt;/blockquote&gt;</description><link>http://bjk5.com/post/6944602865</link><guid>http://bjk5.com/post/6944602865</guid><pubDate>Sun, 26 Jun 2011 14:39:00 -0400</pubDate></item><item><title>Connecting the students</title><description>&lt;p&gt;We’re thinking about how to connect our community of students, and there’s a lot we don’t know. Here’s the little we do:&lt;/p&gt;

&lt;ul&gt;&lt;li&gt;Students have watched Sal’s videos over 60,000,000 times and have answered 75,000,000 practice problems.&lt;/li&gt;
&lt;li&gt;This is a massive amount of learning, but much of it has been done by students who are relatively disconnected from their peers.&lt;/li&gt;
&lt;li&gt;&lt;em&gt;Nothing&lt;/em&gt; indicates true mastery of a subject like the ability to teach it to others.&lt;/li&gt;
&lt;li&gt;The small (relative to our total userbase) number of students using Khan Academy alongside their peers in a school setting engage the software in &lt;a href="http://lasdandkhanacademy.edublogs.org/2011/04/01/learning-about-learning/"&gt;incredible ways&lt;/a&gt;. They work together in groups, challenge each other, and cheer for their friends when they earn badges. Working with others, especially a fearless teacher or coach, amplifies Khan Academy’s effect significantly.&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;We want to build these amplifiers directly into Khan Academy. No matter which direction we brainstorm, the possibilities for connecting our users don’t seem to stop. A small subset of what we’ve considered:&lt;/p&gt;

&lt;ul&gt;&lt;li&gt;Any struggling student could ask for immediate help from a qualified peer or pre-approved teacher, who could immediately see the student’s past work and mistakes.&lt;/li&gt;
&lt;li&gt;Any teacher, coach, or student (the lines &lt;em&gt;should&lt;/em&gt; be blurred) could add their own content in the form of both videos and exercises to supplement the KA library according to their own needs while taking advantage of our platform, dashboard, and analytics.&lt;/li&gt;
&lt;li&gt;Users could participate in message board-like communities about all types of KA-related content.&lt;/li&gt;
&lt;li&gt;Students could team up to work through KA content together while facing all kinds of cooperative challenges.&lt;/li&gt;
&lt;li&gt;…doesn’t stop there.&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;While we don’t claim to have the answers, you’ll see more and more experiments coming from our core belief that teaching others is a great way to learn. We’ve already dabbled (can’t emphasize that enough…&lt;sup&gt;dabbled&lt;/sup&gt;) with this goal in the question and answer section beneath each of our videos:&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/8H9lmz6ks/earth.png"/&gt;&lt;br/&gt;&lt;em&gt;Students teaching students&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;It seems likely that Sal’s videos each have a few common misunderstandings or logical jumps that trick the majority of viewers, and this feature is designed to let the community fill in the most important gaps.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/aRSlmz6n1/typo.png"/&gt;&lt;br/&gt;&lt;em&gt;Even little questions like these are important&lt;/em&gt;&lt;br/&gt;&lt;br/&gt;&lt;img src="http://static.tumblr.com/9hgswys/s03lmz6nm/anti.png"/&gt;&lt;br/&gt;&lt;em&gt;Simple voting mechanics (with one or two doodads from &lt;a href="http://stackoverflow.com"&gt;the best voting implementation out there&lt;/a&gt;) hopefully surface the most common questions&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;This small experiment has already taught us some important lessons. I see no reason to stop the lazy list writing style I started above:&lt;/p&gt;

&lt;ul&gt;&lt;li&gt;There’s a big difference between fostering a community that’s focused on creating and refining artifacts (think StackOverflow and Wikipedia) and a community that encourages any and all mentoring between students. In a community that creates artifacts, duplicate content is the enemy and efficiently finding others’ answers is the holy grail. For us, there’s something very important about a kid raising her hand, asking why subtracting a negative number moves you to the right on the number line, and working towards the answer with another human being (or human being-like coach). It doesn’t matter how many people have asked the question previously.&lt;/li&gt;
&lt;li&gt;&lt;a href="http://kamvar.org/"&gt;Sep Kamvar&lt;/a&gt; gave us some great advice along those lines the other day when he reminded us that the most efficient system (think about the ability to instantly find all others’ questions and answers) is not necessarily the best solution when encouraging interaction. I’ll put myself in the hot seat and admit that as a developer, that takes some getting used to.&lt;/li&gt;
&lt;li&gt;Our content is frequented by different age groups, which creates different community dynamics for each subject.&lt;/li&gt;
&lt;li&gt;As expected, even this small feature generates a wide range of content quality. Not all participation is helpful, and our system isn’t perfect.&lt;/li&gt;
&lt;li&gt;It’s true that each video comes with some common curiosities, and a few members of our community are fantastic at responding to them.&lt;/li&gt;
&lt;/ul&gt;&lt;p&gt;We’ll be experimenting more, and we’re always listening. The direction of educational communities online feels wide open, and every day we have to pick our path. Share your opinions, they matter a lot.&lt;/p&gt;</description><link>http://bjk5.com/post/6649413224</link><guid>http://bjk5.com/post/6649413224</guid><pubDate>Sat, 18 Jun 2011 03:46:00 -0400</pubDate></item><item><title>Opening up the Khan Academy API</title><description>&lt;p&gt;As soon as I joined KA, I began receiving emails from people asking to integrate with Sal’s content in various ways: in mobile apps, in search engine results, in other educational sites. So we threw together &lt;a href="https://sites.google.com/a/khanacademy.org/forge/for-developers/technical/api"&gt;the quickest, ugliest API we could get away with&lt;/a&gt; at the time in order to give other developers access to our playlist and video library.&lt;/p&gt;

&lt;p&gt;It’s now a few months later, and that hack of an API no longer cuts it. It lacks authentication, user-specific data, API versioning, and other basics. We need these basics for the official mobile apps we’re developing, and the development community needs them to make apps that do more than link to our videos. Which is why we just released what we’re calling &lt;a href="https://github.com/Khan/khan-api/wiki/Khan-Academy-API"&gt;API version 1.0&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;The new API gives developers access to not just playlists and videos, but also &lt;a href="https://github.com/Khan/khan-api/wiki/Khan-Academy-API-Methods"&gt;exercises, badges, users, and logs of historical data&lt;/a&gt; about each and every problem or video students have watched. I’m sure we missed a lot of stuff, so developers: just let us know when you need access to something else.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/1vvlmbwql/w_e_1.png"/&gt;&lt;br/&gt;&lt;em&gt;Using the API to check out my performance in &lt;a href="http://www.khanacademy.org/exercises?exid=writing_expressions_1"&gt;our Writing Expressions 1 exercise&lt;/a&gt;.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;We’re slotted to be one of the featured APIs in next weekend’s &lt;a href="http://hack4knowledge.eventbrite.com/"&gt;hack4knowledge&lt;/a&gt; — I’m crossing my fingers we see some cool educational hacks using our data.&lt;/p&gt;</description><link>http://bjk5.com/post/6219080921</link><guid>http://bjk5.com/post/6219080921</guid><pubDate>Sun, 05 Jun 2011 14:06:00 -0400</pubDate></item><item><title>Pickles and memcache</title><description>&lt;p&gt;My recent time spent &lt;a href="http://bjk5.com/post/5699116854/how-much-i-enjoy-deleting-my-own-code"&gt;creating a hack that I’d later delete&lt;/a&gt; taught me a bunch about Python and Django. One cool little trick I wound up using was a dictionary that automatically pickles and unpickles its contents.&lt;/p&gt;

&lt;p&gt;I needed memcache to quickly deserialize a dictionary of values, and it wasn’t always guaranteed that I would use all of the objects in the dictionary with each request. Sometimes the contents of the dictionary took a long time to deserialize (lists of App Engine models), so it felt really wasteful waiting for pickle.loads to finish its stuff when we didn’t need half the results.&lt;/p&gt;

&lt;p&gt;The result was a dictionary that pickles its own values whenever items are set and depickles them automatically on get.&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;import pickle

# We use a context dict full of pre-pickled values for our cached two_pass_template context,
# so we don't waste time de-pickling entities that aren't used in the second pass.

class PickleContextVal:
    def __init__(self, pickled, val):
        self.pickled = pickled
        self.value = pickle.dumps(val) if self.pickled else val

    def val(self):
        if self.pickled:
            self.value = pickle.loads(self.value)
            self.pickled = False
            return self.value
        else:
            return self.value

# See &lt;a href="http://stackoverflow.com/questions/2060972/subclassing-python-dictionary-to-override-setitem"&gt;http://stackoverflow.com/questions/2060972/subclassing-python-dictionary-to-override-setitem&lt;/a&gt;
class PickleContextDict(dict):

    def __getitem__(self, key):
        pickle_context_val = super(PickleContextDict, self).__getitem__(key)
        return pickle_context_val.val()

    def __setitem__(self, key, value, pickled=True):
        super(PickleContextDict, self).__setitem__(key, PickleContextVal(pickled, value))

&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;Depickling strings is really really fast, so by spending a tiny bit of extra time pickling all of the individual items of the dictionary and then pickling the entire dictionary once more before storing it in memcache, we spend very little time deserializing objects that weren’t needed.&lt;/p&gt;</description><link>http://bjk5.com/post/5761845860</link><guid>http://bjk5.com/post/5761845860</guid><pubDate>Mon, 23 May 2011 03:52:50 -0400</pubDate></item><item><title>How much I enjoy deleting my own code</title><description>&lt;p&gt;I’m not sure why a few months makes such a difference in how I feel about removing my own work. Maybe there’s some intuition that code hasn’t gotten to serve its real purpose without being out in the wild for a couple months. I don’t know. I do know that after a few months, when I’m free from the worry that I’ve recently wasted my time, nothing feels better than removing (&lt;a href="http://www.joelonsoftware.com/articles/fog0000000069.html"&gt;not rewriting&lt;/a&gt;!) your own code.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/aXrlljbt8/graph.png"/&gt;&lt;/p&gt;

&lt;p&gt;I know this because as soon as I post this blog I’m going to delete what I consider to be a cool piece of code I wrote last week. It took me a while to work past the “this hack is sweet it’s gotta be useful” mental roadblock and listen to my inner coder’s screams that the payoff is just not worth the hack’s future headaches.&lt;/p&gt;

&lt;p&gt;I wanted to speed up our video pages (we’re perf junkies) and in doing so, solve the following problem. Usually, you think of cache strategies like this:&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/i27lljbuw/cache_this.png"/&gt;&lt;/p&gt;

&lt;p&gt;…but for pages with small amounts of user-specific data, it makes sense to think of caching like this:&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/etwlljbw3/dont_cache_this.png"/&gt;&lt;/p&gt;

&lt;p&gt;One way &lt;a href="http://linux.softpedia.com/get/Internet/HTTP-WWW-/django-phased-57898.shtml"&gt;people&lt;/a&gt; &lt;a href="http://www.holovaty.com/writing/django-two-phased-rendering/"&gt;approach&lt;/a&gt; this is to use two-phase templates. Your first pass fills in the cacheable stuff, leaving the raw template unrendered in some spots. You keep this incomplete template around for all future requests, which just run the quick second pass to render the dynamic stuff. All solutions I’ve seen for this require messy template syntax and lots of work to set up the whole rigmarole. I wanted a way to do this &lt;em&gt;without requiring knowledge of the special non-cacheable bits&lt;/em&gt; when writing your Django templates, so we’d be sure to use it over and over again just by adding a Python decorator here and there.&lt;/p&gt;

&lt;p&gt;The goal was to write a normal template like this:&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;&lt;html&gt;
    &lt;body&gt;
        {% if user %}
            Logged in: {{ user.name }} - {{ user.points }}
        {% endif %}
        {% video_content lots_of_datastore_data %}
    &lt;/body&gt;
&lt;/html&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;…and call it like this:&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;render_template("template.html", 
    {"lots_of_datastore_data": video_data}
)&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;…and have it automatically recognize which template variables were missing (notice there’s no &lt;code&gt;user&lt;/code&gt; in the template context dictionary above), to produce this:&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;&lt;html&gt;
    &lt;body&gt;
        {% if user %}
            Logged in: {{ user.name }} - {{ user.points }}
        {% endif %}
        &lt;div id="video_content"&gt;
            ...
        &lt;/div&gt;
    &lt;/body&gt;
&lt;/html&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;…while handling all the weird template situations that you can expect in the real world when not writing overly simplistic blog examples.&lt;/p&gt;

&lt;p&gt;Anyway, that’s what the code does. And it automatically caches the first render pass of the template, and it only runs the second part of the request handler that produces user-specific data for every subsequent request so you don’t have to repeatedly load &lt;code&gt;lots_of_datastore_data&lt;/code&gt;, and it uses memcache to be really super fast, and you barely have to add more than some &lt;code&gt;@two_pass_template&lt;/code&gt; decorators to get it all to work, and and and and and.&lt;/p&gt;

&lt;p&gt;What’s the problem?&lt;/p&gt;

&lt;ol&gt;&lt;li&gt;To seamlessly handle all the missing variable magic without bothering template writers, I had to create deeper monkey patches in the Django internals than I feel comfortable maintaining. This level of monkeying with django’s internals can’t possibly be done totally correctly (by me) w/out long-term debugging fiascos down the road. If someone else were maintaining this, I’d be far more likely to get involved.&lt;/li&gt;

&lt;li&gt;This type of caching is really useful in rare circumstances. It’s great for our video page, but I’m having trouble finding other applications.&lt;/li&gt;

&lt;li&gt;We face maintenance nightmares whenever upgrading Django (we’re still on 0.96) or, obviously, using a different template system).&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;I have an extremely high tolerance for &lt;a href="http://bjk5.com/post/2954631955/messy-solutions-work-just-as-well"&gt;pragmatic hacks&lt;/a&gt;, especially when dealing w/ headaches as a developer just to grab 10 or 20 milliseconds of perf for our users (that’s pretty much the definition of &lt;a href="http://bjk5.com/post/4947771481/profiling-client-side-performance-over-time"&gt;client-side performance work&lt;/a&gt;). This particular hack cut our video page’s 100-200ms responses in half and protected us from occasional datastore latency spikes! However, we can get the same benefits for larger parts of our applications and with much less technical debt via normal caching techniques and pursuing our switch to the HR datastore, respectively.&lt;/p&gt;

&lt;p&gt;So as soon as I click post I’m removing the code, even though it’s still warm. &lt;a href="https://khanacademy.kilnhg.com/Repo/Website/Group/stable/Files/two_pass_template/?rev=58e2f4237f75"&gt;It’s in source control&lt;/a&gt; forever and ever, waiting for when we’ve taken care of the bigger’n’better performance wins and are still hunting for milliseconds years from now. Or waiting for somebody else to make the magic much more maintainable.&lt;/p&gt;</description><link>http://bjk5.com/post/5699116854</link><guid>http://bjk5.com/post/5699116854</guid><pubDate>Sat, 21 May 2011 11:29:56 -0400</pubDate></item><item><title>Raising expectations for educational tech speed</title><description>&lt;p&gt;Khan Academy and the rising ecosystem of edutech startups aren’t going to come out of the gate with any perfect educational solutions (or anything close). We &lt;strong&gt;can&lt;/strong&gt; raise the bar by building teams and products that move quickly in response to student data and the needs of learners. And teachers can, eventually, start to expect this well-deserved treatment instead of reeling in shock when their needs are addressed.&lt;/p&gt;

&lt;p&gt;I’ve heard the motto “Get S*** Done” happily muttered more and more from our dev team recently (not just from me). The mindset of moving fast with small, steady improvements every single day is one gift it feels inarguably right to bring from the world of &lt;strike&gt;agile&lt;/strike&gt; &lt;strike&gt;lean&lt;/strike&gt; quick startups into that of educational tools.&lt;/p&gt;

&lt;p&gt;A few examples of the type of speed I’m talking about, all courtesy of the talented &lt;a href="http://missmarcialee.com"&gt;missmarcialee.com&lt;/a&gt;:&lt;/p&gt;

&lt;ol&gt;&lt;li&gt;Our &lt;a href="http://missmarcialee.com/2011/04/prime-factorization-and-the-art-of-drawing-arrows/"&gt;prime factorization exercise offered multiple choice answers to students&lt;/a&gt; in a way that made it easy to game the correct answer without understanding prime factorization. Teachers and students recognized this, told us, and Marcia fixed it, for the entire world, within hours (she removed multiple choice).&lt;br/&gt;&lt;br/&gt;&lt;/li&gt;

&lt;li&gt;For the minority of exercises that still have multiple choice, we heard that students were sometimes able to spot various hints in the offered choices that made it easier to deduce correct answers. &lt;a href="http://missmarcialee.com/2011/04/gaming-the-game/"&gt;We immediately added more frequent “None of the Above” options&lt;/a&gt; to keep the challenge honest.&lt;br/&gt;&lt;br/&gt;&lt;/li&gt;

&lt;li&gt;As soon as “None of the Above” popped up more frequently, Marcia heard that whenever it was selected as the correct choice, students wanted to see the actual answer so they could verify their work. The next morning, whenever “None of the Above” was correctly selected, it slowly faded out and replaced itself with the actual answer.
&lt;/li&gt;&lt;/ol&gt;&lt;p&gt;Three pieces of feedback with three tiny changes that add up. Soon we’ll be driving these increments with more and more of our hard data (about 15 practice problems are answered per second during peak right now).&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/CXklkwivx/number_munchers.png"/&gt;&lt;br/&gt;&lt;em&gt;Everyone’s still much closer to this than where we’re heading.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Saying that Khan Academy is in the infancy of what educational technology will become doesn’t always hit home for students, teachers, whoever. But when they experience this rapid iteration in response to their feedback, you can see in their eyes and read in their tweets that this isn’t the type of interaction they’re used to with their educational tools. A few years of this and KA, along with its contemporary tools that are popping up, will look nothing like it did before.&lt;/p&gt;

&lt;p&gt;More importantly, a few years of this and teachers and students will expect more of their tools and the team behinds them.&lt;/p&gt;

&lt;p&gt;That’s why it’s exciting to read about &lt;a href="http://www.imaginek12.com/"&gt;educational startups and funds popping up&lt;/a&gt;. FWIW, we’ll keep doing our part in making this level of responsiveness become the newly expected norm in educational content.&lt;/p&gt;

&lt;hr&gt;&lt;br/&gt;&lt;p&gt;P.S. I put my money where my mouth is and just moved to the bay area this weekend to join the team in-person. The closer we are to our pilot programs, the faster we can iterate with students and teachers.&lt;/p&gt;</description><link>http://bjk5.com/post/5319310876</link><guid>http://bjk5.com/post/5319310876</guid><pubDate>Sun, 08 May 2011 20:13:30 -0400</pubDate></item><item><title>Profiling client-side performance over time</title><description>&lt;p&gt;&lt;a href="http://stevesouders.com/"&gt;Steve Souders&lt;/a&gt; leads the way when it comes to client-side performance. A few years ago, his &lt;a href="http://www.amazon.com/High-Performance-Web-Sites-ebook/dp/B0028N4WHY/ref=dp_kinw_strp_1?ie=UTF8&amp;m=AG56TWVU5XWC2"&gt;High Performance Web Sites&lt;/a&gt; book drilled the following into my head:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Most devs spend time optimizing server-side performance, but your users probably spend way more time waiting around for all types of client-side junk.&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;That book paved the way for great client-side perf tools like &lt;a href="http://developer.yahoo.com/yslow/"&gt;YSlow&lt;/a&gt; and, not long after, &lt;a href="http://code.google.com/speed/page-speed/"&gt;Page Speed&lt;/a&gt;. This post is about using another service, &lt;a href="http://gtmetrix.com"&gt;GTmetrix&lt;/a&gt;, to monitor changes in your site’s YSlow and Page Speed scores over time.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/p8Alk8o6a/speed.png"/&gt;&lt;br/&gt;&lt;em&gt;This khanacademy.org request timeline is fairly normal for most pages out there. The server’s entire response has been received by the browser in 227ms, but the DOM and body load events (blue and red lines, respectively) are way out to the right. &lt;strong&gt;Even if we halved our server’s response time, we’d only make a tiny dent in perceived performance.&lt;/strong&gt;&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;The trouble with client-side perf is it’s really sneaky. It’s not nearly as straightforward as avoiding &lt;code&gt;O(n&lt;sup&gt;2&lt;/sup&gt;)&lt;/code&gt; algorithms in your server-side code. You have to think about request counts, request sizes, minification, DNS lookups, cache rules, proxy caching, asynchronous downloads, redirects, unused javascript, and more.&lt;/p&gt;

&lt;p&gt;It’s &lt;em&gt;way&lt;/em&gt; more difficult to keep all of these rules in mind when adding a new feature to your site than it is to avoid slow server code. You’re making a new popup dialog for your site? You add an icon &lt;code&gt;&lt;img&gt;&lt;/code&gt; here, some &lt;code&gt;&lt;script&gt;&lt;/code&gt; there, and probably some new CSS selectors. Before you know it, your innocent and well-coded feature added just a tiny bit of bloat to your client-side performance. If you don’t think it adds up, turn on Firebug’s network timeline and go browse around.&lt;/p&gt;

&lt;p&gt;You’re left with a few options:&lt;/p&gt;

&lt;ol&gt;&lt;li&gt;Don’t worry about this type of crap, it’s too much overhead when trying to churn out a new feature. Every once in a while start feeling like your site is kinda slow, then pull out Page Speed and spend a week fixing everything. Been there. No good.&lt;br/&gt;&lt;br/&gt;&lt;/li&gt;

&lt;li&gt;Seriously worry about this type of crap. Open YSlow every day. Assess every line of new javascript with an intense “Is this worth the browser’s parse time?” metric that probably depends more on your lunch than an objective assessment. Piss off your teammate when you delay their new feature that, if shipped, would save 50 lives/day just because their icon isn’t sprited properly. Been there. No good.&lt;br/&gt;&lt;br/&gt;&lt;/li&gt;

&lt;li&gt;Somehow reach a balance in life by being aware of client-side performance tradeoffs without hindering new development. Offload some of your concern to a mythical third party you can trust to care about your site’s perceived speed.&lt;/li&gt;

&lt;/ol&gt;&lt;p&gt;I’ve been looking for tools to help reach the nirvana of door #3, and GTmetrix is the best I’ve found so far*. You give GTmetrix your URL and they’ll ping it daily, keeping track of your Page Speed and YSlow scores, so you can go back at any point and keep an eye on changes in your site’s client-side perf over the last few development cycles.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/xRZlk8q2a/graph.png"/&gt;&lt;/p&gt;

&lt;p&gt;This means you can clearly see the effects of any perf work, but &lt;em&gt;way&lt;/em&gt; more importantly you can safely keep an eye on perf degradation over time without constantly checking Page Speed and trying to remember last week’s score from before you added drag’n’drop.&lt;/p&gt;

&lt;p class="center"&gt;&lt;img src="http://static.tumblr.com/9hgswys/26olk8qgx/urls.png"/&gt;&lt;br/&gt;&lt;em&gt;Pretty easy to monitor both logged-in and logged-out versions of your most common URLs.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;Still early in our usage, but so far highly recommended. Anything that takes away some of the pain of worrying about client-side perf intricacies is ok in my book, and judging by the competitors that are popping up, I think these client-perf-over-time tools are gonna get better and better.&lt;/p&gt;

&lt;hr&gt;&lt;br/&gt;&lt;p&gt;*&lt;a href="http://slowcop.com"&gt;SlowCop&lt;/a&gt; looks promising but just went into beta literally as I was writing this post. It’s got some work to do.&lt;br/&gt;
*&lt;a href="http://www.showslow.com/"&gt;ShowSlow&lt;/a&gt; was just too complicated for me compared to GTmetrix. I’m probably too dumb or not patient enough.&lt;/p&gt;</description><link>http://bjk5.com/post/4947771481</link><guid>http://bjk5.com/post/4947771481</guid><pubDate>Mon, 25 Apr 2011 23:54:12 -0400</pubDate></item><item><title>JS/CSS packaging to minimize requests and randomly evil algorithms</title><description>&lt;p&gt;From &lt;a href="http://www.reddit.com/r/IAmA/comments/gulpx/iama_cofounder_of_stack_exchange_and_fog_creek/"&gt;Joel’s recent IAmA on reddit&lt;/a&gt;, w/ ellipses thrown in haphazardly:&lt;/p&gt;

&lt;blockquote&gt;“What kind of sacrifices do you make on stackoverflow.com in order to obtain speed/efficiency?”
&lt;br/&gt;&lt;br/&gt;
“Heavy caching…lavish spending…a willingness to let developers spend time on optimization.”&lt;/blockquote&gt;

&lt;br/&gt;&lt;p&gt;The performance benefits of packaging up your bunches of javascript and css files into as few requests as possible are well known. We recently made a couple changes to the packaging system used for &lt;a href="http://www.khanacademy.org"&gt;&lt;a href="http://www.khanacademy.org"&gt;www.khanacademy.org&lt;/a&gt;&lt;/a&gt; that are worth mentioning, especially for anyone else on App Engine.&lt;/p&gt;

&lt;p&gt;The whole point of a javascript/stylesheet packaging system is to be able to cleanly split code into a bunch of different files like this:&lt;/p&gt;&lt;pre&gt;&lt;code&gt;    "exercises": {
        "files": [
            "ASCIIMathML.js",
            "raphael.js",
            "ASCIIsvg-wrapper.js",
            "fontdetect.js",
            "seedrandom.js",
            "metautil.js",
            "exerciseutil.js",
            "graphutil.js",
            "g.raphael-min.js",
            "g.pie-min.js",
            "g.line-min.js",
        ]
    }

&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;…while only issuing one request to grab all of these files, in their proper order, combined and minified into a single payload, like this:&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;&lt;script src='/javascript/exercises/all.js'&gt;&lt;/script&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;As always, you’re immediately faced with a decision about how to version this file. You always want visitors to use a cached version of this file unless something has changed. If you leave the URL as-is above, you’ll be telling users to “just press Ctrl+R” a lot after you deploy a new version and their cached, stale javascript no longer works. A common, easy solution is to append the current application’s version to the URL via query string, like this:&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;&lt;script src='/javascript/exercises/all.js?v={{ Your_App_Version }}'&gt;&lt;/script&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;…and now, whenever you deploy a new version of your app, every browser that hits your site will be guaranteed to download the latest and greatest version of your javascript. Up until today, this is the technique we used for Khan Academy.&lt;/p&gt;

&lt;p&gt;There are three problems here.&lt;/p&gt;

&lt;ol&gt;&lt;li&gt;If you deploy frequently (we do), you’re making &lt;em&gt;all&lt;/em&gt; your users re-download &lt;em&gt;all&lt;/em&gt; your resources &lt;em&gt;all&lt;/em&gt; the time. If you’re deploying three times a day every day, you might as well disable caching entirely. For the past few months, every morning when students in the &lt;a href="http://lasdandkhanacademy.edublogs.org"&gt;Los Altos School District’s pilot program&lt;/a&gt; logged on to KA, they’d be downloading a new script &lt;em&gt;even if it was identical to the cached version already sitting in their browser&lt;/em&gt;, begging to be used.&lt;br/&gt;&lt;br/&gt;&lt;/li&gt;

&lt;li&gt;If Google’s Page Speed is to be trusted (I choose to believe), &lt;a href="http://code.google.com/speed/page-speed/docs/caching.html#LeverageProxyCaching"&gt;query strings cause some proxies to skip caching your static resource, no matter what&lt;/a&gt;. This means any query string-based cache busting scheme you’ve got in place from &lt;code&gt;?v=3&lt;/code&gt; to &lt;code&gt;?hash=AB34&lt;/code&gt; will ruin some perfectly good proxy caching opportunities.&lt;br/&gt;&lt;br/&gt;&lt;/li&gt;

&lt;li&gt;…and last, but not least, if you’re on App Engine and have a nontrivial amount of traffic, this form of cache busting is downright dangerous. Read on.&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;&lt;strong&gt;App Engine’s &lt;code&gt;"all.js?v={{Version}}"&lt;/code&gt; dilemma&lt;/strong&gt;&lt;br/&gt;&lt;em&gt;The following is complete conjecture that is sure to be mocked by somebody with real knowledge of the situation.&lt;/em&gt;&lt;/p&gt;

&lt;p&gt;When you deploy a new version on App Engine, the 5, 10, 100 different instances running your app don’t switch over to the new version all at once. They switch piecemeal.&lt;/p&gt;

&lt;p&gt;Consider the following scenario:&lt;/p&gt;

&lt;ol&gt;&lt;li&gt;&lt;img src="http://static.tumblr.com/9hgswys/VjKlk6wzs/1.png"/&gt;&lt;br/&gt;You deploy a new version, V5, which is propagating across your servers. Great. Almost past “???” and into “Profit.”&lt;br/&gt;&lt;br/&gt;&lt;/li&gt;

&lt;li&gt;&lt;img src="http://static.tumblr.com/9hgswys/iC0lk6x1w/2.png"/&gt;&lt;br/&gt;A loyal user visits your site and gets routed to a server just itching to show off its brand new version.&lt;br/&gt;&lt;br/&gt;&lt;/li&gt;

&lt;li&gt;&lt;img src="http://static.tumblr.com/9hgswys/NMnlk6xrc/3-5.png"/&gt;&lt;br/&gt;New version of page sent to user. Smooth sailing.&lt;br/&gt;&lt;br/&gt;&lt;/li&gt;

&lt;li&gt;&lt;img src="http://static.tumblr.com/9hgswys/k9alk6xla/3.png"/&gt;&lt;br/&gt;User’s browser checks out the new HTML and notices a reference to the never-before-seen &lt;code&gt;all.js?v=5&lt;/code&gt;.&lt;br/&gt;&lt;br/&gt;&lt;/li&gt;

&lt;li&gt;&lt;img src="http://static.tumblr.com/9hgswys/2aWlk6xlp/4.png"/&gt;&lt;br/&gt;The browser dutifully asks Google’s servers for the new version. &lt;a href="http://stackoverflow.com/questions/2704789/does-google-app-engine-use-google-cdn-to-distribute-static-resources"&gt;App Engine’s static resource CDN&lt;/a&gt; has never seen this file before, so it has to go fetch the file from somewhere.&lt;br/&gt;&lt;br/&gt;&lt;/li&gt;

&lt;li&gt;&lt;img src="http://static.tumblr.com/9hgswys/Ljzlk6xm2/5.png"/&gt;&lt;br/&gt;Since your app isn’t fully done deploying and you’re just not that lucky, the server that responds to the CDN’s request still has an old version of &lt;code&gt;all.js&lt;/code&gt;.&lt;br/&gt;&lt;br/&gt;&lt;/li&gt;

&lt;li&gt;&lt;img src="http://static.tumblr.com/9hgswys/K0ulk6xnk/6.png"/&gt;&lt;br/&gt;And here’s where you get hosed. Sure, your app is fully deployed, but the CDN holds onto that old version and continues to serve it. &lt;strong&gt;&lt;em&gt;No amount of Ctrl+R’ing can save you now.&lt;/em&gt;&lt;/strong&gt; All requests for &lt;code&gt;all.js?v=5&lt;/code&gt; will continue to serve v4 contents for quite a long time, and the browser is powerless to avoid it.&lt;/li&gt;
&lt;/ol&gt;&lt;p&gt;This bug started to bite us during what seemed like every other deploy after we crossed a certain traffic threshold (and therefore increased our race condition odds). The worst part is that geographically separate CDNs mean everything can seem fine on the east coast while the entire west coast is unable to use Khan Academy thanks to old javascript files.&lt;/p&gt;

&lt;p&gt;All three of the above problems are solved by altering your javascript package’s filename with a hash of the package’s actual content. Now, our javascript references look like this:&lt;/p&gt;

&lt;pre&gt;&lt;code&gt;&lt;script src='/javascript/exercises/hashed-1424dd90e695125adeb0e14d24a113ac.js'&gt;&lt;/script&gt;

&lt;/code&gt;&lt;/pre&gt;

&lt;p&gt;…which means we never ask users to download scripts they already have, we take advantage of proxy caching, and we protect ourselves from bugs caused by partial deploys and zealous CDN caching.&lt;/p&gt;</description><link>http://bjk5.com/post/4918954974</link><guid>http://bjk5.com/post/4918954974</guid><pubDate>Mon, 25 Apr 2011 00:42:48 -0400</pubDate></item></channel></rss>

