Skip to content

6.0.0

Latest
Compare
Choose a tag to compare
@alexreardon alexreardon released this 20 Oct 02:39
· 4 commits to master since this release

At a glance

🧹 New .clear() function to remove the current memoization cache
πŸ‹οΈβ€β™€οΈ Stronger types
πŸ₯° Improved documentation

This release is a major, but there are no behaviour or API changes. The major is to reflect that some of the TypeScript types have been tightened which might cause some peoples TypeScript builds to break.

PSA: memoize-one will soonℒ️ be dropping ie11 support
More details

New: Cache releasing with .clear() 🧹

A .clear() property is now added to memoized functions to allow you to clear it's memoization cache

This is helpful if you want to:

  • Release memory
  • Allow the underlying function to be called again without having to change arguments
import memoizeOne from 'memoize-one';

function add(a: number, b: number): number {
  return a + b;
}

const memoizedAdd = memoizeOne(add);

// first call - not memoized
const first = memoizedAdd(1, 2);

// second call - cache hit (underlying function not called)
const second = memoizedAdd(1, 2);

// πŸ‘‹ clearing memoization cache
memoizedAdd.clear();

// third call - not memoized (cache was cleared)
const third = memoizedAdd(1, 2);

Improved: memoized function type

There are no API changes to memoize-one, this is merely a typing improvement

Our previous type for a memoized function was simple:

Previous

export declare type EqualityFn = (newArgs: any[], lastArgs: any[]) => boolean;

declare function memoizeOne<ResultFn extends (this: any, ...newArgs: any[]) => ReturnType<ResultFn>>(resultFn: ResultFn, isEqual?: EqualityFn): ResultFn;

A memoized function claimed to be the same type (ResultFn) as the original function. This was not true, as memoize-one does not copy of any existing object properties on the original function (TFunc)

Updated

export declare type MemoizedFn<TFunc extends (this: any, ...args: any[]) => any> = {
  clear: () => void;
  (this: ThisParameterType<TFunc>, ...args: Parameters<TFunc>): ReturnType<TFunc>;
};

declare function memoizeOne<TFunc extends (this: any, ...newArgs: any[]) => any>(
  resultFn: TFunc,
  isEqual?: EqualityFn<TFunc>,
): MemoizedFn<TFunc>;

A memoized function returns the same callable signature as the original function (TFunc β†’ was ResultFn), but it makes it clear that no function object properties on the original function (TFunc) are being carried forward. The memoized function also now includes a .clear() function object property

If you want to continue to use the old types where the memoized function is the same type as the function being memoized, you can achieve this by casting the type of your memoized function:

function add(first: number, second: number): number {
  return first + second;
}
// a type that matches our add function
type AddFn = (first: number, second: number) => number;

// type of memoized will be MemoizedFn<typeof add>
const memoized = memoize(add);

// option 1
const memoized: typeof add = memoize(add);

// option 2
const memoized: AddFn = memoize(add);

// option 3
const memoized = memoize(add) as typeof add;

// option 4
const memoized = memoize(add) as AddFn;

This type change has been labelled as a patch (fix) as the previous type was not correct. However, you could consider it a major given that the new type is narrower than before

Improved: equality function type

There are no API changes to equality functions, this is merely a typing improvement

Previous

export type EqualityFn = (newArgs: any[], lastArgs: any[]) => boolean;

Current

export type EqualityFn<TFunc extends (...args: any[]) => any> = (
  newArgs: Parameters<TFunc>,
  lastArgs: Parameters<TFunc>,
) => boolean;

This looks a little scary, but it is pretty neat! It means that you can dramatically improve the type safety of your custom equality functions if you want to.

If you are not using a custom equality function

No changes for you!

If you are using a custom equality function

Most people will not be impacted!

This type tightening allows you to be a lot stricter with the shape of your functions passed in as equality functions. If you are using generic equality functions such as lodash.isequal their types are loose and there is nothing you will need to do. But if you want to write more efficient and typesafe equality functions, you are in for a treat.

An example of what things looked like in 5.x

import memoize, { EqualityFn } from "memoize-one";

type Person = {
  id: string;
  name: string;
};

function invite(person: Person) {
  // This could do something fancy, but just keeping things basic
  console.log("invited:", person.name);
}

// Yuck, we don't know anything about the args
// Note: don't really need the `EqualityFn` type as it is just:
// `type EqualityFn = (newArgs: any[], lastArgs: any[]) => boolean;`
const isEqual: EqualityFn = (newArgs: any[], lastArgs: any[]): boolean => {
  // Yuck #2: we have to cast here
  // We would also be creating a bug if isEqual is used on a function
  // that has no arguments
  const first = newArgs[0] as Person;
  const second = lastArgs[0] as Person;
  return first.id === second.id;
};

const memoized = memoize(invite, isEqual);

const alex: Person = {
  name: "Alex",
  id: "11111"
};

memoized(alex);
// Won't do anything as `alex` has the same id as the last `alex`
memoized(alex);

β†’ You can play with this example on codesandbox.io

The same example in 6.x

import memoize, { EqualityFn } from "memoize-one";

type Person = {
  id: string;
  name: string;
};

function invite(person: Person) {
  console.log("invited:", person.name);
}

// Yum: we know that newArgs + lastArgs are the tuple `[Person]`
const isEqual: EqualityFn<typeof invite> = ([first], [second]): boolean => {
  return first.id === second.id;
};

const memoized = memoize(invite, isEqual);

const alex: Person = {
  name: "Alex",
  id: "11111"
};

memoized(alex);
// Won't do anything as `alex` has the same id as the last `alex`
memoized(alex);

// When declared inline, our isEqual function has the correct types inferred
const inferred = memoize(invite, function isEqual([first], [second]): boolean {
  return first.id === second.id;
});

β†’ You can play with this example on codesandbox.io

There are a few cases where this could cause your TypeScript types to start failing, so this change has been listed as a major

Improved: Documentation

  • Cleanup and audit of examples
  • Added documentation for .clear()
  • Added documentation about function properties and the .length property
  • Updated performance benchmarks

Internal code health

  • Now on TypeScript@4.4.3
  • Moved from TravisCI to Github workflows
  • Upgraded devDependencies

Thanks ❀️

Thanks so much to the following people who helped make this release possible:

Catch you next time,