9th July 2022
Example Theme for Simplified Saaze: Koehntopp
Simplified Saaze is the static site generator, which is used to generate this blog. So far, there are two example themes for Saaze.
- Saaze Example: By design, this design is very simple.
- Saaze J-Pilot: This design contains top-menus with sub-menus, pages in English and German, a blog, responsive elements.
Here is another theme, called Koehntopp, modeled after the personal blog of Kristian Köhntopp. This blog itself is based on the Jekyll-based theme Type on Strap. Some characteristics:
- Responsive design
- Based on Bootstrap-CSS
- RSS feed
- Search functionality, if you have PHP on the web-server
Using Simplified Saaze will further provide MathJax, YouTube, Twitter, CodePen, image galleries, and all the other goodies.
1. Demo. You can view the theme in action here: koehntopp. The content is directly from Kristian Köhntopp's GitHub page.
The source code for the koehntopp theme is here: eklausme/saaze-koehntopp. It can be installed with Composer:
composer create-project eklausme/saaze-koehntopp
Output of this command looks like this:
tmp$ time composer create-project eklausme/saaze-koehntopp Creating a "eklausme/saaze-koehntopp" project at "./saaze-koehntopp" Info from https://repo.packagist.org: #StandWithUkraine Installing eklausme/saaze-koehntopp (v1.1) - Downloading eklausme/saaze-koehntopp (v1.1) - Installing eklausme/saaze-koehntopp (v1.1): Extracting archive Created project in /tmp/T/saaze-koehntopp Loading composer repositories with package information Updating dependencies Lock file operations: 1 install, 0 updates, 0 removals - Locking eklausme/saaze (v1.10) Writing lock file Installing dependencies from lock file (including require-dev) Package operations: 1 install, 0 updates, 0 removals - Downloading eklausme/saaze (v1.10) - Installing eklausme/saaze (v1.10): Extracting archive Generating optimized autoload files real 2.60s user 0.30s sys 0 swapped 0 total space 0 /tmp/T$ l ./ ../ saaze-koehntopp/ /tmp/T$ l saaze-koehntopp ./ ../ bin/ composer.json composer.lock content/ .gitignore LICENSE public/ README.md saaze* templates/ vendor/
This will install the theme and the static site generator in one step. You still need to follow the steps in Installation, i.e.,
- make yaml extension available for
Once everything is installed switch to the directory and run
time php saaze -b /tmp/build
time is only to show you how quick it really is. Runtime on AMD Ryzen 7 5700G is less than 0.2 seconds for almost 1,000 blog posts. And for this only a single core is used. The
-d /tmp/build is used to generate the static HTML file in
/tmp, which happens to be a RAM disk on Arch Linux. Any other directory will do.
2. Conversion. In case you want to replicate the conversion from the original blog of Kristian Köhntopp, hitherto using Hugo, to Simplified Saaze you will proceed as follows:
- Clone GitHub repository github.com/isotopp.github.io
- Manually rename
2019-04-25-what-has-kubernetes-ever-done=for-us.mdto the same file without the equal sign
- Remove file 2004-02-08-cooties.md, as it is entirely empty
- Run each content file through Perl script
for i in *.md; do ... done
- Change directory to
content/postsand run Perl script
blogcategory -p ../ *.md > ../cat_and_tags.json
- I ran the CSS through CSS Beautifier, now called
Above steps give you what you see on koehntopp, but they do not give you the same URLs as blog.koehntopp.info. If you want identical URLs, then you would have to activate so called "ugly URLs" in Simplified Saaze. Furthermore, the Markdown content would have to be distributed among the various sub-directories. If you do not want to redistribute the original content among directories, then one of the below methods would do:
- Use URL rewriting in the web-server, see computation of
- Create static HTML files with redirects to the new locations
3. Comparison. Below are the number of lines for configuration and templates, furthermore errors on pages, and runtimes. Runtimes were measured on AMD Ryzen 7 5700G, max. 5.7 GHz, 64 GB RAM, all files were in RAM disk.
|config.yaml: 87||posts.yml+aux.yml: 10||9:1|
|W3 validator errors:8||W3 validator errors:0||∞|
|dependencies: 111||dependencies: 2||55:1|
|LOC: 162,800||LOC: 1,400||116:1|
|hugo build: real 1.15s||php saaze: real 0.19s||6:1|
|hugo build: user 12.15s||php saaze: user 0.15s||81:1|
Kristian Köhntopp reports runtime for Hugo to be 8.156s on his machine. Apparently, his machine is a slow machine. So according above table based on Ryzen 5700G, Simplified Saaze is more than six times faster than Hugo in real time. Real time is the time, the user actually has to wait for his results, sometimes also called elapsed time. Simplified Saaze is more than 70-times faster than Hugo w.r.t. CPU time. User time is the time all CPUs together needed to compute your result. The AMD Ryzen 7 5700G CPU has 16 logical cores. All these cores were used by Hugo, only one was used for Simplified Saaze. More comparison of runtimes between Simplified Saaze and other static site generators are here Performance Comparison Saaze vs. Hugo vs. Zola.
Kristian Köhntopp remarks:
Build time is 0.272s, approximately human reaction time - it's instant.
That's the time Hugo needs for refreshing a single page. At the same time, that's the time Simplified Saaze needs to rebuild the entire 1,000 pages.