Home » Blog
date 26.Oct.2017

■ I compiled my static website with Visual Studio preprocessor


You need a website and have no clue about HTML? Use wordpress and the like CMS (content management systems). More advanced people use static website generators like Hugo, Jekyll and tons of similar stuff. A static website doesn't suffer of any wordpress security issues that could compromise your server.

Then there is the low tech approach which I used for my not-so-state-of-the-art website, i.e. design a basic template page and for each new page (e.g. this blog post), duplicate the HTML file adding content. This cheap and cheerful approach will hit into problems if I ever want to change the looks of the website though.

A website comprises many pages that share similar attributes like the header, the navigation menu, footer etc. HTML doesn't offer much help sharing "code" in different pages, other than external CSS style sheets. There are a few ways to include one HTML file into another via server side includes and javascript which are overly complex for simple websites. The aforementioned static site generators cater for this need, but that's for the lay persons :P

If you are a C/C++ programmer you will be familiar with header files that are #included in source code files with common code blocks and #defined preprocessor variables. With a few changes in the header file you can modify all the source code that includes it. So here's a crazy idea: is it possible to use visual studio's preprocessor as a substitute for Hugo, Jekyll and all the rest of it? As it turns out you can, but only hard core programmers need apply :)

Visual studio's compiler has the /EP switch that just runs the preprocessor without compiling any code. It just inserts all the included files and the defined variables and emits the resulting text. Hence it can be used to automatically generate HTML pages using #include and #define directives! Here is an example:

common header intermediate html final page
// header.h (shared html)
// variable date
#define COPYRIGHT (c) 2017 zabkat

// heading shared in many html files
<h1>Wonderful website heading</h1>

// ... other shared stuff
  +  
// test.c (html page to be)
<html><body>

// variable definitions here
#include "header.h"

<p>this is a website compiled in C!

// copyright date from header
<p>COPYRIGHT

</body></html>
  ==  
<html><body>

<h1>Wonderful website heading</h1>

<p>this is a website compiled in C! <p>(c) 2017 zabkat </body></html>

The first file HEADER.H has all the common html (or rather a HTML block) and variables like COPYRIGHT all expressed in C preprocessor compatible format. This header is then included in the actual html page and we let the C compiler generate the output .HTM file as such:

%MSVCDIR%\bin\cl.exe /EP /nologo test.c > out.htm

Here are the party tricks we've used:

With this simple system we can have any number of shared html blocks and include them in various pages. Whenever we need to change the format, or to change a variable (e.g. the copyright date changing chore that spoils every webmaster's new year day), we only need to change 2-3 header files and the website will be automatically updated after this primitive compilation.

Managing a whole website with visual studio

A large website will be made of 2-3 common header files and a number of .C (pre-html) files with the actual pages. Each page will need to be compiled to generate the final static website. Quite possibly you can create a visual studio project or a makefile for this precompilation task. But using xplorer² you can simply use a command script <Ctrl+B> to operate on all the selected .C files in one go:

sample script for html compilation task

So there you have it, visual studio based wordpress killer for the fastest most responsive websites <g>

Post a comment on this topic »

Share |

©2002-2017 ZABKAT LTD, all rights reserved | Privacy policy | Sitemap