robert hahn

a darn good web developer

June 27, 2006

Preprocessors and HTML Development

There are, of course, plenty of things to dislike about your work when you’re a web site developer. For this article, I’m going to talk about my dislike of typing HTML. Specifically, I hated having to type close tags, and even pointy brackets – it feels, well, unnecessary. As noted elsewhere (and here), I prefer to hand-code my pages. Even though I felt like I was typing too much, the solution, in my eyes, wasn’t to use a WYSIWYG tool, but to type less to do the same amount of work.

During 2002-2003, I was a student of the Education Program for Software Professionals, offered by the University of Waterloo, and in one of the courses, I had to learn about C, and, apropos to this article, the C preprocessor (cpp). I quickly realized that the preprocessor, despite it’s long association with the C toolchain, could work equally well to any chunk of text, not just C code. Interesting. HTML is basically just text…

So, off I went to set up a huge set of #define’s that basically re-implemented HTML. With parentheses. After all, if I could just type b(foo), instead of <b>foo</b> well, I could save myself 4 keystrokes!

Let me tell you something. Building HTML pages with parentheses is a worse hell than typing in the darn tags. But I hadn’t learned that lesson yet – the problem was that the C preprocessor wasn’t quite powerful enough to build a page properly, with the kind and amount of tags (and their attributes) that I needed. So I went on the hunt for a better preprocessor than cpp. And I discovered gm4.

So I spent a long time trying to figure out how gm4 worked - it’s much more powerful, but because of that, it was much harder to write macros that worked properly. But I did it. I was able to re-implement HTML again, using m4 defines. And then I learned yet again, and this time ‘for reals’ that coding HTML using parentheses is a worse hell than doing it the old fashioned way.

It took me a long time to figure out what all of the problems were with the way I was trying to resolve my complaint. I found that:

after an appallingly short period of time, my source files were unmaintainable, mostly because of the preponderance of parentheses, but also because I was hiding some attributes in the macros, and I couldn’t tell, for example, whether an argument was going to end up in a class attribute or an id attribute.
in hand with the previous point, my files were indecipherable to anyone else taking up the project.
running a code generator by hand (launchd didn’t exist, and I hadn’t hear of xinetd) was a bothersome task.
I was totally abstracting at the wrong level for macros to be effective.

The last point seemed to be the most significant one in my eyes, but I was reluctant to write macros on a higher level, because it would limit my low-level expressiveness.

My next epiphany happened a year later, when I experimented with using Xcode for web development. The big draw for using Xcode, in my opinion, was that I could write scripts and add them to a pulldown menu. So, for example, I could ressurrect my old xhtml.m4 defines file and hook it in, and whenever i wrote a batch of macros, I’d hit the menu and it would generate the HTML for me. I even piped my output through HTMLTidy for pretty-printing and validation too. In this way, I never generated any unmaintainable source files, and I could finally start saving on keystrokes.

Well, that was a nice pipe dream. I was able to get the system going, but Xcode was rather… flaky. Yeah. It’s kind of difficult to be productive when Xcode crashes on you several times while building one document, you know?

But it was powerful. When it worked, it was a beautiful thing. I still didn’t know which argument turned into a class or id attribute, but I knew I was on to something. I had the right idea, but the wrong tool.

I did eventually figure out how to tackle this problem, but I’m going to save it for another article. In the meantime, I was able to dig up a couple of samples of my xhtml macros in cpp and m4 format, and have made them available for you to use. Here they are: xhtml-tr.cpp and xhtml-tr.m4. I’m definitely interested in hearing from you if you put these files to work, and if you figured out productive ways to work with them.