To keep on top of this process, I have created a permanent page to record everything - Review the notes so far.
This post is part of a series where you can follow along as I redesign the blog and my IndieWeb Server.
In the earlier post I reassessed what I wanted to do with this blog. I re-evaluated and revisited my intentions and set up what I was aiming for.
Now it is time to take stock of what I have built.
It is fair to say that I built on impulse to scratch itches on functionality that I wanted to use, but there was not a grand plan. The more I work on Mastr Cntrl the more I trip over the same errors repeatedly or run in to problems I never got around to solving. I forget why I made important decisions and spend hours retracing my steps to understand my decision path.
I want to look again at my current architecture through the lens of what was decided in the previous post.
Let’s start with the easiest part of the architecture, the static website.
Jekyll
This website is built on Jekyll. I favour a static site generator for blogging, but Jekyll itself was always a compromise. I am not a fan of Ruby and it was the best (at the time) for building a static site generator, but it is slow by modern standards and inflexible.
Ideally, I would like to use something built on JavaScript, so I am not switching between languages on the Website and when I work on Mastr Cntrl. Eleventy seems like the smart option to move towards. It supports posts in markdown, so I will not have to do a heavy post conversion exercise (that sounds like hell). I need to investigate this further and make sure I can keep my link structures and other data, so nothing is lost in the move. For the time being, I will assume Eleventy can meet my needs and set some time aside to build a proof of concept. I do not have thousands of posts, but similarly it is still a big job to shift platforms and keep historic content. It would be prudent to investigate this first.
I do some slight bending of the Jekyll structure to accommodate Webmentions by storing them in JSON and treating them as data. This is done so I can keep each Webmention separate and keep each Webmention Git history. Which will be helpful later when it comes to supporting removing and updating Webmentions. I do some “fun jumps” in the template to ensure I match the right Webmentions to the right posts. This excessive logic is needed to get around Jekyll’s inflexibility and increases the build time. I would look for an Eleventy solution that does not need this messy code.
Syndication
To manage content being syndicated out to other providers, such as Twitter. I generate some custom XML feeds at build time and point Zapier at them, unfortunately I didn’t have much success getting Zapier to read JSON feeds which is what I use for everything else. I could get smart and plug Mastr Cntrl straight in to Twitter but I can’t see how the pain would be worth the effort, so for now I will assume this functionality will remain. I will review it when I look holistically at the whole system architecture. It would be nice to get rid of the extraneous XML if I could.
Syndicating to IndieNews requires a manual overhead for me to submit the article. I would like to automate this.
I need to take a look at the RSS feeds and the data they output. Situations like this seem avoidable:
I think we can do without a massive face on each RSS post.
External Content
I pull in map images from Mapbox to generate checkin locations. They look nice, but there is a performance penalty as the page goes to get the images when it is loaded. I would like to see if I can minimise this.
Creating avatars from replies and conversation on blog posts is also a page load hog. I don’t have a high traffic blog but even I can notice it once a few replies appear. So I need to investigate better ways of caching or progressively loading this content. Especially since it is only of interest if you want to read or interact with it. But hiding it away could also reduce engagement so I need to think carefully about this one.
Netlify
I host the static website on Netlify (which is awesome). I am going to set some time aside to review my integration with Netlify and in particular using the new Dev functionality in a separate blog post.
Future Integrations
There are a number of further integrations I haven’t completed that need to get added to the jobs list. Primarily music and media integration. Music in particular is a huge part of my life which is completly lost on the blog and I want to bring this in more through the redesign.
Design
These points aside I am happy with the current technical way the static site works. The UI & UX on the other hand is not right at all. I mentioned in my previous post that certain content is getting hidden and other content dominating which was not the original intent. I am going to set some time aside to review the design and user experience as a separate exercise in a future post once I’ve finished all my prep work.
What I learned
- I am happy in general with the technical way the static website works.
- I need to re-examine the technology it is built upon, Eleventy looks to be the favoured platform to switch.
- Build time needs to be reduced it is creeping up and taking too long.
- I have some custom areas of my Jekyll build that need to be documented and ascertained if I can get feature parity by it’s replacement.
Future Actions
- Explore Eleventy and build a POC to demonstrate I can migrate successfully.
- Revisit the design and UX of the current site. Explore this in detail to design a system that works for my needs.
- Investigate improving the quality of my RSS feeds and general syndication content.
- Investigate Avatar loading, caching and progressive loading techniques.
- Minimise external load content such as Mapbox images and Avatars.
- Set some time to review my Netlify integration and set-up. How can this be improved?
- Set some time to review future integrations and what I will be accommodating.
- Automate syndicating to IndieNews.
- Improve the quality of the Zapier templates consuming and syndicating my feeds.