The Rise and Fall and Rise Again of Rome

Issue #175.April 3, 2023.2 Minute read.
Bytes

I know this time of year can be trying for all of us. But I hope you were able to make it through the hellscape of corporate April Fool’s Day jokes last weekend relatively unscathed 🙏.

Today’s issue: CSS alchemy, ketamine therapy, and the SvelteKit School of Business.

Welcome to #175


Eyeballs logo

The Main Thing

A small roman army

The vertical toolchain showing up to lint my crappy code

The Rise and Fall and Rise Again of Rome

Rome just launched v12 last week, which got us thinking — what has the JavaScript toolchain of the future been up to lately? And also, has anyone ever actually read Meditations by Marcus Aurelius, or do they just pretend to?

But before we can answer those questions, we need to go over some not-so-ancient Roman history.

How we got here: Rome was co-founded by Romulus and Remus Sebastian McKenzie and Jamie Kyle, who had previously created Babel and helped build Yarn. They released the first Rome beta in August 2020, with the promise of becoming The one build tool to rule them all — aka a single monolithic toolchain that was “designed to replace Babel, ESLint, Webpack, Prettier, and Jest.”

A few months later, they started a company and raised $4.5 million of venture capital to pursue that vision. Since then they’ve released a formatter and linter, rewrote Rome in Rust, and continued working towards the all-in-one toolchain vision.

Fast forward to today, and it seems like Rome-the-company is no longer operating. This will probably be true for lots of OSS startups that got funded during the 2021 VC fever dream, unfortunately. But it’s cool to see that Rome-the-OSS-project continues to ship new updates — even though, from what we can tell, a few of the core team members now have full-time jobs elsewhere.

Here are some quick highlights from Rome v12:

  • JSON file support, which unlocks various new toolchain features.

  • Import sorting via CLI with a new rome check command.

  • Better diagnostics, VSCode extension improvements, and new linter rules.

Bottom Line: The future of Rome still looks a little uncertain, but hopefully they can continue to make solid progress as the OSS project. We’re always cheering for teams that are trying to make faster build tools — especially when they’re named after ancient civilizations that lend themselves to lots of puns.

        

highlight.io logo

Our Friends
(With Benefits)

girl crying while surrounded by toy dinosaurs

Me vs prod-specific bugs.

highlight.io shows you WHY bugs happen

“Why is this happening to me???”

If you’ve ever sobbed those words into your monitor in the middle of a workday, it’s probably because, 1) you saw your high school crush get engaged to someone else, or 2) you’re trying to fix bugs in prod that you can’t reproduce locally.

I can’t help you with the first problem (try ketamine therapy), but highlight.io can definitely solve the second one for you.

Their open-source Session Replay & UX Monitoring tool lets you debug from your user’s perspective — so you can easily reproduce tricky issues, and understand how people are using your product.

Just install a few lines of code, and you’ll be able to:

  • Reproduce the devtools for every session — console logs, errors, network requests and more.

  • Easily protect user privacy.

  • Get a complete view of your entire stack — from a user clicking a button to a server-side log.

Check it out — and maybe just try calling Stacy if you miss her that much.


Spot the Bug logo

Spot the Bug

Sponsored by Datadog

They’re doing a free webinar on April 27th at 2:00pm ET to show you how to improve your app’s UX with Synthetic Monitoring, Real User Monitoring, and lots more.

const user = {
  name: 'Tyler',
  age: 32,
  greet() {
    alert(`Hello, my name is ${this.name}`)
  },
  mother: {
    name: 'Jan',
    greet() {
      alert(`Hello, my name is ${this.mother.name}`)
    }
  }
}

user.mother.greet()

Cool Bits logo

Cool Bits

  1. ChiselStrike just released Turso, their new Edge database that brings the developer experience of SQLite to the Edge (it also has a very generous free tier).

  2. QA Wolf will get your web app 80% automated E2E test coverage in just 4 months. And their “Zero Flake Guarantee” is way more reliable than the one for that dandruff shampoo I bought in Reno. [sponsored]

  3. Kevin Sookocheff wrote about What complex systems can teach us about building software. I don’t know if coaching my 5-year-old’s soccer team counts as a “complex system”, but I do know that it is definitely not helping me build better software.

  4. Ted Neward wrote an article called You Want Modules, Not Microservices. What Ted doesn’t realize is I don’t get a pay raise OR sound smart to my coworkers if I say I want to introduce modules into our architecture.

  5. Bright is a React Server Component for syntax highlighting which you’ll be able to use in 6 years when you finally upgrade from that React Router v4 app you’re running.

  6. Una “not the daughter of Lenny” Kravets wrote about Using color-mix() to create opacity variants. I didn’t think they taught this level of CSS alchemy until you became a Level-37 mage.

  7. Chris Ellis wrote an article called A business case for SvelteKit. It’s a good article, but I feel like he would’ve had a stronger case if he had used the word “synergies” a few more times.

  8. Microsoft rebuilt Teams from the ground up, and claims that it’s now 2x faster because, in part, they switched from AngularJS to React. When we asked Satya for comment, he just laughed maniacally into the phone, repeated “I am a good Bing” three times, and hung up. Somebody might want to check on that guy.


Spot the Bug logo

Spot the Bug: Solution

Sponsored by Datadog

Yes I plan on single handedly keeping this keyword knowledge alive!

const user = {
  name: 'Tyler',
  age: 32,
  greet() {
    alert(`Hello, my name is ${this.name}`)
  },
  mother: {
    name: 'Jan',
    greet() {
      alert(`Hello, my name is ${this.mother.name}`)
    }
  }
}

user.mother.greet()

When we invoke user.mother.greet, we can tell what the this keyword is referencing by looking to the “left of the dot” of the invocation – in this case, mother.

So inside of greet, it’s as if we had my name is ${mother.mother.name}, which is clearly wrong. Instead, since the this keyword is referencing mother, we can just do this.name.

const user = {
  name: 'Tyler',
  age: 32,
  greet() {
    alert(`Hello, my name is ${this.name}`)
  },
  mother: {
    name: 'Jan',
    greet() {
      alert(`Hello, my name is ${this.name}`)
    }
  }
}

user.mother.greet()