Beyond bookmarks

I often find myself reading noteworthy articles, akin to how Simon Willison's using text embeddings to relate his blog posts to one another and Justine Tunney's snappy Bash commands leveraging LLMs. These insightful articles either inspired me, taught me something new, or provoked a new frame of mind. I try to keep a tangible mental record of these sorts of articles. After all, brains do their own housekeeping, quietly deleting outdated information.

Efficiently inefficient

For years I have been manually taking notes as I read through articles. If I found the article worth remembering, I would reference the key parts in a note then file the note under a relevant topic. For instance, notes taken from an article on "Pytest best practices" would go under Python. Keeping notes organized like this was exhausting work. However, it was critical for searchability, particularly when I needed to recall the ideas again.

Inevitably, fractional notes started to form across my work computer, phone and laptop. It didn't help matters that I would infrequently glue the fragmented notes together, so most of the time, I would abandon orphaned notes altogether. I soon realized reading articles leisurely, without saving notes, was more productive as I could read more content in the same amount of time it took to write notes. The problem with that is that relying solely on long term memory isn't feasible.

There have been numerous articles I've pulled my hair out while scouring my browser's history attempting to locate an invaluable article. A good example of this was when I wanted a junior developer to have the same framing when writing tests as I had. I once read a series of articles by Kent C. Dodds on the fundamentals of React Testing Library which changed the way I write tests to this day. While Kent still has useful posts around the topic, I could no longer find the ones I had once revered. I suspect this is because the information has been moved into a testing course behind a paywall. This meant I couldn't rely on my browsing history.

Dipping into extensions

A sense of relief and excitement washed over me as I realized I could finally create a frictionless way to collect highlights across the web. This was possible because I had accrued an ecosystem of projects from a component system to a note taking system. These projects unlocked the ability to rapidly create my own browser extension-based bookmark manager. This bookmark manager could send slices of the web to my notes system via an API.

This tool can be found as Queso¹ — it's an open-source Chrome extension. Nowadays, when I'm browsing the web, I'll bookmark the articles I want to read later.

Beyond bookmarks

To help burn down articles I want to read, I have a job that generates a newsletter with articles I haven't read yet (totaling to 30 minutes of read time) and emails the newsletter to me daily. Each bookmark in the newsletter has a link to the article and a link to the bookmark in my notes system.

Queso is also built in a way that I can simultaneously read through an article and jot my musings in Chrome. After completing an article I can also mark that I have read it using Queso. The biggest time-saver came from automatically linking the web article's metadata. Queso pre-populates the article's URL, title, author, and generates estimated read time for every bookmark. As a start, Queso was a reading-based to-do list for unread content and a digital breadcrumb trail for the rest.

As I was dogfooding the app for a few months, I found that often I wanted to save quotes around the place. So I added a feature where on any webpage I highlight a portion of text, right click and Voilà!

The quote is now in the notes field and formatted as a markdown quote. Quotes work similarly to bookmarks, pre-populating the reference source's metadata with cited references to the URL and author. This feature will be particularly useful to embed quotes in my own blog posts!

Here's how that quote looks in my notes system:

Above and beyond

I had been using bookmarks and quotes for a couple of months when my digital hoarding kicked into overdrive. An itch to save the things I learned throughout the day needed to be scratched. Some might think this is a time sink. But as a software engineer, in the midst of an AI boom, I learn a plethora of new things regularly. Besides, bookmarking the things a one learns throughout time isn't novel. In fact, this is commonly known as a Today I Learned (TIL) list. Some developers have chosen to keep their own TIL as repositories on GitHub. My TIL would function similarly, but live in the same place as my bookmarks.

Adding support for TIL was straightforward, as it functions similarly to quotes and bookmarks. It was helpful that my notes system stores notes in Markdown, so when there are parts of code I find inspirational I can save code inside code blocks. Here's a TIL entry from when I learned about JSON-LD . Its tagged with SEO so I can quickly reference it next time I'm setting up a new marketing site.

An internet swiss knife

I've recently added support for Queso to take a snapshot of an article's written content when a bookmark is added. The snapshot takes the article's HTML content, pops it into Markdown format, and is uploaded with each bookmark. Thus preventing articles lost to link rot. So preserves not only my notes on the subject, but also the cited source's content!

Here's a demonstration of the snapshot feature in action using an article I wrote. The article contains relatively complex page elements for a blog, such as code blocks and tables. In one click with Queso I have now cached the article content and in a consecutive click I have uploaded it to my PKMS.

Preserving the article's content doesn't only prevent against data loss. It unlocks a heap of benefits such as the ability to read articles offline. Another benefit that may not be obvious is auto-linking related content using text-embeddings. As these links accrue, a network of inter-connected content highways start to form. This would act similar to manual cross-linking notes using Obsidian's Backlinks.

An important distinction from links in Obsidian is that regardless of when the note was made, it can easily be resurfaced when recent content intersects with old content. For example, 10 years ago you wrote about your Atkins diet, today you create a note about your new carnivore diet. The decade old Atkins diet note pops-up in relevancy and you revisit. This automated discoverability helps reinforce and compound knowledge over time.

Closing thoughts

There are plenty of options when it comes to retaining knowledge online. There are already several bookmark mangers that work for others. For me, Queso has drastically improved the way I retain web-based content, so I plan to keep using it for the foreseeable future.

For those interested in using Queso themselves, it's available for free on the Chrome web store. There are configurable settings so that it can be easily hooked up to upload bookmarks through an API. With services like Firebase, Supabase, or a DIY bookmark system can be set up quickly to start using Queso. Queso is also open-source for anyone interest in contributing to the project or repurposing the code.

---