twJoin vs template literal (v2)

Revision 2 of this benchmark created on

Description

compare twJoin vs simply using template literals

Setup

const someStyle = 'focus-visible:rounded-50 focus-visible:outline focus-visible:outline-200 focus-visible:outline-offset-25 focus-visible:outline-interactive-focus';

function twJoin() {
  let index = 0
  let argument
  let resolvedValue
  let string = ""

  while (index < arguments.length) {
    if ((argument = arguments[index++])) {
      if ((resolvedValue = toValue(argument))) {
        string && (string += " ")
        string += resolvedValue
      }
    }
  }
  return string
}

const toValue = mix => {
  if (typeof mix === "string") {
    return mix
  }

  let resolvedValue
  let string = ""

  for (let k = 0; k < mix.length; k++) {
    if (mix[k]) {
      if ((resolvedValue = toValue(mix[k]))) {
        string && (string += " ")
        string += resolvedValue
      }
    }
  }

  return string
}

Test runner

Ready to run.

Testing in
TestOps/sec
Template literal
const test = `prose-small h-full truncate text-interactive-neutral hover:text-interactive-neutral-hover active:text-interactive-neutral-active ${someStyle}`
ready
twJoin
const test = twJoin('prose-small h-full truncate text-interactive-neutral hover:text-interactive-neutral-hover active:text-interactive-neutral-active', someStyle);
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.