How open source goes viral

Issue #301.June 27, 2024.2 Minute read.
Bytes

Today’s issue is a special one because the main story was written by the Whiteboard King himself, Ben Holmes. Make sure you tell him how much you loved it so he comes back again sometime.

Today’s issue: The Monty Python character inspired by Remix, event loops inside event loops, and a new Figma feature for setting low reasonable expectations with your design team.

Welcome to #301.


Eyeballs logo

The Main Thing

A graph that shows installs going up as vibes go up

Just used tldraw for the first time to diagram its marketing strategy

How open source goes viral

Remember when corporate social accounts could just be boring? Well in 2024, brands need to have personality🦄 – which means square-shaped hamburgers need their own mixtapes, and open-source frameworks need a laser-eyed horse mascot. Thanks, Gen-Z.

Luckily, June’s flood of tech confs got two popular OSS authors to spill the beans on their marketing secrets, so the rest of us could learn how it’s done.

Steve Ruiz spoke about how tldraw’s Make Real could make real dollars, and Carson Cross revealed HTMX’s highly technical OSS marketing strategy.

Let’s break down what’s working well for both projects and try to draw some bigger lessons that can apply to other projects too. Welcome to OSS Marketing 101.

Case Study #1: tldraw used AI in an actually good way.

At first, Steve was unsure how to make a splash with his virtual whiteboarding tool. Since we all know that only real whiteboards are exciting, I’m sure it was hard.

But when the AI wave hit last year, Steve got a crazy idea: what if you could point AI at your drawings, and turn them into real, functioning websites?

So, he spun up a prototype in a weekend, put it on Twitter, and Make Real was born. The project blew up fast, and Steve capitalized on the hype by opening Make Real to allow anyone’s OpenAI key with this robust security warning: risky but cool.

This opened a floodgate of ideas for tldraw to share, which hasn’t slowed down since. They just went viral again this week for turning an iPod diagram into a working app with Chat gpt-4o.

The most interesting takeaway here is how tldraw invited the community and made it easy for folks to both create cool stuff and share those creations with the world. Love to see a good flywheel.

Case Study #2: HTMX turned haters into HATEOAS-ers.

HTMX installs have hit that perfect hockey-stick growth curve that every investor dreams of. But what’s even more impressive is how HTMX has been able to sustain that growth.

Like my wardrobe of exactly three polos, it turns out that creator Carson Cross keeps a few options on repeat:

  • Agree and amplify when criticized and never get defensive. Accused that, “Ruby on Rails did that 10 years ago”? Agree. Asked, “did JS hurt you?” Agree.

  • Self deprecate and admit what your project is bad at to build trust. There’s no greater example than the HTMX sucks blog post Carson wrote and posted on the HTMX website.

  • “Reasonablify” bad takes by trying to find common ground in a critique. Take this recent comment: “Vanilla JS with fetch is much better than HTMX.” Seems like a trap, but there’s a reasonable feeling – don’t use a library until you need it.

Bottom Line: I’m not sure what the exchange rate is on GitHub stars to VC dollars these days, but congrats on officially passing OSS Marketing 101 and getting one step closer to becoming a millionaire.

        

React Rally logo

Our Friends
(With Benefits)

Snoop Dog holding up a Tweet from Kent Dodds saying to go to React Rally.

Say less

React Rally is BACK

One of the best React conferences is back in person on August 12-14 in Park City, Utah – and the speaker lineup looks amazing.

Chris Sev, Shruti Kapoor, Kent C. Dodds, Dev Agrawal, and many more will be there teaching about everything from server components, to React 19, to building React apps with AI.

Beyond the speakers, here’s what always sets React Rally apart from other conferences:

  • Single-track program covering a wide range of (practical) topics

  • Intentional hallway time to facilitate genuine networking and connection

  • Diverse range of attendees and speakers from all over the React ecosystem

React Rally started all the way back in 2015 and has consistently been one of the highest praised developer conferences.

Get your ticket today – we promise you won’t regret it.


Pop Quiz logo

Pop Quiz

Sponsored by Clerk

They just released the Clerk Elements beta – a library of unstyled, composable components for building custom UIs on top of Clerk’s best-in-class user management APIs.

Can you write a function that determines if one set is a subset of another set?

const setA = new Set([1, 2, 3, 4, 5, 6, 7, 8, 9, 10]);
const setB = new Set([2, 4, 6, 8, 10]);

Cool Bits logo

Cool Bits

  1. Remix just released v2.10, and like the villager in Monty Python, they want you to know that “I’m not dead yet.”

  2. Deno’s Luca Casonato gave a 38-minute talk on How to publish a JavaScript package in 2024. Thirty Eight Minutes.

  3. There are some stellar additions to the speaker lineup at React Universe Conf (formerly React Native EU) 🌟. The full agenda is coming soon, so don’t miss your chance to hear these industry leaders share their insights. Secure your tickets now, and prepare for lift-off to Wrocław, Poland, on September 5-6 🚀 [sponsored]

  4. Node-RED just released v4.0 of its low-code, event-driven development environment that’s based on Node.js. I knew there was some reason I’ve been craving Mtn Dew Code Red all week.

  5. Leerob wrote a long tweet article (twarticle?) about where they’re headed with caching in Next.js.

  6. The Google Sheets team ported their calculation worker to WasmGC, speeding up calculations by 40%. Congrats to the PM who just got a big raise.

  7. Datadog created this free Frontend Testing Kit to help teach you the best practices for creating and maintaining e2e tests, incorporating synthetic tests into your CI/CD pipeline, testing internal apps, and lots more. [sponsored]

  8. André Erikson wrote about putting a (Rust) event loop in your (Node.js) event loop.

  9. Brian Smith wrote about New JavaScript Set Methods on the MDN blog.

  10. Figma just announced improvements to their Dev Mode, adding a new View called “Ready For Dev.” Sadly, they did not add the “Ready To Be Disappointed” View, so you can let your designer know you’re done building their feature.


Pop Quiz logo

Pop Quiz: Answer

Sponsored by Clerk

At first glance, you might write something like this:

const setA = new Set([1, 2, 3, 4, 5, 6, 7, 8, 9, 10]);
const setB = new Set([2, 4, 6, 8, 10]);

function isSubset(setA, setB) {
  for (let elem of setB) {
    if (!setA.has(elem)) {
      return false;
    }
  }
  return true;
}

console.log(isSubset(setA, setB)); // Output: true

But recently, the Set object got upgraded with some new methods including a method called isSubsetOf which allows us to write something like this:

const setA = new Set([1, 2, 3, 4, 5, 6, 7, 8, 9, 10]);
const setB = new Set([2, 4, 6, 8, 10]);

console.log(setB.isSubsetOf(setA)); // Output: true