Bytes #93 - Welcome to the 1st annual OSScars

Hope everyone enjoyed the Oscars last night (watching one twitter clip over and over doesn’t count).

But we’ve got something much better for you today (better than the Oscars, not the twitter clip). So buckle up, and welcome to a very special issue, #93.

Guillermo holding an OSScar

“This award is the #1 highlight of my professional career.”

The OSScars — Part 1

Welcome to the 1st annual OSScars — a very real awards show (that we made up) for giving very real awards (also made up) to a few VC-backed OSS startups.

Unlike the real Oscars, I’m a physically safe distance away from any of the nominees tonight. Turns out, that’s a feature - not a bug.

And the OSScar goes to…

Best Performance — Astro. The static site generator of the future raised $7m back in January, and its “more HTML, less JavaScript” approach, super fast Go/WASM compiler, and new build engine (powered by Vite) helped make it a lock for best performance.

Best Picture — Replit. Paul Graham’s favorite ~~child~~ investment is the story of immigrant founders who bet their futures on an idea that no one believed in, even turning down tres commas to bring their vision of cheap compute for everyone into reality.

Best Adapted Screenplay — Remix. In this case, the screenplay they’re adapting is Vercel’s turn-a-popular-React-framework-into-a-devtool-that-makes-money. It’s too early to say exactly how successful this strategy will be, but the critic’s reviews are starting to pour in and it looks promising.

Best Supporting Role — Rome Tools. They raised $4.5m last year in order to build an all-in-one tool that’s “designed to replace Babel, ESLint, webpack, Prettier, Jest, and others.” So far, all they’ve got is a Rust version of Prettier — but if they can achieve their vision, this one’s a lock.

*Generic orchestra music starts playing*

“We’ll be right back with the rest of the 1st annual OSScars after this quick word from our sponsor.”

Retool

Just ship it [sponsored]

We finally used Retool. And it’s better than we thought.

Story time: A month ago, we decided it was time to start paying attention to a few stats — like how many new people subscribed to Bytes, how they found us, etc.

So we spent a few hours ~~arguing about~~ discussing what data we wanted, how to get that data, how to display it — and the whole process was taking forever. And when someone mentioned that we “might want to set up a SQL database for tracking analytics,” I knew we’d gone off the rails.

But then I remembered Retool.

We signed up for a free trial — and it took me literally one afternoon to connect to all of our third-party data sources and to set up all the charts, tables, and graphs we could ever want by myself.

It’s easily saved us 30+ hours of engineering time. And since our free trial is about to run out, we’re actually going to (gulp) start paying for it. (Truly the highest praise I can give.)

Thankfully, startups can apply to receive one year for free — so we’ll try that out first.

If you’re interested, check it out.

Will Smith meme

Remix when we mention their business plan

The OSScars — Part 2

Best Director — Guillermo Rauch (Vercel). He’s used his big-movie budget of over $313m to put together an Avengers level supporting cast of OSS. He’s also great on screen when he’s seducing us from his kitchen/living room/office into buying cloud hosting during Next.js Conf.

Best Animated Feature — Framer. Starring Matthew Perry (we all know the OSScars are a big step up from the Primetime Emmy’s he was winning with Friends), Framer actually delivered on the bold claim that their “animations work like magic.”

Best Original Story — Deno. The story of one man whose creation grows more popular and influential than he ever dreamed. But over time that success becomes stifling — he sees the flaws in his creation, but it’s too late to fix them. So what does he do? What any capitalist would. He makes the heart wrenching decision to leave his home, raise $5m, rearrange a few letters, and create a new runtime from scratch — Deno. Classic hero’s journey.

Best Documentary Feature — Apollo GraphQL. Everyone loves good documentation, and Apollo channeled their inner Ken Burns to create docs that are well organized, easy to navigate, and perfectly detailed (not too much or too little). They just need to add that sweet CMD + k interaction, and they’ll officially be the 🐐.

Lifetime Achievement Award — Firebase. As we come to the close of tonight’s show, we want to salute one of the pioneers of VC-backed OSS (cue montage sequence). Firebase started back in 2011, raised $7m total, and got acquired by Google 3 years later. You can rest now, old sport.

Bottom Line: Some of these companies are already making fat stacks of cash. But once the rest of them realize that they technically have to make money at some point too, just think about how many more hosting platforms we’ll have to choose from!

🔬 Spot the Bug — Sponsored by Stream

Passwordless app authentication is the future. And this tutorial shows you how to easily integrate magic links using Stream & Supabase.

OK this one’s not a bug, but why does this code work?

const friends = ['Alex', 'Ben', 'Mikenzi']
friends.hasOwnProperty('push') // false

Specifically, why does friends.hasOwnProperty('push') work even though friends doesn’t have a hasOwnProperty property and neither does Array.prototype?

Cool Bits

It didn’t get nominated for an Oscar, but you can’t convince me The Story of Next.js isn’t at least as good as West Side Story.
The folks behind FusionAuth wrote a guide on how they use OAuth in the real world. It covers topics like the eight common OAuth modes, how to use the Authorization Code grant, and why you should never use the implicit grant. [sponsored]
MDN just launched MDN Plus — a “premium” version of MDN that lets you do nothing you’d actually ever care about doing on MDN - for $5 a month.
Alex Ewerlöf wrote about his guiding principles after 20 years of programming. It inspired me to start writing my own guiding principles after 10+ years of programming — but then I realized that I only had one, and Wu-Tang already wrote about it.
(Pull the) Leva, (Kronk!) is a React-first components GUI created by Poimandres (the folks behind react-spring, zustand, and react-three-fiber).
Andrew Schmelyun wrote about how he built a physical receipt printer for GitHub issues — and subsequently defined a whole new genre of masochism.
dum is an npm scripts runner written in Rust, whose name was inspired by this warm-up song for choir singers. Funny enough, that’s the same song that welcomes you into Dante’s seventh circle of hell.
Slint is a toolkit for creating fluid GUIs for any display using JavaScript, C++, or Rust. It also sounds like an inappropriate phrase that Draco Malfoy would use to mock someone who was poorer/less intelligent/worse at quidditch than him.

🔬 Spot the Bug Solution — Sponsored by Stream

Why does this code work?

const friends = ['Alex', 'Ben', 'Mikenzi']
friends.hasOwnProperty('push') // false

As mentioned earlier, if you look at Array.prototype, it doesn’t have a hasOwnProperty method. How then, does the friends array have access to hasOwnProperty?

The reason is because the Array class extends the Object class. So when the JavaScript interpreter sees that friends doesn’t have a hasOwnProperty property, it checks if Array.prototype does. When Array.prototype doesn’t, it checks if Object.prototype does, it does, then it invokes it.

const friends = ['Alex', 'Ben', 'Mikenzi']

console.log(Object.prototype)
/*
   constructor: ƒ Object()
   hasOwnProperty: ƒ hasOwnProperty()
   isPrototypeOf: ƒ isPrototypeOf()
   propertyIsEnumerable: ƒ propertyIsEnumerable()
   toLocaleString: ƒ toLocaleString()
   toString: ƒ toString()
   valueOf: ƒ valueOf()
*/

friends instanceof Array // true
friends instanceof Object // true

friends.hasOwnProperty('push') // false