The engine, not the juice

Issue #40.March 22, 2021.2 Minute read.
Bytes

Elon Musk dubbing himself TechnoKing last week inspired me to legally change my name to what I always call myself after a pushing a fat PR: DOMLord. Sorry Mom.

V8 releases v9

Daphne

The new symbol for speed

V8 (the engine, not the juice) released v9.0 last week with some notable improvements. It’s still in beta while it waits to coordinate its release with Chrome 90, but you can give it a whirl today if you’re feeling spicy.

How did we get here? V8 is Google’s open source JavaScript and WebAssembly engine that was created back in 2008 by Lars Bak—who also invented Dart (and a bunch of other stuff).

Presumably Lars liked fast cars, all of which were probably powered by V8 engines.

While a fine name for 2008, V8 doesn’t quite hold the same oomph it used to. That’s why we’re introducing a new petition to change the name of V8 to Daphne — the ultimate symbol for speed and power in 2021.

What’s the use of having a large newsletter if you don’t use it to foster the change you want to see in the world?

What’s new in Daphne 9.0:

  • New match indices for regex — For the 4 of you reading this who understand Regex - A new indices array for regex lets you store the start and end positions of each matched capture group.

  • Faster super property access — The super keyword is a nice way to access the properties and functions on an object’s parent, but it was always slow because it was implemented via a runtime call… until now. V8v9 now uses the inline cache system instead, which makes super property access way faster.

  • Faster JS-to-Wasm Calls — When JavaScript calls an exported WebAssembly function, the call has to go through a JS-to-Wasm wrapper in order to make it work. Unsurprisingly, this makes those calls quite a bit slower. v9.0 mitigates this issue by inlining the JS-to-Wasm wrapper code at the call site.

The Bottom Line

Don’t forget to sign the petition - #V8toDaphne

The Bleeding Edge — Clio

Bobby

Show me the bleeding edge of the web 🔮

We’re highlighting a very new project today, so buckle up and put on your Bill Nye bow tie.

Clio is a new, functional programming language that targets distributed systems and compiles to JavaScript.

We can break Clio down into three main parts:

  • By embracing functional programming, Clio developers are smarter, better looking, and generally more correct than their non-functional counterparts.

  • Distributed systems take the computing tasks that would be done by one computer, and spreads them out over many computers so that they can execute faster and without relying on any single computing unit. Clio uses “multiple CPUs and CPU cores (parallelism) by default” and features a pretty clean syntax — so you can write your code like normal and it’ll automatically be executed in a distributed/parallel fashion.

  • Compiling to JavaScript makes Clio “fast, easy to port, and easy to extend.” It also allows Clio to take advantage of JavaScript’s ecosystem of tools and libraries, running anywhere JavaScript can.

Check out this tutorial on How to Make a Reactive To-do App With Clio from its creator, Pouya Eghbali.

Don’t Get Sued

If the name Clio sounds familiar to you, that’s because it’s also the name of a bunch of other things, including Renault’s best-selling subcompact car and a SaaS company that makes software for law firms.

So, we’ll tell the Clio team the same thing we tell ourselves every week when we start writing Bytes: have fun out there, but try not to get sued.

JS Quiz - Answer below

What will be logged to the console after the code is finished executing?

function first () {
  var name = 'Jordyn'

  console.log(name)
}

function second () {
  var name = 'Jake'

  console.log(name)
}

console.log(name)
var name = 'Tyler'
first()
second()
console.log(name)

Cool Bits

  1. Jack Franklin (from the Chrome DevTools team) wrote an in-depth article comparing Svelte and React. The best part is, at the end of the article he officially endorsed the #V8toDaphne name change.

  2. NASA’s next-gen mission control system is open source and written in JavaScript. Take that, team TypeScript.

  3. Mesh is a simple tool for creating pretty gradients. Now all we need is a tool for creating spinning globes and we’ll have successfully replaced 50% of startup landing pages.

  4. Alex Kotliarskyi (who works on React Native at Facebook) wrote about the the evolution of the React API since its earliest days. Tyler (who is currently typing this) took a similar approach in Why React Hooks.

  5. Kevin Peters wrote about his #1 tip for getting yourself familiar with a new JavaScript codebase. Surprisingly the tip was not to change your prettier config file in order to quickly establish dominance as the #1 contributor to the project.

  6. Isoworker is a tool for universal multi-threading with main-thread dependencies in JavaScript. Don’t worry, I don’t understand what that means either.

  7. Luke created Worktop — a next gen web framework for Cloudflare Workers that might just be cool enough to also earn him the nickname of DOMLord. We’ll consider it.

  8. A pseudonymous blogger who only goes by T0ST wrote an in-depth article on how they cut GTA Online loading times by 70%. And no, it wasn’t because they forgot to run React in production mode.

#V8toDaphne ❤

JS Quiz - Answer

We get undefined, Jordyn, Jake, then Tyler. What this shows us is that you can think of each new Execution Context as having its own unique variable environment. Even though there are other Execution Contexts that contain the variable name, the JavaScript engine will first look to the current Execution Context for that variable.

For more info (and to see a cool GIF on how the JS interpreter evaluates the code above that I would include here but honestly I’m not sure how different email clients support GIFs), visit The Ultimate Guide to Hoisting, Scopes, and Closures in JavaScript