This is old content! The graveyard is a snapshot of content created from 2002-2005. For new stuff, visit Maniacal Rage.

Infrastructure Tutorial

posted on july 7, 2003, tag: site

Since the release of the newest design of this site, I've received several requests for more information on how I structured the code side of the site. Initially I had planned on making the source-code of the website available for viewing, but that became too much of a hassle. Instead, I'm going to describe, with examples, how everything works. If you have specific questions, please feel free to comment on this entry or send me an email (garrett at codebucket dot com).

Let's start with a simple diagram I whipped up when I first decided to re-code the site from the ground up a few months ago. I know you're supposed to use a program like Visio for this sort of thing, but I've always preferred to just create something in Photoshop or Illustrator. Works better for me. Click the image below to see the diagram.

Server Diagram
Maniacal Rage Server Diagram (21KB)

So then. That was the plan, and it ended up working exactly like that. I'm still using MovableType, but I've completely circumvented the templates system (well, almost completely as you'll see), and I've switched all content handling to PHP and Smarty™. Why do this? Well, MT has this annoying feature were it "builds" pages each time something in your content changes (comments, new entries, etcetera), and this building function actually creates hard-coded versions of your files. Why is that bad? Well, it's not, technically, but there's a reason I've decided to use a dynamic system—I want my site to be dynamic. There are also practical reasons for doing this: by not using MT's templates, you significantly cut down on the amount of information that has to be rebuilt when something changes in your content. That means a faster site. Noticeably faster, actually.

But how did I do this? It was actually quite simple. I got the idea from reading one of Brad Choate's entries about Smarty, and put his foundation to use. Basically, everything here starts with Template Modules. One of the great things about MT is its flexibility when it comes to playing with the system. In fact, other than the search template (which has to be in CGI form to work), you can pretty much have MT output your content any way you want. Like, say, into PHP arrays. Obviously, you'll need PHP to do this. You don't, however, need Smarty if you don't want to do that part. Here's how it works:

Start out by creating a basic template (or modifying a current one like Main Index). Only this time, instead of filling this template with a bunch of HTML code, just toss in a few important lines:

<MTInclude module="Index Array">
$section = 'index';

You may be asking yourself how this is going to work with just that many lines of code. Well, it won't. But, what we've done here is just to get the ball rolling. Now when someone hits index.php, MT will run the "Index Array" template module (we've yet to create this), set the section variable to "index" and include a PHP file called "manage." Now we need to create the template module. It's going to do the real work. Create a new TM (bottom of the templates page) and name it Index Array. In the module body, you're going to need to create an array of all the content you need to build your index page. Click here to see my Index Array template module for an example.

So now you've got a multidimensional array called $entries that contains everything you need for each entry to be shown on your index page, and it and the section variable can now be used in the file you included, manage.php. Manage.php is going to do all the legwork now that we have our content. It's really easy—all you need to do is either call template files, or, if you don't want to use Smarty, write XHTML to output, based on the section variable. For instance:

switch ($section) {
     case 'index':
          // echo HTML here

But remember, since you've stored all your content in a multidimensional array, you'll need to loop through it to utilize each item. If you used my index array example, and wanted to echo the title of each entry in the array, you could use a loop something like this:

for ($i=0;$i<count($entries);$i++) {
     echo 'Title: '.$entries[$i]['title'];

Once you've handled all the elements of the index, you can continue to build a new template module for each section of your website. There are special circumstances where you're going to need to get a little trickier using this method, and that's when there are multiple content items within a content item (ie: comments). To handle this, you can simply create multiple arrays. For instance, if we wanted to also get all the comments for each of the entries in the index array example, we could modify the $entries array to contain one additional key whose value was an array of the comments, like this:

$comment[] = array(
     'author' => '<$MTCommentAuthorLink spam_protect="1" encode_php="q"$>',
     'datetime' => '<$MTCommentDate format="%B %d, %Y at %X"$>',
     'body' => '<$MTCommentBody smart_quotes="2" smart_dashes="1"$>'

// Then, change your entries array to include the comments array
$entries = array(
     'entryid' => '<$MTEntryID$>',
     ... etcetera ...
     'comments' => $comment

Then later you can do a loop within your loop to get that information. I know this might sound a bit complicated, but it's really not once you get the hang of it. Using this system you can build a very efficient system that still utilizes the power of Movable Type, but allows you to really squeeze in a lot of PHP power as well.


There are 5 comments, comments are closed

Courtney on 07/08/2003:

Although Garrett is correct in saying that his site is noticeably faster without static HTML documents, this is certainly not always the case. As a rule of thumb, a site with content that rarely changes should just about always stick with caching the latest version as a static file. In this case, using a scripting language such as PHP to dynamically regenerate the same content each time is largely inefficient and can quickly tie down a server that would otherwise have been fine. The key point to note is that server side scripting languages all utilize valuable processing time that could have otherwise been used to serve additional requests. In other words, a machine serving static HTML will be able to handle more near-simultaneous hits than one using PHP (or Perl or JSP or ...).

On the other hand, sites that have content which changes frequently usually use a combination of caching and load-balancing schemes to reduce stress on each machine. However, on a site such as this (or most personal blogs for that matter), traffic is low enough that most changes are negligible and the negative side-effects of dynamic generation are not often seen.

Garrett: Your Preview comment function doesn't seem to be working all that well here. Any clue what's wrong? (It took about 20 seconds to preview this comment)

Garrett on 07/08/2003:

I think you missed the point—this system is faster not because it's using PHP, but because when it rebuilds (MT, that is) it doesn't actually have to write out full HTML-equivalent files. It's only writing out an array. That's faster.

Also, ironically, the reason the comment preview lags so much here is due to the shitty quality of hosting this company is providing. I've been hosting this domain with a different service, which is cheaper than HR (only 5 bucks) and the price makes sense. I'm going to move it to HR in a few days. Until then, bear with it, sorry.

Ryan on 07/09/2003:

good stuff garret, i might try it out....

Garrett on 07/09/2003:

As far as load time goes, I don't think it's any slower... probably not faster, though. I was more worried about rebuild time than anything else, since that's when you would notice the slow down.

Courtney on 07/09/2003:

So you're saying it's quicker to build, not quicker to load? I seem to recall you mentioning a while back that the switch improved load time as well. Then again, I could just be making that up.

See Also

View the archive

Original iPod Introduction
How far we've come in just a few short years. Here's where it all started.

Front Row on Non-iMacs
Going to try this tonight!

DY starts a one-week short story writing event for people to lazy to enty NaNoWriMo. VerCooIdea.

Lost Rhapsody
Funny Flash movie using Weird Al music and Lost stuff. Lyrics make a surprising amount of sense!

Jed's Other Poem
Unsolicited music video made on an Apple ][. Fantastic!

Printers Output Secret Barcode
The government is keeping tabs on what you print, with the help of major printer companies.

Dreamhost Promo Codes
DH already has very cheap, very good hosting—this just sweetens the deal.

Photos of the new iPod
Just received my new iPod and I put a few photos up.

PEZ MP3 Player
Funny idea that actually looks kind of neat. I like that it comes pre-loaded with "indie" music.

HD Easter Egg
"My Name is Earl" on NBC gives viewers with HD TVs a little easter egg. Cute, but weird.