Is JSR the chosen one?

Today’s issue: Why is-number gets 59 million weekly downloads, how to (sometimes) get paid for open source, and Vercel’s AI buzzword bingo.

Welcome to #268.

---

Is JSR the chosen one?

After generations of prophecy a few weeks of buzz, Deno finally just released an open beta of JSR, its open-source package registry for modern JavaScript and TypeScript.

JSR stands for “JavaScript Registry”, but it might have been more appropriate to call it TSR, considering the first line of their website states that “JSR is designed for TypeScript.” I’m no branding expert, but this feels like that time I learned that the first KFC was actually started in Utah and not Kentucky.

But the bigger question on everyone’s mind is why do we need a new package registry?

Ryan Dahl knows better than anyone how much the JS ecosystem has changed since npm (and Node) were created back in 2009. Since then, we’ve seen the emergence of hugely impactful technologies like TypeScript, ES modules, and new JS runtimes — but npm wasn’t built with any of these in mind.

So the Deno crew decided to build a new registry themselves that, much like KFC’s donut chicken sandwich, embraces the full power of modernity. Here’s how:

• Native TypeScript support — I already gave this one away, but JSR does a lot of work behind the scenes to let you author your package in TypeScript and publish TS source directly to JSR, without a build step.

• ES modules only — Like Paul Atreides once told the Fremen army, “Be the change you wish to see in the world.”

• Works with any runtime — JSR wants to just work everywhere JavaScript works, without requiring authors to transpile and distribute typings manually. It already works with Node, Deno, Bun, Cloudflare Workers, and other npm environments, and plans to continue expanding support.

• Built on npm — Like TypeScript’s relationship to JavaScript, JSR is a superset of npm, not a fork. That means it’s designed to interoperate with npm-based projects, and JSR modules can import dependencies from npm.

Bottom Line: In many ways, the motivations behind JSR feel similar to Ryan’s motivations for building Deno as a more modern, secure, and TypeScript-friendly version of Node. It’s too early to tell if either project will reach the critical mass of users to truly “fix” the problems of their predecessors, but early returns for JSR look super promising.

---

POST/CON 24 full agenda revealed! 👀

If designing and consuming APIs is a big part of your job, attending POST/CON 24 on April 30-May 1, 2024, is a no-brainer.

Postman just dropped the full agenda (see here), and it’s stacked. Here are a few highlights:

• Hands-on labs teaching you new strategies and tools to enhance API development
• A full afternoon of talks dedicated to helping you take your APIs public and market them to developers
• Workshops on improving developer experience by scaling API collaboration across your organization

Claim your 30% discount on tickets if you register before March 26.

---

JavaScript has a new(ish) Intl API. You may be thinking “Internationalization? I only have users in the US, why would I use this?“. You fool, take a look. Here’s what it can do.

Format Dates: Similar to the toLocaleDateString method on the Date object, you can use this to format Dates, but with Intl you get some extra options like timeZone.

const date = new Date(Date.now());

new Intl.DateTimeFormat("en-US", {
  timeZone: "America/Los_Angeles",
  minute: "numeric",
  hour: "numeric",
}).format(date);

// 9:45 AM (returns the current time in that timeZone)

Format Numbers: You can also use Intl to format Numbers.

new Intl.NumberFormat("en-GB", {
  style: "unit",
  unit: "liter",
  unitDisplay: "long",
}).format(1); // '1 litre'

Or in America, we refer to this as a “Large Farva”.

Format Lists: As Oxford comma maximalists, we appreciate that it can render lists properly too.

const list = ["Motorcycle", "Bus", "Car"];

new Intl.ListFormat(
  "en-US", 
  { style: "long", type: "conjunction" }
).format(list); // 'Motorcycle, Bus, and Car'

Text Segmentation:

The last feature we’ll highlight (there are more) is language specific text segmentation. Doing a str.split('') on non-english strings is a good way to introduce bugs.

const str = "吾輩は猫である。名前はたぬき。";
console.table(str.split(" "));
// ['吾輩は猫である。名前はたぬき。']
// The two sentences are not correctly segmented.

const segmenterJa = new Intl.Segmenter("ja-JP", { 
  granularity: "word" 
});

const segments = segmenterJa.segment(str);

console.table(Array.from(segments));
// [
//   {
//     segment: "吾輩",
//     index: 0,
//     input: "吾輩は猫である。名前はたぬき。",
//     isWordLike: true,
//   },
// ];

---

1. Vercel’s AI SDK 3.0 open-sources the generative UI tech of their v0 tool and allows you to “give LLMs rich, component-based interfaces” using React Server Components. That last sentence had so many buzzwords in it that I feel like I need to lie down for a minute.

2. Ok, we’re back. Roy Anger wrote a helpful guide on How to add an onboarding flow to your application with Clerk. It shows how to use Next.js Middleware and Clerk’s customizable session tokens to create a strong onboarding experience that will make your users actually want to stick around. [sponsored]

3. Chris Haynes wrote about Streaming HTML out of order without JavaScript.

4. Vjeux wrote about his experience working at Meta for the past 12 years, including his work on React Native, Prettier, and trying to help Americans learn how to correctly pronounce French words. 2/3 ain’t bad.

5. ICYMI Apple isn’t going to remove PWA support on iOS in the EU after all.

6. Radosław Miernik wrote about their experience Getting paid for open source and the various financing models they’ve tried.

7. Datadog just released a free ebook on How to monitor AWS container environments at scale. [sponsored]

8. Shubham Jain wrote a quick post called, Why Does is-number Package Have 59M Weekly Downloads? Well, let me answer your question with another question: Why does this 2-hour video of miniature cooking recipes have 59M views? Because humankind is unknowable.

9. PGlite is a WASM + Postgres build that’s packaged into a TypeScript client library, enabling you to run Postgres in the browser, Node.js, and Bun.

10. Have you ever wondered how George Lucas just happened to think of a cinematic universe that centers on a desert planet, a “chosen one” trying to avenge the death of his father, space swords, and a pseudo-religious order that can wield a mysterious force to control others — a decade after Dune came out? Yeah me neither. But if you’ve ever wondered How to use CSS Hooks to style your React app, Jamie Kuppens has you covered.