...so, I joined the time-complexity cult.

...so, I joined the time-complexity cult.

I went through what most of the software engineers go through, choose between saving either space or time ๐Ÿ”ซ

ยท

4 min read

Play this article

Continuing the last post, this time I wanna go over my strategy. As the title highlights, I decided to go for time-complexity optimizations. Every software project at some point hafta make a decision when they wanna optimize their code. Often, software projects don't abide by the ...

2 birds, 1 stone

...principle. It's either Space or Time decision. You can't have both most of the time. Analyzing my case, space wasn't a problem. Because our "shared hosting" constraint had unlimited space but limited computing power. Thus-

Read along to find out how I am about to light it up, what about dynamic contents like comments and user authentication, etc...

How to save time?

Static generation to the rescue.

I know, I know, not that of a revolutionary. But, I have no other way. So I want to statically generate all the pages that the site requires ahead of time, wasting some time, to save some time. So, I decided to look for ways of doing it. It turns out there are many solutions, e.g.

  • Gatsby

  • Nunjucks

  • Jinja

  • Pug

But each didn't ring any bell.

template languagewhy not
Gatsbypowered by React, that's the root cause anyway ๐Ÿคฆโ€โ™‚๏ธ
Nunjucksexecution at runtime, just like react, interferes with animations ๐Ÿ˜ข
jinjacouldn't figure out how to integrate, something for the next major version iteration
pugseparate templating syntax, adds overhead for later-maintainers

So, yeah, there are a lot, but they borrow from these and that's a no GO! Hence,

Build a template engine from scratch


Another template engine ๐Ÿค”

Even though I could have gone with already available stuff, I don't wanna stumble again along the road just like I did in past years. Experiences Hurt ๐Ÿฅบ. So, I made up my mind to build a custom templating engine just for SPC's website. Now, have to think of how ๐Ÿคทโ€โ™‚๏ธ and what it should do.

Here are my problems:

  1. Complex templates to manually edit for each page required, e.g. factory index.html had like 230 tags excluding the head tag, just the body ๐Ÿคฏ

  2. Later maintainers might be hauted by all the mess, hence suiciding themselves โ˜ 

  3. If done manually, each blog post requires the writer to edit 15 tags, arrange photos, uploading to the server which the writer could spend writing and making ๐Ÿ† posts


So, my template engine should

  1. Compile the pages given and the writer's working area should be suitable for them

  2. Extract common structures

  3. Loops

  4. Evaluate variables

And some bonuses like,

  1. Conditional Compilation

  2. I dunno, Ideas will come ๐Ÿ˜


And, writers should be able to work GUI. With these in mind here's what I want to do.

  1. Writers use Rich-Text Editors which can output html form text.

  2. The output text is stored in a datastore

  3. I prebuilt build a script that would run the template engine according to a recipe

  4. Recipe say how to parse templates that may contain includes, vars etc.

  5. Vars will be mapped from a provided datastore

  6. Parsed templates will be organized abidding the recipe


So now writers deal with GUI then a double-click on the script(thinking of .bat) that will generate the site. Then, another build will run (s)ftp solution on the out dir and sync the server.


What about Miscellaneous stuff?

Images and other assets

One thing that our site is rich in is assets of photos. It's photos everywhere. My first plan was to host an S3 bucket with django. That poof. Then when I decided for nextjs I opted for Vercel's Image CDN which comes with Image Optimization. You know what happened! (If not then read the previous blog, When Django nextjs and Laravel failed me). Then with Laravel, I was gonna go with the local shared hosting, but the server was busy interpreting the post-request-stuffs, not responding for assets download for a while.

But this time around, I decided to go with a separate CDN service. Not just separate, but free of cost and with unlimited storage. Along with mimic-Vercel Image Optimizations. I will go over this in upcoming posts. That also optimized for time, not space ๐Ÿ˜ณ

Build time

Static generation saves some time by doing work ahead of time. This is one drawback I see. We can borrow Incremental Compilation. Thought to later, Birnadin ๐Ÿ˜Ž.

Dynamic bits of the site

Now that we are static, we can't utilize any dynamic behavior that might personalize the site for users. Our website has comments and an account feature. These sure require some server interaction in real-time. I am thinking about pseudo-react like operation. I dunno right now, but I will figure it out. If you have any suggestions please leave a comment publicly or privately. Open to ideas.


Epilogue

That's it for today. Till next time, it's me the BE signing off. ๐Ÿ‘‹

Cover Background by Philippe Donn and Einstein's image from Wikitext API

ย