SitePoint Podcast #67: The Browser Dance
Listen in your Browser
Play this episode directly in your browser! Just click the orange “play” button below:
Download this Episode
You can also download this episode as a standalone MP3 file. Here’s the link:
- SitePoint Podcast #67: The Browser Dance (MP3, 47.4MB, 49:20)
Subscribe to the Podcast
Here are the topics covered in this episode:
- Is There a Browser War Raging?
- WordPress 3.0
- Domain Prices on the Rise
- High-performance Apps and Games in HTML5
- Facebook’s Server-side Secrets
Browse the full list of links referenced in the show at http://delicious.com/sitepointpodcast/67.
- Kevin: Ephemera for Mac
- Stephan: Touch UIs for Content Creation
- Brad: Custom Post Type UI WordPress Plug-in
- Patrick: Canned Unicorn Meat
June 25th, 2010: WordPress 3 is out; domain prices are on the rise; and a look inside the servers at Facebook. I’m Kevin Yank, and this is the SitePoint Podcast number 67: The Browser Dance.
Kevin: And it’s another SitePoint Podcast — the official podcast of sitepoint.com.
I’m Kevin Yank as usual, and joined today by Stephan Segraves, Brad Williams, Patrick O’Keefe … hi guys!
Brad: Hi Kevin.
Stephan: Ahoy, hoy!
Kevin: Patrick we got some response from our last news and commentary show.
Patrick: Sure, we talked about Google Chrome and IE and browsers and all of that good stuff. We got a few comments on the blog post at sitepoint.com/podcast, so I wanted to talk about a few of those — the important comments, let’s say, because there were some other ones as well.
The first one was from capeskafe, and he says, “I think it’d be nice if all browsers upgraded themselves like Chrome. Then we wouldn’t still have people using IE6 and older browsers.” And that’s in reference to Chrome’s automatic updating of itself; we discussed that and how other browsers don’t do it. Trond chimes in and says he couldn’t agree more — we should even stop doing “if IE” in the code. Microsoft must be much more standards-compliant. I also hope the CSS WG and the browser vendors can agree on removing browser-specific stuff like -moz and -webkit.
Another comment here is from powerpotatoe. He says that, “I upgrade to the newest IE every time the service pack update includes it or whenever I upgrade to the latest Windows OS. When I upgraded to this I used the latest IE to download Firefox and Chrome. Once Firefox and Chrome are up and running, I rarely use IE for browsing and only use it more consistently for development purposes in order to see if my design works in IE.” That sounds like the designer perspective of this show, doesn’t it?
Kevin: Yeah, if only all our users were the same.
Patrick: Trond, who is a listener on the show, and he brought up another point for us to discuss. He wanted us to talk about if we again have a browser feature war. He says, “Much is happening with CSS 3 and HTML 5, but browsers themselves are out of sync.” And he talked about this in a little more detail in a blog post on his site, trondhuso.no, and we’ll link to this in the show notes, but basically he says that his inspiration for checking new features in HTML 5 and CSS 3 is because so many people are saying that Flash is dead, and HTML 5 and CSS 3 are what is going to kill it, or what has killed it. But he says that Flash is browser independent, and he cites the example of the website that is showing information about the World Cup and say that a designer wants to flip cards of players sliding in and out. He says that the company couldn’t do it at least using the 3D stuff in CSS 3. He says IE 8, Firefox 3.6, Opera and Chrome all don’t support it while Safari does, representing, he says, about 5% of the market.
So his summation the main point he wants to make is that the last time there were browser wars Microsoft claims that won, and what did we get? IE 6 still being used in 2010. So he doesn’t want a browser war again like that. But instead he wants there to be some sort of compliance standard that all browser vendors follow and for them to stop creating HTML and CSS rendering engines and to standardize on one or two, he suggests Webkit and Mozilla. So, well, who wants to take that first?
Kevin: Well, there’s a few things going on, and I think he’s contradicting himself a little.
I agree with him completely that the outcome of the last quote/unquote browser wars where IE won and then became this fixed point in time that persisted for six years or so and is still bothering us today — that’s a bad thing and we want to avoid that. I’m not sure why then he seems to circle back and suggest that the browser vendors of today need to pick one or two standard rendering engines and just stick with those. It seems if that’s what the outcome of the current process was we would end up right back where we were with Internet Explorer 6, with everyone going oh, well, there’s no need to worry about multiple browser engines, we’ve chosen the best one and we’ll just stick with it for all time. He seems to hold up Flash as a web standard. What do you think of that, Stephan, I know you must have some thoughts on that?
Stephan: Uh, I didn’t get that memo.
Stephan: I don’t know. I mean Flash, is it a web standard?
Kevin: Well, yeah, what is to you a web standard, because he seems to be suggesting that if what we want is a web standard in that “something that will work the same everywhere” is a web standard, then we should all be jumping on the Flash bandwagon because that’s exactly what it is.
Stephan: But I don’t think that it fits the description of a web standard. I mean who decided it was a web standard, Adobe? I think, like, HTML 5: that’s a standard, right? That’s a web standard. CSS: it’s a web standard, I don’t think you can call —
Kevin: Why, what’s the difference?
Stephan: Because there’s a group, a consortium of people got together and said these are technologies that are useful to people rather than just one company saying we’re gonna make some software and hope people use it. I think that’s the difference here.
Kevin: I think it’s the difference between — at the risk of getting too political here, a democracy and a dictatorship. Both will get a lot of people working in the same direction, but in a democracy it’s because everyone tried and suggested their own ideas and the majority rules, whereas in a dictatorship one person decides and everyone follows along whether they like it or not. Which is what I feel like we get with Flash, yes, Flash has that benefit that everywhere Flash works it’s Flash and it’s pretty much the same and if there’s a difference that’s a bug.
Stephan: Well, I have a feeling that what he’s saying is that Flash is used in a lot of places so it should be considered a standard, which I can kind of understand that.
Brad: Yeah, since Flash really has been the standard video rendering option out there for most people in the last few years, over many years now, so I think it’s not the standard but it certainly is a standard because so many people use it and so many people expect it. Does it mean it’s right? No, and it’s certainly not going to be around forever now that HTML 5 is shaping up to be a worthy competitor. But it certainly has been the standard for certain things like videos and games and things like that on the Web.
Kevin: He has a good point that the current raft of standards, HTML 5, CSS 3 … they are in a messy state at the moment, but you know, democracy is messy too; you have to give everyone a chance to go their own way before we decide which one is going to rule the day. And at the moment if you want a level playing field in web standards you’re still sticking with HTML 4 and CSS 2, that’s sort of the common ground at the moment. And HTML 5, CSS 3, these are standards under development and each of the different browsers are trying out different features of those under-development standards. He makes the point that the 3D features in CSS 3 are largely unsupported everywhere except Safari because Apple has a vested interest in having 3D effects in its own browser and that’s why it’s working hard on deploying those. But you look at the other browsers and their own efforts to begin supporting CSS 3 and HTML 5 have started in other areas. Presumably if all of these ideas end up being good ones all of the browsers will eventually support all this stuff in a standard way, but right now it’s early days — these things are in the proving stage. So perhaps part of your frustration, Trond, is that it’s a little early to be relying on HTML 5 and CSS 3 as standards. I would call them “standards under development” at the moment.
Patrick: Do we have a browser war? If it’s HTML 5 and CSS 3 if that’s the war, it’s a war for the minority I think because I think about the people that actually care about this issue. I think people want their browsers to work and the most people who use — we talked about how most people don’t know what a browser is, they know what Google is, you know we’ve had this kind of funny conversations, but they’re going to use the ones that work, and the websites are going to want to work in as many browsers as possible. So they’ll use Flash, they’ll use HTML 5, whatever works. But you know this sort of HTML 5, CSS 3 feature thing is very much a developer conversation, so a war? I don’t know.
Kevin: The last time we had a browser war it was very clear the two browsers were fighting it out for market share. I think we are in a browser war now in that these browsers, and there’s four of them now at least depending on how you count them, are again fighting for market share. But they each have their own reasons, you know, the Internet Explorer and the Safari they come bundled with operating systems, and so they are fighting for the same reasons those companies build their operating systems. Whereas the Firefox’s the Opera’s, they are kind of the independents and they just want to push their browsers as products. And then there’s Google whose Chrome browser is kind of a wild card. Google says they don’t really care whether Chrome wins or loses the browser war, but they are competing to show the other browsers how to compete for their own purposes, and so Google is trying to push the entire game forward by playing in it to enhance the Web as a whole, as a platform for their other products. It’s a really interesting one. I can’t — I’m not sure you can describe it as a war because all of these people are fighting for different reasons and different things. Maybe it’s a dance, it’s a browser dance!
Patrick: Who will fall first?
Brad: Next up we have some exciting news in the world of WordPress. WordPress 3.0, code-named Thelonious, named after the …
Kevin: I knew you’d be on top of this one Brad.
Brad: (laughs) I had a little bit of code in there. It’s actually named after the famous American jazz pianist Thelonious Monk — a little bit of trivia there for you; it was released June 17th to the public. Have you guys had a chance to upgrade your websites?
Kevin: I have upgraded one. The one that I had launched like a week before on WordPress 2.9, so I had installed, like, one plug-in, so it was a safe bet, and it was creepy how easily it uploaded, updated. I clicked the update link and it literally took half a second and it said, yeah, “Update complete.”
The update complete message displays in the old admin screen theme, and then you click Refresh and you have the new admin screen theme (laughs). It’s a little too easy.
Brad: That Refresh is always a little bit scary, you never quite know what’s gonna come up. But, yeah, they’ve really kind of locked down the upgrade process over the last few versions. I’ve probably upgraded 20, 25 sites now, and I haven’t had a single core-related issue; I have had issues with some plug-ins but nothing on the core side of WordPress, so it has been pretty smooth. They’ve actually had over 1200 bug fixes and feature enhancements in this version, and there’s a lot of really cool features we’ll discuss real quick.
So, one of the main ones, one of the most visual ones, is the new default theme, “2010”. So they’ve finally gotten rid of the default Kubrick theme, the blue kind of rounded cornered theme that we’re all used to seeing on the standard install of WordPress. This new theme, 2010, actually includes a lot of the new features available in 3.0 and some of the more recent versions. They kind of showcase what WordPress can do out of the box which I think is a great idea. Before, when you first install WordPress and you get Kubrick, the default them, and you look at it it’s not really that exciting.
Brad: It’s kind of plain, it doesn’t really —
Kevin: It was great for its time.
Brad: For its time it was awesome, yeah.
Kevin: But this new theme, this new theme my favorite feature of it in that it’s a default theme is that you customize the header image without having to do any coding whatsoever. So for new people setting up their new WordPress blogs the first thing they’ll see is that big sort of row of trees, a sort of a pathway through a park and a “row of trees”” image at the top of their blog and they’ll go, well that doesn’t really reflect my personality, or whatever it is I’m gonna be blogging about, so they can immediately go into their admin and upload their own header image. So while we will be seeing once again a lot of blogs that look like this, I think those people who use it to set up blogs are very quickly gonna customize that image so at least, at least we won’t have that single colored blue box at the top of all the pages.
Brad: Yeah, and that custom banner is actually a new API that’s supported in 3.0, that allows you to hook that into your own theme if you’re developing a theme, so with just a couple lines of code can easily swap out a new header images into your own theme as well as a background image. So it’s kind of like Twitter how you can set a background image on Twitter … you can now do that on WordPress, you can set it within your theme, you can usually upload a new background picture and it’s automatically added across your website. So a lot of cool new features there.
Another big one that a lot of users will definitely take notice is the new menu management system. And what this allows you to do is to make kind of complex menus within WordPress. So before, the old way was just you could have a menu of your pages in WordPress, you could have a menu of your categories, but if you wanted to try to mix the two or add external links, it was a real pain. And a lot of times it kind of turned into hardcoding those menus because there was no easy way to do it. Well, the new menu management solves that problem so you can actually create multiple menus and within these menus you can add pages, you can add categories, you can add external links to any website or external links to your own website. So if you want to link to a post or a tag or an author page, whatever it may be, you drop one line of code in your theme and you call the name of the menu you created and it’ll dynamically populate that menu. So it’s a really nice and easy way to kind of manage your menus on more complex websites.
Kevin: And the default theme is also widget-enabled for the first time as well, so all of those WordPress widgets you can download to stick in your sidebar whether it’s your Twitter stream or whatever it is. You can tuck them into the default theme for the first time, you don’t have to go finding a widget-enabled theme to use those features.
Brad: Yep. Another one of the major features, and this is a little more tech heavy, but if you’re a developer or you’re really into designing and customizing WordPress you’re gonna love it, and that’s the custom post-type enhancements. So custom post-types have been in WordPress since 2.9 but they’ve always been code side — there was no UI attached to them, so you could certainly use them but it wasn’t really easy. Well, 3.0 changes that and now with an easy function call you can actually register a post-type which is essentially another type of data within WordPress. So think of you have post and pages, those are both post-types, well now you can make a movie post-type if you do movie reviews or cars post type if you sell cars or you’re a car lot, or whatever, a podcast post-type, we could make just for the podcast on this show. And as soon as you register that post type WordPress will automatically add in all the admin UI stuff like the menu, management, you can click add new movie and create your new content for that movie, and it’s completely separate from your post. Whereas before you would kind of trick WordPress maybe by having like a podcast category and anything within that category is treated a little bit differently. You don’t have to do that anymore; you can actually make a post type just for your podcast and have a whole section dedicated to it and it won’t mess up your blog posts or anything like that. So it really kind of is moving WordPress into that true CMS-type platform, and this was a major step in the right direction for that.
Kevin: Well, what do you think of that? Is WordPress now just a CMS that comes configured as a blog by default?
Brad: Yeah, I truly believe that. In fact, one of the minor changes that you may not notice right off the bat: all the terminology in the admin side of WordPress now, instead of referencing the term ‘blog’ they’ve changed it all to ‘site’. So it’s no longer blog; if you add a new blog it’s now Add New Site or Your Site. It’s no longer Blog Name, it’s Site Name; or Blog Address, it’s Site Address. So this release they’re really trying to take that big step forward in the CMS territory and kind of lose that, oh, “WordPress is just a blog and that’s all it does”” kind of tag that’s been held over since it started really, because that’s technically what it was.
Patrick: I think that’s a good move. To me WordPress has been a CMS. Now it hasn’t always been as easy, let’s say, but like I have a site for my book and it’s WordPress powered, it’s not a blog, it’s just a normal sort of content website, so I manage it all through WordPress pages. So I think it’s just easier to do that CMS thing now with the custom post-types and obviously with the language change it’s obvious; that’s more of mental thing I think, but it is a good move for WordPress to broaden its perspective because it does seem like they’ve been not shouting from the mountaintop, maybe, but it seems like WordPress people have always been stressing that it is a CMS. And it is a CMS, not just blog software. Am I right in that perspective Brad?
Brad: Yeah, I mean essentially it has been a CMS for a long time. Of course WordPress started off as a blogging platform, that’s what it was, it was to create blogs. It’s evolved over time, I mean even back 2.5, you know, a lot of people have been really kind of tweaking it into a CMS, but it has been largely a lot of hacks. Like I said, you would have a post in a podcast category and you would treat it differently. Sure that kind of acts like a CMS, but technically it’s not because you’re just kind of modifying how categories and tags work. But now that you can actually create your own content types within WordPress it really does open the doors to unlimited possibilities. So I’m really excited to see what plug-ins start doing with these custom post types. I know I spoke with the plug-in author of WPE Commerce, which is the largest eCommerce plug-in for WordPress, at Word Camp Chicago, and they’re actually revamping that entire plug-in to use custom post-types for products, so when you make a new product in your eCommerce site it would actually be a post type rather than making their own tables and having to worry about handling all the data validation and things like that, they’re letting WordPress do that which really makes sense. So it’s pretty exciting. Definitely if you’re into building WordPress websites definitely check out the custom post-type enhancements in 3.0.
And then the final major feature in 3.0, and it’s certainly not the littlest feature: they’ve merged WordPress MU and standard WordPress into 3.0. So if you’re not familiar with WordPress MU, it was a separate installation of WordPress, you would download, you’d set it up, the installation was a little bit different than WordPress but kind of similar. And basically what it allows you to do is host multiple blogs in a single installation of WordPress. So a great example is wordpress.com which is hosted blogs — that runs off of WordPress MU. Every time somebody creates a blog it creates a database table and that person has their own blog which is separate and independent from all the other blogs on the site, but it’s running off one installation of WordPress. And now that’s been rolled into regular WordPress, so you add one flag to your WP config file and it enables the networking feature and then there’s a few more steps you have to do, and it will essentially turn on blogs so you could manage, you know, if you have ten different sites and even if they’re on their own domain you can roll these all into a single install of WordPress now and use domain mapping. So nobody would be the wiser that you actually have — you’re only using one installation of WordPress. They would look and feel and act just like independent websites.
Kevin: This sounds like a feature that is kind of only really big sites or if you want to run a blogging network, this feature would come in handy, but even just, you know, at SitePoint I can see how this could be useful. You mentioned using custom post-types for podcasts earlier, but I think if you wanted to split your podcast out into its own section on the site and not have it necessarily intermingled with the normal blog posts this feature would be a great use for that. I know at SitePoint we have a development blog as well as our main blog, and we have maintained separate WordPress installations for those before, which is a pain the butt, so yeah, I think it’s a great feature. I think people will be surprised how quickly this becomes useful to them.
Brad: I think the, in my opinion, the nicest part about multi-site is, you’re right, a lot of people aren’t going to use it, a lot of people probably won’t even know it’s there. But the nice thing is —
Kevin: It’s off by default.
Brad: Right, it’s off by default. The nice thing is its there if you need it. So say you start a blog, and a couple years from now your blog is massive, and you’re like, “You know what? I want to start another blog.” Well, you know, you no longer have to go to someone like me to convert your blog from WordPress into MU, import all your content, make sure everything works. Now you flip a switch and the functionality is there — boom, you can launch another site just like that. So it’s there if you need it, which I think is the nicest thing, no longer do you have to transfer back and forth.
Kevin: So you’re saying this feature is costing you money Brad.
Brad: Yeah. Are you happy WordPress? You’ve cost Brad a job.
Brad: Well, with all these other features there are more things that people want customized. So there’s always plenty of things to do in WordPress.
There are a couple other smaller features I just want to mention real quick. You can now bulk update your plug-ins and themes, so rather than update each plug-in one at a time you can just check them all and Bulk Update and that will happen. They also have full short link support, so now all of your posts by default will have a short link at your own domain which you can also hook in like a third party like bit.ly or Tiny URL to host that as well. During the installation process you can set the user name and password, which is a great one for security because you don’t want to use the admin user name, so you can change it before you even install WordPress. And then you can also have individual author templates. So if I wanted to have an author template for myself and one that looked a little different for Stephan or for Patrick you could do that now within WordPress. So, just some of the smaller features, obviously there’s a lot more than that and we’ll have links to the official announcement that kind of lists them all out. But it’s really exciting, so if you’re running WordPress definitely check out the new features and see if that’s something you’d like to be a part of.
Patrick: So before, I told you guys; how many of you were aware that domain name prices were going up July 1st?
Brad: I was not.
Patrick: Well, I didn’t know either until eNom emailed me just a couple days ago and said that prices were going up 55 cents per domain, per year, across all TLDs. So, 55 cents isn’t a ton, but when you think about going from $7.95 to $8.50 that’s a decent percentage jump. So I looked into it to make sure it wasn’t some sort of spam email or something that would trick me for some reason, I don’t know why they would do that, but I found a report at domainnamewire.com that said that VeriSign had upped prices by 7% for .com and 10% for .net at the wholesale level, pushing the wholesale price of a .com domain name to $7.52; $7.34 goes to VeriSign and .18 cents goes to ICANN. So chances are that July 1st your domain name registrar is raising prices. They may have already emailed you, but if not take a look. If they charge so much already maybe they are just going to absorb it, but if you’re using a low cost registrar like I was, chances are that you’re going to see a raise. So you may want to renew your domain names before that July 1st deadline.
Kevin: I want to talk about HTML 5 a bit more. And something that I’ve been looking at for the past couple of weeks, because we talk about how HTML 5 is great unless you need to code something that Flash requires, like a game. And what I’ve been looking at is some options for actually using HTML 5 for that sort of thing. This is something I started looking at after the WWDC, Apple’s Worldwide Developer Conference a couple of weeks ago, where Steve Jobs famously now said: listen, we have two platforms for you guys to code for. The first platform is HTML 5, the browser, the Web, it’s standards compliant, this is where you go if you don’t want to be subject to our app store approval policies. Whereas our second platform, the app store, is curated and you get in at our pleasure and if we don’t like the kind of content you have, we’re not going to let you in. But that’s fine because we have this open platform which lets you build web apps for our i-devices.
So I was curious just how realistic, you know, if you’re a game developer but you’re getting blocked out of the app store what do you do? So there are actually a few people who are experimenting with HTML 5 as a game development platform. The first one I found which is written up at the unofficial Apple web blog is Brian Akaka from his company, Appular. And they have a couple of sort of casual games in the app store, but what they’ve done is they’ve gone and created an HTML 5 version of one of their apps called Hand of Greed. And if you’ve got an iPhone or an iPad or one of these Apple-y devices you can go to brainiumstudios.com/webapp and check out this HTML 5 version of their app. Any other browser, it’s going to go, “Sorry this is a web app written for i-devices. Come back with your i-device and have a play.” But I was really impressed at how slick this was. The game is simple admittedly; the idea of the game is that you have to tap on coins and jewels to pick them up without getting your finger chopped off by the spinning blades and so forth. But the animation is really slick and the game, surprisingly, works really well. Now they’re just using it as a way to promote their app store version, but they’re also kind of hedging their bets and experimenting with this stuff to see if it’s a realistic option.
The other one that I looked at, which is over at Ajaxian, is actually a game engine, and the engine is called Aves, A-V-E-S. What this engine does is it lets you create these sort of 3D worlds. I don’t know if you’ve ever played the Sims or something like that, but that’s what this current demo looks like. It’s entirely running in the browser but you can drag around this virtual 3D world that has roads going through it and houses and then you can go inside the houses and see your people walking around the furniture, and stuff like that, and it’s entirely rendered in the browser. This engine is something they’re going to release so that developers can build their own games on it. So if you were thinking of building one of these sort of 3D-looking virtual world games, and it looks like their demo is even multi-player, so they’re saying they can render many different players, characters wandering around in the world at once, it surprising what they’ve achieved. And, yeah, short of really dynamic effects that need to be calculated on the fly, and even those I think you could do with HTML5’s canvas tag, there are quite a lot of possibilities out there. So to say that you need to go through the app store to do games might not be quite right. I think we’ll be surprised to see what people build on HTML 5.
So, how long do you guys think before we start seeing really polished dev tools for building, I don’t know, games and applications using web technologies?
Stephan: I’m hoping soon. It’d be nice to have something that we could use that was out now, but the tools that Apple gives are rudimentary at best I think for what we’re trying to do. And what I thought was interesting on Thomas Fuchs blog was that the touch events thing where he’s talking about how onClick has a delay. I had no idea. That’s really interesting to me, and it’s things like that, you know, we need a tool out there that maybe pops up and says, hey, you might want to use a touch event not an onClick or something; for those of us that are just getting into the development for the touch devices.
Kevin: Well, yeah, we see building applications using web technologies — that’s been around for a while. You see frameworks out there for building applications using web technologies, but generally they’re targeted for the desktop. Things like Google Web Toolkit that lets you code in Java using a really visual environment to develop the widgets of your app, things like that; they compile down to web technologies, but they don’t take into account all of these optimizations that are needed for the mobile devices. So I would say that Google Web Toolkit apps probably won’t have the native feel, the sheer performance that Thomas Fuchs was able to get out of his code by coding everything by hand. So I don’t know if we need entirely new dev tools, entirely new dev environments, entirely new frameworks that target these devices. I think it would be a shame. It kind of goes against the grain of the Web that you can write something once and it works everywhere the Web goes. But if you try and think of it as kind of, you know, it’s the same technologies but used in a different way to a different end, we’re not building web apps here, we’re building Apple device apps and we just happen to be using web technologies to do it which is the same sort of thing we saw on Palms WebOS for a while. Then, you know, I can kind of make my peace with that, but yeah, I think it does call for entirely new dev tools and it doesn’t seem like Apple’s going to give them to us. Seems like Apple’s fully invested in making its apps store development as slick as possible, but if this second platform that they support is really going to flourish, someone is going to have to build those dev tools for it, and it’s not going to be Apple I don’t think.
Brad: Yeah, this Suburban World video is pretty amazing. I had no idea that HTML 5 games were even at this level yet. I mean it looks just like a Sims game. I mean you can’t — obviously it doesn’t have the detail of like a game you’d have and sell on your computer, but just basically how they’re zooming in and dropping stuff from their inventory and interacting with these characters that are walking around, I mean it’s amazing what they’ve done here. In fact, in one scene in the video right around the 4:20 mark they open up their inventory and they drag a game onto the TV which then drops on the TV and opens a window and it’s Super Mario Brothers, and then they start playing that through the game. So they’re playing a game in a game, I mean it’s pretty wild stuff. I was blown away by it.
Brad: So Facebook is a pretty large site, right? I mean they’re pretty big.
Stephan: Tiny. That’s tiny. What on earth are you talking about?
Brad: They get a little bit of traffic. So have you ever wondered about the software that powers Facebook?
Brad: (laughs) Well, wonder no more. Pingdom — pingdom.com — which is an uptime and performance monitoring service, they actually wrote a really, really interesting article on some of the software behind Facebook that allows a site as massive as Facebook to run at lightspeed, and it’s pretty neat. First, let’s talk about some stats here because I think it kind of gives you an idea of how big Facebook is. So Facebook currently serves up 570 billion page views per month. There are more photos currently on Facebook than all of the other photo sites combined, and this includes the large players like Flickr and Picasa and the rest. More than three billion photos are uploaded every month.
Patrick: That to me is insane. 570 billion page views per month? Three billion photos per month. So, how many page views is that? For every 190 page views you get one photo uploaded. It’s insane that Facebook is now not only the biggest social network, but they’re the biggest photo sharing site. They’re probably one of the top search engines in the world if you really drill down on those stats. It’s insane how large their reach is.
Brad: How about this stat. I think this is probably one of the craziest: Facebook serves up 1.2 million photos per second.
Stephan: That’s insane.
Brad: That’s mind-boggling.
Kevin: I got a mind blowing one for you. They said three billion photos uploaded every month; I just divided three billion by 30 days by 24 hours by 60 minutes, that is still 69,000 photos uploaded per minute to Facebook.
Patrick: But how many people are untagging themselves per second?
Stephan: That’s the real question, yeah.
Kevin: So this article, Brad, I kind of knew about all these pieces of software, but seeing them all in one place really astounded me. It made me feel really backward because, Facebook, the software they’re running to make all this possible, it is — it is insane. It’s like there is no part of their website that is standard, as you would define standard as being what you would get by setting up a DreamHost account and putting your site up there. It’s like they’ve broken every single piece of software that you would normally use, so you know, Apache web server, yeah, not gonna do the trick; MySQL database server, yeah, that’s not dealing with all those photos. And they’ve one by one had to replace these pieces of infrastructure with higher performance versions.
Brad: Yeah, and if you go through the list, and we can run through it real quickly here, I was surprised by how many open source projects they work with. I guess I knew some of them, but I guess that it’s a good majority of what they work with is open source, and it’s either something they’ve open sourced or something that they’ve kind of like you said, jumped on and kind of helped develop, did what they need to do so it’d handle that amount of load and then contribute it back to that open source project.
Kevin: A great example of something they’ve built in-house and then open sourced is their HipHop software which basically compiles PHP into C++ code because PHP was just not fast enough for them. And that by itself was surprising because a lot of people choose PHP for its performance among other server side development languages. So I guess when PHP isn’t fast enough for you there isn’t a lot else to try, and so they had to build their own thing that converts PHP into basically native applications for their web server to run. And this is something that we played with a little when it first came out, so yeah, everyone got really excited when Facebook said oh yeah, that magic sauce we made to make PHP blazing fast, yeah, we’re gonna release that open source. I think you have to be a pretty massive site to really make the, I guess the difficulty of setting this up and maintaining this thing worthwhile. I know for example SitePoint it’s a very heavily trafficked site, but we can still get by with a standard PHP install. But, yeah, if you’re pushing a lot of requests around HipHop is really exciting.
Something that’s a little more useful to I guess what you would call the average size site would be something like Memcached which is their very first piece of software in this article. And as soon as you need multiple web servers, Memcached becomes really useful because you can sort of set it up as a shared cache between your multiple web servers, and so if one web server does some work to calculate a piece of content, you can tuck it into this shared cache so the other web server doesn’t have to do that same piece of work. It really speeds things up a lot as soon as you get into a multi-server environment like what we have at SitePoint, and we’re big fans of Memcached for that reason.
I think we could spend all day going through this list of software, Brad, but —
Brad: Yeah, we certainly could do that.
Kevin: — I would suggest our listeners should go and read through this because it’s a great summary. It doesn’t go into too much detail about each one — it’s like two paragraphs about each one, and it’s just enough for you to go, huh, if I ever I run into a performance problem in that area of my server set up I know what to go look at. And, yeah, just amazing.
Brad: If ever I have 1.2 million photos per second I need to serve up I’ll know what to do.
Patrick: Basically reinvent everything. I think that’s what you’ve got to do — it’s like nothing will work for us, we have to make it; this is why I always say nothing is impossible in this world you just need enough programmers.
Stephan: I still can’t believe they get 570 billion page views a month. Even if every person on earth went to the site a hundred times a month …
Kevin: Well, you know every time a person plants a piece of cauliflower in Farmville that’s another page view.
Stephan: Yeah, that’s true.
Brad: I think the one I would probably pick off this list I thought was the most interesting is Big Pipe. It’s basically a dynamic web page serving system. And what it does it breaks up Facebook, every little kind of module or section you see they call pagelets. And what BigPipe allows them to do is retrieve these pagelets in parallel, so for instance, like your chat is one pagelet, your news feed is another, the sponsor on the side is another, so BigPipe is basically retrieving all these at the same time rather than in typical-server side language just going down the page and loading it. So it can serve them up that much quicker, so it’s kind neat how they break that up into different pagelets when the page is loading. So one isn’t stuck on loading while the other ones are waiting for it, they basically can load in parallel so it’s pretty interesting. And all the closed-source systems that aren’t necessarily open sourced are typically because they’re so niche to what Facebook does obviously with this type of traffic, they have some very special systems, but they do actually post a lot of blog posts and kind of describe what they’ve done in detail with flow charts and all sorts of stuff, like BigPipe is one of those that they’ve kind of detailed out. And they show the old method and they show the new method and they show some comparison charts on speed. It’s real interesting if you really want to geek it up one night and go through each one of these and kind of look at them, but it’s definitely a cool article.
Kevin: It’d be interesting to see WordPress 4.0 use BigPipe.
Brad: (laughs) You never know.
Kevin: Well, love ‘em or hate ‘em Facebook is doing some impressive work and it’s great to see just how much of that is available for, you know, the little people like you and me to take advantage of.
I think it’s time to get into our host spotlights guys, and I’ll lead it off this week. My host spotlight is this little piece of software called Ephemera. And with all the talk going around about iPads, I think the Kindle users, the Amazon Kindle users, must be feeling a little starved for love. Your Kindle is probably not looking as sexy as it did before Apple released the iPad, and I’m here to bring a little more sexy back to your Kindle, because I’ve got a neglected Kindle that I haven’t been using much lately. And this piece of software has reinvigorated my love for the Kindle. It’s a Mac app, I’m afraid, so Windows users may have to look for an equivalent, but this software called Ephemera for the Mac, it links into this service called Instapaper that we have mentioned before on this podcast. Instapaper, for those who don’t know, puts a little button in your browser so any time you arrive at a story or page or something that you don’t have time to read right now but you would love to curl up with and really sink your teeth into the next time you have some spare time, you hit that button, it adds it to your Instapaper account, it strips out all the ads and you can read it distraction free the next time you have some spare time on your hands. Well, Ephemera will — what it does is once its installed in your computer, every time you plug in your Kindle it goes, finds all of the articles in your Instapaper account, converts them into little eBooks or mini eBooks, loads them onto your Kindle and then you can walk away and, without an Internet connection on your Kindle read the stuff that you have previously put into your Instapaper account, and as you read and delete these stories on your Kindle then the next time you plug it back into your computer Ephemera automatically synchs those read articles back to your Instapaper account so anything you deleted on your Kindle is automatically archived in your Instapaper account. So it’s a two-way sync, it works amazingly slickly, and I can’t recommend it highly enough. It is completely free.
Stephan what have you got for us?
Stephan: Well, since we were talking about earlier HTML 5 and tool kits with Apple, I was reading a blog post by Duncan Wilcox on Touch Content Creation, and he goes into just kind of the new world of how we’re changing the way we interact with computers and how we’re going to create new content, and it’s a really — I think it’s a really well-written blog post in a really — it’s a good read because it gets you thinking about going forward and where we’re going to be with how we interact with devices and how you should be designing your applications due to that. So, I say read it, I’m not going to give you a synopsis or anything here, it’s worth a good read.
Brad: Yeah, and going along with the whole WordPress 3.0, my spotlight is a plug-in for WordPress which I actually built, it’s a little self promotion, but the plug-in is called Custom Post Type UI, as in user interface. And what it allows you to do is if you’re creating post-types in WordPress it’s all function calls to register those post types using PHP code. Well, a lot of people aren’t real comfortable doing that or they just want to kind of play with post-types and see how they work. So basically my plug-in adds a user interface into the WordPress dashboard where you can easily create post-types just by filling out a couple of form fields, click create, and boom! You have a new post-type. You can also create custom taxonomies, so you know if you have like a movies post type you can add an actor’s taxonomy or director’s taxonomy and you can attach it to that post type in a really easy fashion. So, again, the plug-in is called Custom Post Type UI and it’s available on the WordPress.org plug-in directory.
Patrick: Okay, so this is hilarious. If you’re familiar with ThinkGeek they sell a lot of random geeky items, offbeat items, and they do an April’s Fool’s joke, of course. And one of the April Fool’s jokes they’ve pulled is that they’re selling canned unicorn meat for 9.99, okay, and it says caviar is so 1980s, unicorn is a sparkling, crunchy, savory meat of today’s elite. And if you go to buy, click buy now, you get a ‘Gotcha, April Fool’s Day’. And a little farther down on the page it says “Pate is passé; unicorn — the new white meat.” And it goes on to have a recipe for savory unicorn and heirloom tomato bruschetta, and it goes on to even break down the parts of a unicorn that go into the meat, like dreams and wishes and giggles, smiles, hopes, hugs, and more. So that’s not the funny part though. So, the funny part is that they got a cease-and-desist letter from a law firm in Denver, I believe it’s Faegre & Benson, and they are representing, well, the pork industry. And the reason is the National Pork Board specifically they feel that they have infringed on their slogan, “The Other White Meat.” And they sent a 12 page letter, a 12 page cease-and-desist to thank Geek about this April Fool’s Day joke, and if you go to the page and look at the meat it looks awful, it’s this slab of sparkly meat-looking substance on a plate (laughing).
How many attorney hours did it cost to put this together, to research it for 12 pages and send this? (laughing)
Patrick: It’s utterly hilarious. And ThinkGeek is really playing it up with the press release and quotes from their CEO and stuff. “It was never our intention to cause a national crisis and misguide American citizens regarding the differences between the pig and the unicorn. In fact, Think Geek’s canned unicorn meat is sparkly, a bit red, and not approved by any government entity.” Oh, boy.
Stephan: I’m in the wrong industry. I need to charge by the hour more often.
Kevin: If you have not clicked the image on the canned unicorn meat page to see it in its full-sized glory, you are missing out.
As far as I can tell they’ve taken a hunk of canned meat and rolled it in blue sparkles, so there’s the visual for you.
Patrick: (laughing) It’s funny, yeah. And an excellent source of sparkles.
Kevin: So I think that wraps it up for another episode. Patrick what have we got coming next week for our interview show?
Patrick: Well, next week we have a special all book authors’ edition of the SitePoint Podcast live from WordCamp Raleigh where we recorded interviews face-to-face, in person, with people at the event. The authors we’ll have are Aaron Brazell, Lisa Sabin-Wilson and Brandon Eley. Both Aaron and Lisa wrote books, oddly enough, about WordPress: WordPress Bible, and WordPress for Dummies. Brandon, of course, wrote the book Online Marketing Inside Out with Shane Tilley for SitePoint, and so we’re going to talk about writing books, WordPress and more.
Kevin: Brandon’s been on this podcast before, so it’s good to get a friend of the show back on.
Let’s go around the table guys. Where can people find more of our lovely hosts?
Kevin: And I’m Kevin Yank — @sentience on Twitter — and you can follow SitePoint at @sitepointdotcom. Visit sitepoint.com/podcast to leave comments on this show. As you heard today we love to discuss your comments so please send them our way.
The SitePoint Podcast is produced by Carl Longnecker and I’m Kevin Yank. Thanks for listening. Bye bye!
Theme music by Mike Mella.
Thanks for listening! Feel free to let us know how we’re doing, or to continue the discussion, using the comments field below.