This newsletter is my attempt to capture and share some of what I'm learning as I study AI, technology, and science. If you know someone nerdy enough to find it fun, please forward it along.
Adventures with Chrome Extensions
Seriously, Zach? Chrome Extensions? Welcome to 2014.
I hear you. But after spending the last few months playing with them, I think browser extensions might be one of the most underappreciated areas in software.
As I’ve been learning more about tech, there have been a handful of moments where I’ve had to sit back and think “Holy shit, I have super powers.” The first time running a program in the terminal, the first script that automated a real task, the first AI model that could actually make predictions, they all had an almost magical feeling.
It’s been a little while since I’ve felt that, but playing with Chrome Extensions brought it right back.
And, even more exciting, I genuinely think they have the power to transform the way we use the internet. But we’ll get to that in a minute.
First, a quick primer. Chrome Extensions are mini apps that can be installed directly in Chrome to edit your browsing experience (ie ad blockers, save to “read it later” apps, etc). You probably know them as the little buttons you see at the top right of your browser.
They always felt a little mystical to me. Where are they hosted? How do they know what to do? They obviously don’t work like normal apps, but as I learned more, I realized they are surprisingly simple.
Every Chrome Extension starts with a manifest file. This is like the table of contents, Chrome’s first stop to figure out what kind of app it is and which other files it should go to for which information.
This manifest file points to other Javascript, CSS, and HTML files. Chrome pulls those in based on the manifest’s direction to create the functionality for the app. You can use these languages to do anything you want, but the thing that has me most excited is the ability to listen for when a user visits a certain webpage, and inject code into that page to edit it in any way you’d like before they see it.
Once these files are ready, they can be packaged up and uploaded straight to Chrome. Whereas most apps require servers to host them (which takes some technical ability), Chrome Extensions can simply be uploaded as a folder with the right files in it and they are ready to use. Even when you download an extension from the Chrome Web Store, you’re just downloading these files and running them locally.
Google: Pink Edition
As a silly example, let’s say I wanted to make a cutting-edge Chrome Extension that turns the search button on Google pink.
Manifest: We need a manifest that includes the app name, version, and (most importantly) a “content_scripts” section. This is where we can turn on the ability to listen for a website (in this case, “https://www.google.com/”) and, when we land on it, inject a specific css file (we’ll call it “inject.css” because we’re creative).
Functionality: As we can see from the manifest, the only functionality we want will live in that “inject.css” file, which will be injected as soon as we go to Google’s homepage. But how do we make it actually edit the page?
We can go to Google, right click on the button we want to edit, and choose “Inspect”. This opens up Dev Tools, where we can find the HTML for the specific button and grab the name of the class. In this case, it’s “gNO89b”.
Then, in our “inject.css” file, we can simply create some css for that class with the styling “background: pink” and an !important flag to make it take priority over Google’s styling.
.gNO89b { background: pink !important; }
That’s our app: a manifest, and one file with one line. Let’s see it in action...
Installation: To install a Chrome Extension directly, you just go to Window > Extensions, click “Developer Mode” on the top right corner, and then “Load Unpacked”. Then, simply select the folder with the files you just created, and it’s installed.
Obviously, changing the color of the Google button isn’t that useful. But with the same basic tools, we can start to do things that are much more powerful.
As an example, with the same pieces above, I was able to build a full UI for our PR team to update their Airtable CRM straight from Gmail — adding buttons into the Gmail interface, a full popup element for them to input data, and using Javascript to call the Airtable API to pull data and make the updates.
That last piece is where things get really fun. Because Javascript can “call out” to external APIs, you can truly have Chrome Extensions do almost anything.
You can think of an API as a black box with some special ability, waiting to be called upon. When you send them a trigger, they take some action and send you back a response.
For example, say you built an AI tool that takes in an article and responds with a score of how biased the article was. That AI is your black box, and it can exist on a server somewhere, waiting to be called. Then, every time a user visits an article, your Chrome Extension can simply call on that API with the text from the article, wait for the score to be returned, and edit the page (say, highlighting it a certain color) according to the result.
I hope these examples are starting to give you a sense for the magic that’s possible.
Augmented Reality for the Internet
As I started to work more with Chrome Extensions, I realize they have a power that no other form of software does:
They can allow us to customize the internet to be exactly how we want it.
If you’re anything like me, you think of the internet as existing “out there.” When we use it, we are interacting with whatever somebody else created. And that’s mainly true. The vast majority of the time we spend online, we’re perceiving exactly what the developers on the other end intended. But what if it didn’t have to be that way?
As I’ve played around more with Chrome Extensions, I’ve started to appreciate that the internet is just sending back data. If I leave it alone, they’ve conveniently formatted it all in a way that my browser turns into a user friendly website. But if I don’t like it, I can take that data and customize it to suit my needs.
Think about walking out of your house on a bright sunny day. You squint as light hits your eye from the bright sky and all the reflective objects in your visual field. But you don’t try to lower the brightness of each of those things. You put on sunglasses, and they filter all those inputs right before they hit your eyes so that the world matches the brightness you want. You stop squinting.
I see the potential here similarly. If the right suite of tools exists, anyone should be able to take the internet and make it fit the speed, style, and structure that gives them the experience they want.
There are a number of Extensions that already do this:
Inbox When Ready formats Gmail so you can send emails and search without being exposed to your inbox.
Rescue Time allows you to block or limit the time you spend on certain sites.
Each of these apps is solving a specific problem. But, especially at a time when social media is leading to anxiety, self-image issues, and increased suicides, I think there’s room for a bigger movement in this space to really help people build the internet they want.
Cool Stuff
📖 The Demon in the Machine: A physicist tries to answer the question What is Life? What does it mean for something to be alive? How did life emerge from non-life? It’s mindbogglingly good, and he manages to jump from cellular automata to quantum physics to evolutionary theory to consciousness research without losing the thread.
🎵 Rejoice: I’ve been blasting this on my bike ride to work and I get to the office insanely fired up.
💩 Tushy: My wife got this for me last Christmas. I don’t want to go into too much detail but… just get one. I can’t believe I ever lived without it.
📺 AlphaFold: A fun 8 minute video about DeepMind’s effort to solve protein folding with AI (one of the biggest scientific breakthroughs last year). I also loved AlphaGo, a full-length documentary on the same team’s journey to beat the world champion Go player.
###
Thanks for reading. If this sparked any ideas you want to riff on, hit reply and let me know!
Until next month, Zach
PS If you’re reading this in the browser and want it in your inbox next month, subscribe here:
I love it. As a lawyer, computer programming is such a mystery for me. Thanks for demystifying it a bit and inspiring me to (maybe) try some myself.