JavaScript Identifier Renamer

What Is Identifier Renaming?

Identifier renaming is the process of replacing meaningful variable, function, and parameter names in source code with short, meaningless identifiers. For example:

// Before
function calculateTotalPrice(items) {
  let totalPrice = 0;
  for (const item of items) {
    totalPrice += item.price * item.quantity;
  }
  return totalPrice;
}

// After
function a(b) {
  let c = 0;
  for (const d of b) {
    c += d.price * d.quantity;
  }
  return c;
}

This is one of the most common obfuscation techniques in the JavaScript world. Popular minifiers like Terser, esbuild, and UglifyJS all perform identifier renaming by default. Combined with whitespace removal, it makes code compact and much harder to understand.

Why Rename Identifiers?

• Reduce file size. A long name like calculateTotalPrice becomes a, saving bytes. This is the primary motivation for minifiers.
• Raise reverse-engineering cost. Meaningful names are a roadmap for understanding code. Renaming removes that roadmap.
• Protect intellectual property. Name changes make it harder for competitors to understand your algorithms at a glance.
• Bypass naive scrapers. Some scrapers look for keywords like function init or var token. Renaming breaks these patterns.

Why AST Parsing Matters

The naive approach — regex search-and-replace — breaks code. Consider:

const name = "Alice";
console.log("Hello, " + name);
console.log(obj.name);

A regex replacing name would incorrectly rename:

• The "name" inside obj.name — this is a property, not a variable
• Any string literal that contains name
• Identifiers in comments

An AST parser like Acorn understands the difference. It knows that the first name is a variable declaration, the second is a reference to that variable, and obj.name is a property access. Only the first two are renamed.

Scope Awareness

JavaScript has block scoping. Two variables with the same name in different scopes are different variables:

let x = 1;
function foo() {
  let x = 2;  // different x
  return x;
}
console.log(x);  // still 1

A scope-aware renamer renames each scope's variables independently. This tool builds a complete scope tree from the AST, then renames each declaration with a unique name.

What This Tool Protects

• String literals — never touched
• Comments — preserved as-is
• Object property names — preserved (unless you enable the risky option)
• Global variables — preserved (unless you enable the risky option)
• Keywords — never renamed

What This Tool Cannot Do

Name Styles

Style	Example	Best For
Short	a, b, c, aa, ab	Smallest output size
Hex	_0xa1b2, _0xc3d4	Classic obfuscator look
Random	xK3mN, pQ7vR	Hardest to pattern-match
UUID	_a1b2c3d4	Maximum uniqueness

Best Practices

• Always test after renaming. Run the renamed code in a browser and check for errors.
• Keep the mapping. If you need to debug the renamed code, the mapping shows you which name became what.
• Do not enable "Globals" unless necessary. Renaming top-level var and function can break code that expects them on window.
• Use with a minifier. Run this tool, then minify the output for smaller files.

Frequently Asked Questions

Related Tools

External Resources

• Acorn on GitHub — JavaScript parser
• Estraverse — AST traversal
• Escodegen — code generation from AST
• Terser — production JS minifier with mangling