JavaScript Performance Basics

Written by Swapnil RajaPublished 24 Aug 2026

Fast code starts with measuring, not guessing where the slow part is.

Intuition about what is slow is wrong surprisingly often.

The next lessons cover specific techniques; this one covers the mindset.

Example

javascript

const started = Date.now();

let total = 0;
for (let i = 0; i < 100000; i++) {
  total += i;
}

const elapsed = Date.now() - started;

console.log(elapsed >= 0);
console.log(typeof elapsed);

PreviousJavaScript Async Iteration NextJavaScript Debounce

Example

javascript

const items = ["a", "b", "c"];

function withRepeatedWork() {
  const results = [];
  for (const item of items) {
    const upper = "PREFIX-" + "STATIC".toUpperCase();
    results.push(upper + item);
  }
  return results;
}

function withoutRepeatedWork() {
  const prefix = "PREFIX-" + "STATIC".toUpperCase();
  const results = [];
  for (const item of items) {
    results.push(prefix + item);
  }
  return results;
}

console.log(withRepeatedWork().join(",") === withoutRepeatedWork().join(","));

Complete Example

html

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript Performance Basics</title>
</head>
<body>

  <h1>Performance Basics</h1>

  <p id="out"></p>

  <script>
    const started = Date.now();

    let total = 0;
    for (let i = 0; i < 500000; i++) {
      total += i;
    }

    const elapsed = Date.now() - started;

    document.getElementById("out").textContent =
      "Summed " + total + " in " + elapsed + "ms";
  </script>

</body>
</html>

JavaScript Performance Basics

Example

Measure First

Syntax

Work Inside a Loop Multiplies

Example

Avoid Repeating Work That Never Changes

Example

Array Method Choice Rarely Matters Most

Example

The Right Data Structure Matters More

Example

Do Not Optimise Blindly

Example

Complete Example

Try It Yourself

Important Points

Conclusion