Visual Tabs
Visual tabs was my exploration into creating Chrome extensions. I made the extension because I wanted to be able to browse through my tabs with thumbnails instead of hunting through the browser toolbar or using one of those other extension which open a tiny popup list. This functionality is part of the Safari browser as standard and also is a common feature of most graphical window managers as an overview mode for browsing through windows. There are different browser usage patterns and having access to thumbnails is most suited to casual browsing where you may have multiple articles, videos, brand shopping websites open. It's useful for creatives who browse visual-rich content across the web as they can spatially navigate a grid of thumbnails with vivid previews of each tab. It isn't useful for other kinds of browsing like navigating government websites or some shitty corporation's jargon-laden technical documents.
With this extension I used Chrome and tapped into the browser's APIs. Development of the React side of things was fast but I had to invent a messaging system between the browser tab page and the script running independent of the page which had access to the APIs. This was fine and I was pleasantly surprised how performant the extension was where it would go fetch screenshots and then save them using browser storage. Upon clicking the extension's icon the thumbnail screen would fade in over the current site with all of the thumbnails. The speed that the thumbnails would show was faster and smoother than the equivalent functionality in the Safari browser. The thumbnails themselves could not be taken by the browser because the feature was removed from Chrome's browser API. So I had to make a server-less function hosted on AWS to take a screenshot which used a build of Chromium. The downside was that the function did not have the user's browsing session or data so it could only take screenshots of public pages. Fortunately the functions were extremely fast and ridiculously cheap, so they could reliably take more screenshots of pages than the user's own computer could do if it were possible. The fetching of screenshots was all done asynchronously and so upon opening the tab view all of the tabs would already have their screenshots. The functions would scale the screenshots down to thumbnail size before sending them back.
Even though it was cool to create I found that ultimately it was a massive pain to work on. From creating the Chrome manifest to writing a bulletproof privacy policy it was just a hassle with outdated information online from Chrome themselves and even worse from the wider community. Writing the privacy policy is what soured the experience. It failed multiple reviews and passed right before my "third strike". This is the problem when you are forced onto someone else's platform. Since I have gone through the pain of doing it all once I can now redo it without much of the hassle. It's safe as only the page URLs are sent to the remotely executed function, but I would rather it be fully client-side. Our wings are always clipped because of bad actors. Thanks for the good ones.