Welcome to the new blog engine

A few days ago, I re­leased the new ver­sion of the blog en­gine.

Orig­i­nal de­vel­op­ment of the blog en­gine start­ed in the be­gin­ning of 2014. Back then, I was pub­lish­ing my ar­ti­cles in a form of a sta­t­ic web­site. I was con­vinced that I need to move to some­thing more dy­nam­ic, but among the ex­ist­ing blog en­gines, none was nice enough for me to want to use it. So I came with a nat­ur­al idea of draft­ing my own blog en­gine, which I kept up­dat­ing on reg­u­lar ba­sis for five years.

In 2019, I de­cid­ed that it's time to make some rad­i­cal changes: I want­ed a bet­ter ex­pe­ri­ence for the read­ers, and I also want­ed to ex­plore an idea I had for some time in terms of the user ex­pe­ri­ence when it comes to edit­ing the ar­ti­cles. The big change didn't went well, and as a re­sult, the blog wasn't up­dat­ed for the fol­low­ing two years. But it's over now.

Changes for the read­ers

The new en­gine con­tains a lot of small changes in or­der for the ar­ti­cles to look ex­act­ly as I want any ar­ti­cle of any blog to look if I have to read it.

Fig­ure 1 The old lay­out.

Fig­ure 2 The new lay­out.

One of the changes is nat­u­ral­ly the choice for a new font. The old­er ver­sion was us­ing a pop­u­lar sans-serif font, which is great for ap­pli­ca­tions in gen­er­al—and I'm re­ly­ing on the same font in most of my web ap­pli­ca­tions—but when it comes to read­ing large chunks of text, noth­ing beats serif fonts. Serif fonts didn't per­form well ten years ago, with low-res­o­lu­tion screens. Things changed since then. Now, most vis­i­tors have dis­plays with an ex­cel­lent res­o­lu­tion, some ex­ceed­ing 300 ppi, and tech­nolo­gies such as Mi­crosoft's ClearType also help mak­ing sure the text is ren­dered per­fect­ly. Since I want­ed to pro­vide to the read­ers an ex­pe­ri­ence which would be close enough to read­ing a book, serif fonts ap­peared a good al­ter­na­tive, and among them, Spec­tral was look­ing ex­act­ly like what I ex­pect for a high-qual­i­ty book. Did you no­tice how nice is the ital­ic text?

An­oth­er no­tice­able change is the in­tro­duc­tion of hy­phen­ation. It re­lies both on the hy­phen li­brary, which de­ter­mines where a hy­phen may be used in a word, and on the sup­port by most browsers of text for­mat­ting with hy­phen­ation. The sup­port wasn't grant­ed two years ago, so I'm hap­py that it's all good now, as this is an im­por­tant en­hance­ment.

In terms of the page lay­out, the left pan­el list­ing the oth­er ar­ti­cles was re­moved. The use­ful links are now at the bot­tom of an ar­ti­cle. Since it frees the space on the sides of the ar­ti­cle, on large mon­i­tors, the text re­flows in two columns.

I kept in fo­cus that the ar­ti­cles should look nice on any de­vice, and es­pe­cial­ly when print­ed. This was al­ways my em­pha­sis, and it still is. If you print an ar­ti­cle, you get a nice, clean lay­out with noth­ing wast­ing the ink. If you view it on a small tablet or a smart­phone, all sec­ondary el­e­ments move away, en­sur­ing the ar­ti­cle it­self can use all the space.

Most blogs use syn­tax high­light­ing for code blocks:

const groupBy = (elements, key) => Object.fromEntries(elements.map(x => [x[key], x]));
const displayDate = value => moment(value).format('MMMM D, YYYY');
const isAuthorOf = (user, revision) => revision.authors.includes(user._id);

What oth­er blog en­gines don't do is to use syn­tax high­light­ing in­side the in­line snip­pets: const r = x.format('MMMM D, YYYY'); I'm con­vinced that this would en­hance even more the read­abil­i­ty of the small chunks of code that I put here and there in my ar­ti­cles.

One fun­ny thing which af­fect­ed a bunch of users was the lo­gin fea­ture. The pre­vi­ous blog en­gine has a “Lo­gin” link, the small text be­neath it telling “Au­thors & own­ers.” Some read­ers thought, how­ev­er, that once they lo­gin, they will be able to write com­ments, with­out know­ing that this fea­ture was nev­er avail­able. They logged in, and were dis­ap­point­ed. More wor­ri­some is the fact that their per­son­al in­for­ma­tion, the one pro­vid­ed by Google's OAuth 2, was stored in the data­base, but this was ab­solute­ly un­clear for the users, and they had no choice to re­move this in­for­ma­tion lat­er. The new en­gine re­designed the process. In­stead of be­ing logged in di­rect­ly, a new­com­er goes to a page ex­plain­ing what would hap­pen if he logs in, and what's the ex­act pur­pose of the thing. It be­longs to the user, then, to ei­ther ac­cept and con­tin­ue, or to come back to the orig­i­nal page. In the fu­ture, I'll also add a page which would list to a user all the in­for­ma­tion that the blog en­gine stores about him, and a page which would al­low to re­move all his per­son­al in­for­ma­tion.

Changes for the au­thors

The way I write the ar­ti­cles was rad­i­cal­ly re­designed. When writ­ing an ar­ti­cle, it is im­por­tant to see how the ar­ti­cle is shown to a read­er. As I write on a PC, I don't nec­es­sar­i­ly know whether the ar­ti­cle would look cor­rect­ly or not at the mo­ment of writ­ing. If I want to dou­ble-check on my smart­phone, I have to ei­ther pub­lish it first, or save a draft, lo­gin from my smart­phone, and then go edit the ar­ti­cle in or­der for it to gen­er­ate a pre­view. Even worse, when typ­ing an ar­ti­cle, the pre­views were gen­er­at­ed on the front-end, and there is al­ways a risk of hav­ing small dis­crep­an­cies creep­ing in.

With the new ver­sion, any change to an ar­ti­cle is re­flect­ed au­to­mat­i­cal­ly on any de­vice. Every time I type some­thing, I see the change live, would it be on the same PC in a dif­fer­ent brows­er win­dow, or on a dif­fer­ent de­vice. The ren­der­ing is now per­formed by the serv­er, mean­ing that there are no dis­crep­an­cies pos­si­ble.

One ma­jor flaw of the pre­vi­ous blog en­gine was that if I closed the brows­er win­dow with­out sav­ing the changes, those changes would have been lost. Al­though I nev­er lost any change this way, the risk was still there. With the new blog en­gine, there is no risk of los­ing the changes any longer: I can close the win­dow, and re­open it to find the ar­ti­cle in the ex­act same state I left it.

As an ad­min­is­tra­tor, I also get more ac­tions on oth­er users. One of the weird things in the pre­vi­ous blog en­gine was that any­one who logs in could write an ar­ti­cle. I would have liked to say that this is not a bug, but a fea­ture, but the fact is, I didn't think at all about this as­pect when cre­at­ing the orig­i­nal en­gine, and was sur­prised to dis­cov­er one day an ar­ti­cle writ­ten by a per­son I don't know per­son­al­ly. With the new en­gine, this is not pos­si­ble any longer: while any­one can reg­is­ter, only an ad­min­is­tra­tor can grant au­thor per­mis­sions to a user.