Links and Notes - April 6th 2021

Working on the content grabber for GTD

After yesterday's post regarding managing my content consumption using GTD, I've begun making explorations into how I can actually do this. This is likely going to be the first project I start working on once I finish reworking the projects page slightly.

Today however, I wrote a Javascript snippet to do this for me. Note that the linkToFind should be replaced:

linkToFind = "https://www.youtube.com/watch?v=LyfnoEa-P58"
formattedLinkToFind = linkToFind.replace("https://www.youtube.com", "");
links = document.getElementsByTagName('a')
title = "";
length = "";
maker = "";
today = new Date();
month = (today.getMonth()+1).toString().length==1 ? `0${today.getMonth()+1}`: `${today.getMonth()+1}`
day = today.getDate().toString().length==1 ? `0${today.getDate()}`: `${today.getDate()}`
for (i=0; i<links.length; i++) {
  if (links[i].getAttribute('href') && links[i].getAttribute('href') == formattedLinkToFind) {
    console.log(links[i]);
    console.log(i)
    if (links[i].className == "yt-simple-endpoint style-scope ytd-grid-video-renderer") {
      title = links[i].title;
      maker = links[i].parentElement.parentElement.getElementsByClassName('yt-simple-endpoint style-scope yt-formatted-string')[0].innerText
    } else if (links[i].className == "yt-simple-endpoint inline-block style-scope ytd-thumbnail") {
      length = links[i].getElementsByClassName('style-scope ytd-thumbnail-overlay-time-status-renderer')[1].getAttribute('aria-label')
    }
    if (title && length){
      break;
     }
  }
}

console.log(`- [ ] [${title} by ${maker}](${linkToFind}) (${length}) | Added on ${today.getFullYear()}-${month}-${day}`);

The above will give me:

It's a very inefficient piece of code that selects all the a (links) elements and searches for the one that matches the link I'm trying to copy. The idea is that as a browser extension, I will right click on the YouTube link to bring up the context menu. The context menu will have the option to generate a markdown style check element to insert into my GTD inbox.

In an ideal world, I might have opted to create an Obsidian plugin instead which would just need the YouTube video link pasted in, but for now I'll settle for some javascript hacking before progressing from there.

Separately, I also wrote a snippet to grab the reading time of a post that I'm planning on adding to my inbox. But that's far less reliable. Why can't people just follow the standard and put the main body content into article wherever they go!

article = ""
if(document.getElementsByTagName('article').length == 0){
  article = (document.body.innerText)
}
else {
  article = document.getElementsByTagName('article')[0].innerText
}
numberOfWords = article.split(' ').length
console.log(numberOfWords)
readingSpeed = 280
numberOfMinutes = (numberOfWords-(numberOfWords%readingSpeed))/readingSpeed
numberOfSeconds = parseInt((numberOfWords/readingSpeed-numberOfMinutes)*60)
console.log(`Reading time: ${numberOfMinutes} minutes and ${numberOfSeconds} seconds`)

This really works if the content is inside an article tag. If not, the results could be very wonky since I'm grabbing everything inside the body tag.

Watching Chess Masters on YouTube is great

Great doesn't quite cover what I want to say here. I feel like it's the power of the internet at its best. What a privilege it is to be able to watch any number of grand masters and international masters on YouTube, sharing their thoughts and strategies, FOR FREE! I only wish that every sport could have something similar where an expert adds a voice over or live conversation to a recording of their game. Most games aren't like chess so it would have to be a voice over of a recording but that doesn't take away the value of someone giving insight into how their mind works. It's also a great way to build a deeper understanding of the sport itself.

But I digress. Chess. Chess masters are great to watch on YouTube simply because of how clear they make the game seem. For many of us, if we were to play chess, it feels like there's this constant struggle to gain clarity. Coming up with plans and ideas without getting tunnel vision is extremely difficult. My 5 year old likes to try his hand at chess and even though he doesn't fully understand the game, I've still managed to leave my queen hanging, ripe for capture, several times. AND HE'S TAKEN IT!!!

Ahem.

But chess masters aren't like that. They play 10 minute games, casually discussing what their openings are, how they want to adjust on the fly. What's beautiful is that you can tell that they aren't overwhelmed with the entire board. Somewhere in their mind, bits and pieces have been wired in ways that helps them discard all the useless information. Think of it like driving. We don't try to account for every vehicle on the road. We just keep track of the ones who have the most potential to affect us. That's how chess masters seem to think about their game. The opponent moves, they make an assessment of "Ok, the opponent has now opened up options here and here. Is my idea still viable? If yes, let's execute it. If not, what can I do to defend against a threat". I think a lot of that also comes down to pattern matching; masters will often recognise a mate-in-N strategy the moment it opens up because it's so common. But outside of that, it just feels like that's how their brains have become wired.

And to end this, an example:

Economics of coding in a remote machine or a browser

I've been interested in the code server project for a while now. Basically, it lets you host a full featured VS Code instance on a server that can then be accessed via a browser. This is very different from Microsoft's Monaco editor which is just the editor part of VS Code; Monaco doesn't carry plugin functionality or anything else.

What's cool about this is that the code-server instance can access the files local to the server — at least, this is what I assume. Which means that if I host it on a server in the cloud, then I can also make that cloud machine my computer. What does that mean for me then? Well, my need for a new laptop for coding might very well disappear.

But then again, this might be unnecessary. VS Code already comes with the ability to connect into a machine remotely and code as if you are on that machine. This includes being able to install plugins and run terminal commands from within the VS Code instance itself.

But whichever option I think of, one thing becomes clear. It's entirely possible to have a completely light weight machine that is used only to connect either my browser or my local VS Code instance to a server. All the code I have, everything runs directly on a server. But why do that? Economics!

I've put together a note in notecalc that demonstrates how this works, but basically, using Hetzner we can get a machine with the following specs:

  • 8 vcpu
  • 32gb ram
  • 240gb disk space

And it will cost us ~503 USD to run per year. To put that in context, Buffer's current recommended Macbook laptop costs 2400 USD to purchase (and that's in the US which is the cheapest). Which means that we could run the above Hetzner machine for 4.77 years before we spent the equivalent of a Macbook. Which is important because Buffer has a policy of allowing laptops to be replaced once every 3 years. If we were to drop down to more realistic specs that we need (4 cpu, 16gb ram) it would cost us 22 USD which means that we could run the machine for ~ 9 years before we'd spent the equivalent of a Macbook pro.

I don't think this idea is novel. But I haven't seen it discussed much outside of the scope of "setup your dev environment that can be easily destroyed too" kind of idea. Github Workspaces being a prime example.

I want to explore the idea of a permanent machine that's a replacement for the expensive laptop. I think numbers makes an experiment in having a fully cloud based development machine fully worth it. And you just know I'm going to try it :D.


This blog doesn't have a comment box. But I'd love to hear any thoughts y'all might have. Send them to [email protected]

Previous links and notes (April 5th)

Next links and notes (April 7th)

Posted on April 06 2021 by Adnan Issadeen