...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 🔫
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.
But each didn't ring any bell.
|powered by React, that's the root cause anyway 🤦♂️
|execution at runtime, just like react, interferes with animations 😢
|couldn't figure out how to integrate, something for the next major version iteration
|separate 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:
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 🤯
Later maintainers might be hauted by all the mess, hence suiciding themselves ☠
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
Compile the pages given and the writer's working area should be suitable for them
Extract common structures
And some bonuses like,
I dunno, Ideas will come 😁
And, writers should be able to work GUI. With these in mind here's what I want to do.
Writers use Rich-Text Editors which can output html form text.
The output text is stored in a datastore
I prebuilt build a script that would run the template engine according to a
Recipesay how to parse templates that may contain
Vars will be mapped from a provided datastore
Parsed templates will be organized abidding the
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 😳
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.
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