Angular goes meta

Today’s issue: Another tease from the React team, The State of MooTools 2023 survey, and the perils of building a programming language without the financial backing of the sausage king of Chicago.

Welcome to #233.

---

Angular goes meta

Have you ever been out on a first date and caught your mind wandering back to that same old question, Why doesn’t Angular have its own meta-framework like Next.js or Nuxt?

Yeah, me too. But we don’t have to wonder anymore, thanks to Brandon Roberts and Analog.js — his new(ish) meta-framework built on top of Angular that now provides lots of Next features to the ng crew.

How we got here: When standalone components were first introduced to Angular v14 in June 2022, it opened up new ways to use the framework in other ecosystems. This change, plus a few other architectural improvements, finally made it feasible to build a meta-framework that combined Angular with other tools and libraries.

Brandon jumped at the opportunity, and a few months later he unveiled Analog.js at ViteConf 2022. Initially, it provided a simple way of integrating Vite into Angular via a Vite plugin, but Brandon promised it would eventually grow into something more robust.

Fast forward to two weeks ago, and Brandon was back on the (virtual) stage at ViteConf to make good on his promise. He showed how Analog now combines Vite, Nx, and Nitro to give you a full-stack Angular meta-framework with all the fixins:

• A file-system based router that supports many different layouts, like group routes, dynamic routes, static routes, and pathless routes.

• SSR and SSG through ng serve and ng build, along with server-side data fetching.

• API routes that are also defined with file-based syntax.

Bottom Line: It’s still early days for Analog, but if meta-frameworks are your jam, you might be running out of excuses for avoiding Angular.

---

Secureframe makes SOC 2 compliance easy

Getting your application SOC 2 certified will finally let you start landing those big enterprise customers – but it usually takes months of engineering time, and lots of tricky hoops to jump through ☠️.

That’s why thousands of companies let Secureframe handle it.

They’ve automated the entire compliance process for SOC 2 and other security/privacy frameworks like ISO 27001, GDPR, and HIPAA. So now you can get certified in weeks, instead of months.

Plus, their AI-powered platform lets you automate manual tasks, so it’s easy for you to stay compliant in the future.

Set up a free, personalized demo — and they’ll help you get all those fancy security compliance badges on your homepage ASAP.

---

What gets logged?

let i = 0

function x() {
  i++
  return 10
}

i += x()

console.log(i) // ?

Shout out to MapleLead for this one.

---

1. Joe Savona and Mofei Zhang from the React team gave a sneak preview of the React Forget compiler at React Advanced Conf. But they still haven’t released anything publicly, because the React team loves a good tease.

2. The New Relic team wrote about How to set up OpenTelemetry for full-stack JavaScript development. It gives an in-depth walkthrough of how to integrate this open-source observability framework into a full-stack React + Node.js app. [sponsored]

3. Mock Service Worker 2.0 just launched with its “biggest API change to the library since its inception.”

4. TK Kinoshita wrote Control Flow: If and While Expressions, which is the fourth and final article in his “Essentials of Interpretation” Series. Disney and Warner Bros are locked in a bidding war for the movie rights, because their streaming services could really use another cinematic universe right about now.

5. Speaking of streaming, Gal Schlezinger wrote about Out of Order Streaming from Scratch and why people are so excited about it.

6. Colin Eberhardt gave an interesting breakdown of The State of WebAssembly 2023 survey results. Which reminds me, please sign up to take my State of MooTools 2023 Survey before it’s too late. One lucky participant will receive a limited edition Furby signed by Gnarls Barkley.

7. Unlayer Embed is a drag-and-drop email editor and page builder for your SaaS application that’s easy to embed and will easily save you weeks of dev time. [sponsored]

8. Storybook 7.5 was released last week with zero-config support for Vite, 2.2x faster startup times for React TS projects, and better Next.js support.

9. Preethi Sam wrote about How To Animate Along A Path In CSS.

10. Evan Czaplicki gave an insightful talk at Strange Loop Conf called The Economics of Programming Languages, which he says is the talk he needed to hear 10 years ago when he was just starting to create Elm. Turns out, building a programming language is pretty hard unless you have the full financial backing of a FAANG company, or your dad is Abe Froman, the sausage king of Chicago.

---

let i = 0

function x() {
  i++
  return 10
}

i += x()

console.log(i) // ?

The answer is 10. Here’s how it works.

For clarity, we can refactor i += x() to be i = i + x(). From there, the interpreter begins evaluating our code. Before it evaluates the function invocation, it seems that i evaluates to 0, so now our code is i = 0 + x(). The invocation of x returns 10, so now it’s i = 0 + 10, which gives us i = 10.

Note that if you swap the order of i and x() like i = x() + i you get a different value - 🫂.