The Best LiveJournal and Google+ Backups

With Google+ going away, I made backups of both my LiveJournal and my Google+ accounts. Here’s why I love the backups:

User Experience

• They’re super fast. Just static HTML5 (except for the search functionality), no frameworks, no libraries.
• You can navigate from the keyboard. Either the arrow keys, gaming WASD keys, or Vim’s HJKL keys. Whatever you like. Go left and right to navigate HTML pages, up and down to navigate posts within pages.
• They’re mobile-responsive. They use CSS grid to make the main column featured and readable regardless of screen width. On a touch device, you single-finger swipe left and right to navigate pages.
• No GRDP cookie warning overlay. No cookies! The backups don’t care who you are.
• Secure. The backups do care that nobody can snoop the contents of your visit. So they’re HTTPS.
• No overlays at all. No time-delay “sign in to my email list” overlays, no navigation-event “before you leave” overlays. My backups respect your focus and choices.
• No autoplay ads. No ads at all. My backups aren’t trying to sell you anything. They’re nothing but content.
• They each hint at the style of the original journal. Same types of article bylines, sidebars, and theme style. Nostalgic.

It’s even better than that. The up and down navigation within pages tries to account for where you’ve scrolled, and figure out where the previous and next posts would be, relative to the current viewport. Navigating down to an older post that’s not on the current page loads the correct page and shows that older post. Navigating up to a newer post that’s not on the current page, loads the new one and automatically scrolls to the bottom to show that newer post.

Archiving Tips and Experiences

The era of LiveJournal, where we wrote long-form thought pieces and our friends wrote longer replies back was a deeper interaction than what we experience with current social networks. These backups are just for me, but I really do love remembering protips like:

• Why are you so dumb? Here’s what to do to remember everything you learn.

And sometimes I want to be reminded of unique moments in my life, like that time I had a very vivid dream of a six-limbed bat.

Continuing Education and Custom Solutions

Having written the archives, it was rewarding to come up with solutions to the workflows I would care about. For example, I didn’t want a calendar in the sidebar, there’s not enough posts for most months. But I do want to be able to search by date. So if I search for “2007–10”, I get search results by post date, in reverse chronological order.

That’s intentional. I sort search results by search-results-rank, then for all the equal ranks, by reverse chronological order. It’s handy that ISO-8601 date formats sort lexicographically.

usort($results, function ($a, $b) {
    if ($a['count'] == $b['count']) { 
        return strcmp($b['date'], $a['date']);
    }
    return $b['count'] — $a['count'];
 });

While the backups don’t look like anything much at all, they’re the result of dozens of small tasks.

Here’s a screen capture of some of my Workflowy (WorkFlowy referral link) tasks while I worked on the ports.

My journal backups may or may not objectively be the best, but they are the best for the intended customer. Me!