We linked to Fathy a few months back when he forked Chrome to turn HTML into SVG, but this time he’s really outdone himself by making it render to the terminal. What resulted is the Carbonyl web browser.

Thomas Steiner (Web Developer Advocate at Google) joins Amal & Nick to talk about Project Fugu – an effort to close gaps in the web’s capabilities enabling new classes of applications to run on the web.

Fathy Boundjadj new html2svg project is pretty cool. We’ve seen a lot of efforts to convert HTML to raster images like PNG and JPG, but SVG is a different (pixel-independent) story.

This end product took some engineering, and the linked post goes deep into all the steps Fathy had to take along the way. From taking the picture to rendering to SVG to supporting shadows and more.

It’s like having Alfred all up in your browser.

Manage tabs, bookmarks, your browser history, perform all sorts of actions with a simple command interface.

ICYMI. (I miss it. Do you miss it?)

Bozhidar Batsov on the sad state of Chrome’s web rendering hegemony:

We’ve gotten to the point that Chrome-based browsers are so common that developers just stopped to bother supporting other browsers… Soon Google are going to be in complete control of web standards, unless something drastically changes. Do you want the future of browsing to lie solely in the hands of the biggest advertising business on Earth? I’m pretty sure that I don’t.

I was clueless how big and competitive a marketplace Chrome extensions are until Oleg Anashkin decided to document all of the proposals he’s received over the years to monetize Hover Zoom+. His reasoning:

The main reason I continue to maintain this extension is because I can hardly trust others to not fall for one of these offers. I’m fortunate to have a job that pays well enough to allow me to keep my moral compass and ignore all of these propositions. I realize that not everyone has the same financial security so hopefully this thread would shed some light on what kind of pressure is put on extension developers.

There were too many for me to read them all, but I scanned and they range everywhere from completely scammy/ridiculous to potentially legit and tempting. Take this one, for instance, from May 27, 2020:

We monetize search traffic. Your extension is great for this and i would like to see you among our partners.

Here is a little information about how much money you can earn working with us.

Your audience is 300,000 users
On average, 1 person makes 1 search query per day.
For 1 thousand searches on average you will receive $ 30 per day.
Your real profit per day will be $ 9000.

What is necessary for this? 8 lines of code in the manifest of your extension.

I will be glad to see you among our partners.

$9k a day just for adding 8 little lines of code sure does sound nice. But the devil, of course, is in the details of what those 8 lines actually do. Is it worth betraying your users’ trust so someone can “monetize their search traffic” in order to to cash in? Turns out that’s the kind of decision that many successful Chrome extension developers have to make on a recurring basis.

ClearURLs is an add-on based on the new WebExtensions technology and is optimized for Firefox and Chrome based browsers.

This extension will automatically remove tracking elements from URLs to help protect your privacy when browse through the Internet, which is regularly updated by us and can be found here.

The EFF launched a new site you can use to see if your Chrome install is one that Google is testing FLoC on.

Google is running a Chrome “origin trial” to test out an experimental new tracking feature called Federated Learning of Cohorts (aka “FLoC”). According to Google, the trial currently affects 0.5% of users in selected regions, including Australia, Brazil, Canada, India, Indonesia, Japan, Mexico, New Zealand, the Philippines, and the United States.

They also do a nice job describing exactly what FLoC is and what it might mean regarding your privacy online.

Marcel Klehr:

Remember Xmarks? It was great. Floccus does the same thing and even allows you to sync with whatever server you want: any Google Drive, any Nextcloud, any WebDAV server. With more backends in the works.

Floccus has extensions for Chrome (and its derivatives), Firefox, and Edge browsers.

A Chrome and Firefox extension that mounts your browser tabs as a filesystem on your computer.

This gives you a ton of power, because now you can apply all the existing tools on your computer that already know how to deal with files – terminal commands, scripting languages, point-and-click explorers, etc – and use them to control and communicate with your browser.

Now you don’t need to code up a browser extension from scratch every time you want to do anything. You can write a script that talks to your browser in, like, a melange of Python and bash, and you can save it as a single ordinary file that you can run whenever, and it’s no different from scripting any other part of your computer.

Screenity is a Chrome extension that will help you level up your screen recording/sharing game. How does it compare with other offerings in this category? Here’s a google sheet with the feature breakdown.

