rpivo

Variable Declarations & Hoisting

Because all our global declarations are already registered in memory during compilation and prior to runtime, we can access these declarations anywhere in our code, even before they formally have been declared.

//we can use these variables even though they haven't formally been declared yet in this scope
console.log(a === b) // true
console.log(b === c) // true
console.log(c === d) // true

rpivo

process.memoryUsage() in Node

Node's global object process has a really cool helper function called memoryUsage() that helps measure (you guessed it) memory usage.

Some of the below code is taken and modified from Valentino Gagliardi's blog article on inspecting memory usage in Node.js.

const MB_DIVISOR = 1_000_000

const memoryUsage = process.memoryUsage()

rpivo

Numeric Separators in JavaScript

You can break up big numbers in JavaScript with the numeric separator _.

const difficultToReadTrillion = 1000000000000 // oof
const easyOnTheEyesTrillion = 1_000_000_000_000 // no problem

rpivo

Your Node.js Code (Including Comments) Takes up Runtime Memory

In the Node example below, we are logging the heapUsed property that's returned from process.memoryUsage(), and we divide this value by 1000, giving us the amount of allotted memory heap in kilobytes that we used to run this process.

console.log(`${process.memoryUsage().heapUsed / 1000}kb`)

// output: 2994.304kb

rpivo

Comparing Generics in Flow & TypeScript

The use of generics in Flow and TypeScript is pretty similar, except for a few things that are mentioned at the end. The following examples focus on TypeScript.

This simple example uses generics to specify a function that takes in three arguments wherein the last two must be of the same type.

function createTuple<A, B>(a: A, b: B, c: B): [A, B, B] {
  return [a, b, c]
}

rpivo

Comparing Read-Only & Write-Only Types in Flow & TypeScript

Flow and TypeScript have very similar means for declaring read-only types.

In TypeScript, if we want to create an object with immutable properties, we can do this:

const obj: Readonly<{
  foo: string,
  bar: string,

rpivo

Comparing Exact Object Types in Flow & TypeScript

Flow has something called exact object types. Without using it, you can specify properties that an object should have, but there's nothing stopping the object from having other properties besides the ones specified.

/* @flow */

const obj: {
  foo: string,
  bar: string,

rpivo

Comparing Never & Unknown Types in Flow & TypeScript

Although not fully documented, Flow has a type called empty that is somewhat similar to TypeScript's never type.

In TypeScript, we can use never to indicate a return type that will never happen, or to indicate an otherwise impossible branch of flow.

function neverReturns(): never {
  while (true) {}
}

rpivo

My TS Config Template

This is my starter tsconfig that I use for React / TypeScript applications. See further down the gist for a version without comments.

{
  "compilerOptions": {
    // source code will be kept in this location
    "baseUrl": "./src",
    // allows possible commonjs imports to be used inside an ES module context

rpivo

Adding an NPM Script That Updates All Packages at Once

Edit: I no longer use npm-update. I instead just run npm outdated to see what needs updating. I'm also not a fan of updating more than one package at once, so npm outdated works fine for me.

---

There is an awesome NPM package called npm-check-updates that will update all the packages in your project at once, requiring you to only run npm install after running it.

In most productionalized codebases, it's probably dangerous to update all package dependencies at once, but this nonetheless can be useful, especially in the early stages of building a greenfield codebase.