First Impressions: Cappuccino vs SproutCore
Feb 18 2011

I spent a day and a half comparing Cappuccino and SproutCore, two web frameworks for creating pretty stunning desktop-like web apps. Long story short: I’ve decided to use SproutCore instead of Cappuccino.

First, some background. I’m currently prototyping a startup idea. Like many such ideas, it’s very aspirational and a bit vague, but I’m certain that great UX will make or break this startup in the real world. I wanted to start prototyping the UX quickly, so I could work through lots of bad ideas until I found the right one.

Cappuccino and SproutCore both seemed to offer me a way to do this, but I couldn’t decide. Both seemed to have aspects that I liked, so I decided to go through both projects’ tutorials and see which I liked best.

Cappuccino

I started with Cappuccino, because I felt it was the most likely choice for my project. The sample apps seemed really impressive, and I’ve been working with iOS a lot, so Objective-J was no barrier. Objective-J in many ways seemed far more familiar and recognizable than many of the OOP hack jobs that have been written for Javascript.

Things started to go downhill from the start though. To some extent, my experience could have been made smoother with better written tutorials and documentation. Installation was a little confusing if you don’t download the starter package. I opted to use Tusk, since the starter package is nearly a year old and I wasn’t sure if it was up to date (more on this later). But my first problem was figuring out what Tusk was, where to download it, etc. Cappuccino is actually built on top of Narwhal, which provides tusk, and the Common JS framework. Once I figured out what these projects were, I was actually impressed and excited, but the Cappuccino site leaves you to figure this out on your own.

I’ll spare you the detailed play-by-play of the tutorials, but suffice it to say that they could be better organized. I’ll let these two quotes from the tutorials speak for my experience developing a Cappuccino application: “This may seem daunting, but its [sic] really not that complex.” and “This may seem a bit overwhelming, but if we analyze it in pieces you’ll see that it’s really quite straight forward.

That pretty much sums up my experience with Cappuccino. The author is right – the intent of the code is straightforward and understandable, especially if you have Cocoa experience. But ZOMG the amount of code needed to build the app was really tedious. All styling needs to be done in code, without help from CSS. As a result, it wasn’t clear how easily it would be to create a distinctly different UX than the default provided. Once I looked again at the apps people have launched with Cappuccino, they all had a distinctly similar look and feel. Also, Cappuccino’s main UI framework, AppKit, is over 1MB! It took a few seconds to load even when I was working locally.

Lastly, I have to ask: what kind of future does Cappuccino have? It feels a bit weird that Cappuccino, effectively a port of Cocoa to Javascript, is now primarily developed by Motorola, who is interested in using it for Android development. There hasn’t been a peep from 280 North since they were acquired by Motorola. Their amazing-looking dev tool, Atlas, is seemingly MIA, nearly two years after it was announced in February 2009. The author of many Cappuccino webcasts and “This Week in Edge Cappuccino” left the community a year ago. There is very regular activity on GitHub (this blog post implies it’s more active than SproutCore in some ways), but Cappuccino felt a bit like a ghost town to me. Hopefully the 280 North guys are just keeping their heads down and getting busy, but it’d be more convincing if they actually launched something.

SproutCore

My experience getting up to speed with SproutCore was completely different than Cappuccino. First, the installation was dead simple. SproutCore is installed through a Ruby gem, and comes with useful command line tools that aid development. The Todos tutorial was also significantly easier to follow, since it highlighted code changes and was structured better. It also covered far more ground – the entire MVC stack – and gave me a much better sense of how I’d actually build something useful.

The experience of building an app in SproutCore was also significantly simpler. Javascript has a lot of warts, but SproutCore uses its attractive features – notably, the object syntax – to great effect. Defining views, data sources, and controllers in SproutCore feels almost declarative in nature, since it is so concise. Hooking it all together is also dead simple, thanks to the impressive property and KVO / KVB systems. The tutorial didn’t cover testing, but I love that testing is well covered by their guides.

After going through the tutorial, it struck me that SproutCore is really a far better application of some of Cocoa’s core technologies than Cappuccino. Cappuccino is a very literal port of Cocoa and Objective-C to Javascript, without taking advantage of any of Javascript’s strengths. SproutCore seems to translate core Cocoa concepts into Javascript in a way that feels very natural. SproutCore feels like Cocoa’s web-based cousin, where Cappuccino seems like an imitator.

It’s also comforting to know that SproutCore is behind a large, shipping web app with a polished UX (MobileMe). Having Yehuda Katz in the community also doesn’t hurt. The new SproutCore Guides site seems to be developing quite nicely as well. In short, there’s a lot of visible community-building going on with SproutCore, at least from an outsider’s perspective.

Conclusion: SproutCore Wins!

I feel bad that I don’t have anything more to write about SproutCore, but my initial experience with it was so smooth that there’s little more to say. My goal was to find a front-end application framework that would let me start experimenting with my own ideas quickly, and SproutCore seems to be that framework.

The big caveat is that I haven’t started yet. I’ll soon discover where they’ve hidden the unicorn poop, but getting started is half the battle, right?