If you’re new to DevTools, this is a must-read. If you’re an old pro, you might still learn a thing or two. Like did you know they have multi-cursor support?! DevTools are slowly turning into a full-in development environment…

Headless recorder is a Chrome extension that records your browser interactions and generates a Puppeteer or Playwright script. Install it from the Chrome Webstore. Don’t forget to check out our sister project theheadless.dev, the open source knowledge base for Puppeteer and Playwright.

You may have heard of this when it was called Puppeteer Recorder, but its recent addition of Playwright support warranted a rename.

Addy Osmani:

Native lazy-loading for images landed in Chrome 76 via the loading attribute and later came to Firefox. We are happy to share that native lazy-loading for iframes is now standardized and is also supported in Chrome and Chromium-based browsers.

<iframe src="https://changelog.com" loading="lazy" width="600" height="400"></iframe>

YaS!! Lazy load all the things 💚

Use it in your site by importing the CSS from unpkg and adding the placeholdify class somewhere. Also comes as a Chrome extension.

I used to be the guy with dozens of Chrome extensions. These days I limit my use of both (Google Chrome and browser plugins). Performance and reliability are features I desire more than what most plugins have on offer.

That being said, if you have a lot of extensions and you’re curious which ones might be bogging down your machine’s resources, this is a great analysis of the top 1000.

Google recently announced their Web Vitals initiative which seeks to condense and simplify what devs need to know to optimize our sites.

Linked is an accompanying (alpha-grade) Chrome extension that measures the 3 Core Web Vitals and displays your scores at the click of a button.

The main differences with existing extensions are: multiple selections, keyboard layout agnostic, SOV (subject–object–verb) constructs and simple interaction with external programs. It is also quite usable with the mouse.

Demo videos are (temporarily?) unavailable, but there’s a fun tutorial that achieves a bunch of tasks on pokemon.com. Inspired by Kakoune.

A fully private memory-boosting extension to eliminate time spent bookmarking, retracing steps to recall an old webpage, or copy-pasting notes into scattered documents. Its name and functionalities are heavily inspired by Vannevar Bush’s vision of a Memex.

“Memex” is thought by some to be a portmanteau of “memory” and “index”. Makes sense to me.

A collective effort by browser makers (Microsoft, Mozilla, and Google) to understand where the dev community would like them to invest their energy.

We started this project to collect your feedback about the current state of the web and to give you a voice to help shape what the future of web.

They’re taking this effort on the road to various conferences, but there’s also a non-geographically-constrained way of sounding off as well: you can fill out the form on the website. 😄

I know I’m not the only one who gets super annoyed by content jumping around while I’m reading it - and I’d never intentionally create that experience for my users. But sometimes you just don’t know how your code behaves “in the wild”, and you can’t exactly ride-along with every user. The Layout Instability API aims to address this issue:

How a site functions in development is often quite different from how users experience it in production: personalized or third-party content often doesn’t behave the same in development as it does in production, test images are often already in the developer’s browser cache, and API calls that run locally are often so fast that the delay isn’t noticeable.

The first step toward properly solving this problem is to give developers the tools to measure it and understand how often it’s occurring for real users. The Layout Instability API, currently being incubated in the WICG, aims to address this.

OctoLinker is a Chrome extension that turns language-specific statements like include, require, import, etc. in to clickable links. Try before you buy install with their in-browser demo.

Welcome to HSBC, the world’s seventh-largest bank! Of course, the page you’re reading isn’t actually hosted on hsbc.com; it’s hosted on jameshfisher.com. But when you visit this page on Chrome for mobile and scroll a little way, the page is able to display itself as hsbc.com - and worse, the page is able to jail you in this fake browser!

Scary stuff since there is no known protection against this attack. It seems to be up to the Chrome team to figure out a solution.

Love it or hate it, the march of AMP drives on…now your pages can appear under your URL instead of the google.com/amp URL.

Today we are rolling out support in Google Search’s AMP web results (also known as “blue links”) to link to signed exchanges, an emerging new feature of the web enabled by the IETF web packaging specification. Signed exchanges enable displaying the publisher’s domain when content is instantly loaded via Google Search. This is available in browsers that support the necessary web platform feature—as of the time of writing, Google Chrome—and availability will expand to include other browsers as they gain support (e.g. the upcoming version of Microsoft Edge).