I Will Rem-Ember.js You

Today’s issue: The #1 source for all my infrastructure opinions, command-line cheat codes, and deceptively worthless JavaScript knowledge.

Welcome to #201.

---

I Will Rem-Ember.js You

Does anyone know what species of rodent the Ember.js mascot is supposed to be? Is it a jolly gopher? A silly little hamster? A spunky chipmunk?

These days, I’m pretty sure it’s a groundhog — considering that Ember now spends most of its time quietly chilling in its hole, before poking its head out once a year to look for its shadow drop a new major release.

This year’s Groundhog Day was just a couple weeks ago when Ember 5.0 came out. This release didn’t come packed with new features, but instead focused on removing deprecations and prepping for an upcoming new edition of Ember called Polaris. ✨

But before we talk about the future, let’s look back at a few key dates in Ember history to help us understand how we got here.

December 8, 2011: Yehuda Katz and Tom Dale launched Ember as an opinionated client-side framework for building “ambitious web applications.” Yehuda was previously on the Ruby on Rails core team — and Ember seemed to promise a “Rails for JavaScript” approach for web development, by providing a similarly opinionated architecture based on the Model-View-Controller pattern.

August 31, 2013: Ember 1.0 launched, and we got our first-ever Groundhog Day. The Ember community was already growing fast at this point, with lots of third-party tools and projects, and this first major release took that growth to the next level. It looked like Ember was in prime position to challenge jQuery, Backbone, Angular.js, and (eventually) React in the great framework wars of the 2010s.

February 2, 2015: Ryan Florence (then a very active member of the Ember community) gave a now-famous talk at React Conf, where he compared the performance of a simple app built in React vs Ember vs Angular. React’s perf blew the other frameworks out of the water, while also clearly providing a much easier way to build robust animations. This red wedding live demo left some members of the Ember community a little shaken, and it felt like a real inflection point for React’s popularity.

August 13, 2015: Ember 2.0 is released with significant changes aimed to address performance issues and improve the DX. The community responded favorably to v2, and Ember continued to grow over the next couple years — but it becomes clear that React and Angular are separating themselves from the pack in terms of mainstream usage.

Recent history: Stability is the name of the game for Ember these days. They still introduce new features in their regular minor releases, remove deprecations with major releases, and occasionally launch new “editions” — which introduce new sets of features with accompanying tools and documentation.

Bottom Line: Ember might not have become the dominant, mainstream front-end framework that many expected it to back in the mid-2010s — but it’s built a lasting community and contributed ideas like the Ember Router that have since been remixed so many times, it’ll make you want to ask, “Do you ever have deja vu, Mrs. Lancaster?”

---

How to build a web app in 60 seconds with Dynaboard

Conditions are perfect.

That caffeine is hitting your neurons, the Tron soundtrack by Daft Punk is bumping in your headphones — and dammit, you’re ready to build something awesome.

But first you need to figure out which libraries to use, how much boilerplate you need, how to connect to your DB, and — oh crap, it’s 6pm already? Guess we’ll try again tomorrow 🥲.

Next time, start with Dynaboard. Their mission is to help you create a web app in 60 seconds from any database or API with their AI-supercharged low-code IDE.

How is that possible? By giving you a bunch of helpful stuff, then getting TF out of your way.

It comes with 40+ customizable UI components, intelligent data integrations, real-time collaboration, and one-click deploys to prod — plus a little WebAssembly magic that lets you add custom code on both the client and the server.

Try it for free — what could you build in 60 seconds?

---

Have you ever wondered how you’d create your own implementation of Array in JavaScript? No? Oh, well give it a shot anyway.

Implement array so that the code below works.

const friends = array("Ben", "Lynn", "Alex")

friends.push("Mikenzi") // 4
friends.pop() // Mikenzi
friends.filter((friend) => {
  return friend.length === 4
})

This may seem strange (it is), but it makes for a good learning activity which I know is the first thing you want to do in the morning when you wake up and open this newsletter.

---

1. In what I can only assume was a valiant attempt to calm the Twitter mob, Delba de Oliveira and LeeeeeeRob Jenkins wrote about Updates coming to Next’s App Router to improve its stability and performance.

2. Remix v1.18.0 just came out with a new stable dev server with HMR, opt-in JSON/plain text submissions, and perf upgrades.

3. Zero created a super easy way to integrate 3rd-party API credentials into your project. Their SDK is available for TypeScript, Rust, Python, and Go. [sponsored]

4. Simone Poggiali wrote a free ebook called The Concise TypeScript Book and put it on GitHub. Simone and I might have slightly different definitions of the word “concise” — but then again, I just wrote 500 words about Ember in the year 2023, so I can’t make jokes.

5. Medusa.js released a new Serverless Product Module, which lets you run Medusa’s open-source ecomm infrastructure directly within a Next.js function.

6. Darcy Clark (former staff engineering manager at npm) wrote about The massive bug at the heart of the npm ecosystem, which allows bad actors to hide malware and scripts in dependencies undetected. Not great, Bob.

7. Saurabh made this list of Advanced macOS Command-Line Tools. I really hope one of these commands will be a cheat code to help me get around the Twitter rate limits.

8. Malte Ubl gave a good talk at React Summit called Principles for Scaling Frontend Application Development. I know he’s the CTO of Vercel and a former Google executive — but when it comes to scaling applications, I usually prefer to trust the opinions of the most aggressively mean people on Hacker News.

---

This isn’t terribly practical, but it is a fun activity to do to really grasp the often overlooked bits of JavaScript.

function array () {
  let arr = Object.create(array.prototype)

  Object.defineProperty(arr, 'length', {
    value: 0,
    enumerable: false,
    writable: true,
  })

  for (key in arguments) {
    arr[key] = arguments[key]
    arr.length += 1
  }

  return arr
}

array.prototype.push = function (element) {
  this[this.length] = element
  this.length++
  return this.length
}

array.prototype.pop = function () {
  this.length--
  const elementToRemove = this[this.length]
  delete this[this.length]
  return elementToRemove
}

array.prototype.filter = function (cb) {
  let result = array()

  for (let index in this) {
    if (this.hasOwnProperty(index)) {
      const element = this[index]

      if (cb(element, index)) {
        result.push(element)
      }
    }
  }

  return result
}

const friends = array("Ben", "Lynn", "Alex")

friends.push("Mikenzi") // 4
friends.pop() // Mikenzi
friends.filter((friend) => {
  return friend.length === 4
})

If you’re curious or confused by the code, we wrote about it here.