@emotion/hash

@emotion/hash is a fast, lightweight MurmurHash2 implementation that generates deterministic hash strings from text input. The library provides a JavaScript-optimized version of the MurmurHash2 algorithm, producing base-36 encoded hash strings ideal for CSS-in-JS libraries and other high-performance hashing applications.

Package Information

• Package Name: @emotion/hash
• Package Type: npm
• Language: TypeScript
• Installation: npm install @emotion/hash

Core Imports

import hash from "@emotion/hash";

For CommonJS:

const hash = require("@emotion/hash");

Basic Usage

import hash from "@emotion/hash";

// Generate hash from string
const result = hash("some-input-string");
console.log(result); // "142gy0j" (deterministic base-36 string)

// Common CSS-in-JS use case
const className = `emotion-${hash("button { color: red; }")}`;
console.log(className); // "emotion-y2i8x2"

// Consistent hashing
console.log(hash("test")); // Always returns "skkcyc"
console.log(hash("test")); // Same result every time

Capabilities

Hash Generation

Fast string hashing using the MurmurHash2 algorithm, optimized for JavaScript environments.

/**
 * Generate a deterministic hash string from input text using MurmurHash2 algorithm
 * @param str - Input string to hash
 * @returns Base-36 encoded hash string (deterministic)
 */
function hash(str: string): string;

Algorithm Details:

• Based on MurmurHash2 by Austin Appleby
• Uses JavaScript bitwise operations for optimal performance
• Produces unsigned 32-bit hash values
• Outputs as base-36 string for compact representation
• Zero runtime dependencies
• Deterministic: same input always produces same output

Performance Characteristics:

• Fast non-cryptographic hash function
• Optimized for JavaScript number handling
• Suitable for high-frequency operations
• Minimal memory footprint

Usage Examples:

import hash from "@emotion/hash";

// Basic hashing
console.log(hash("hello")); // "15rnts0"
console.log(hash("world")); // "1668iql"

// CSS class generation
const styles = "color: red; font-size: 16px;";
const className = `css-${hash(styles)}`;
console.log(className); // "css-ak7ft"

// Cache key generation
const cacheKey = hash(JSON.stringify({ user: "alice", action: "login" }));
console.log(cacheKey); // "1yeum5v"

// Consistent across runs
console.log(hash("something")); // Always "crsxd7"

Important Notes:

• This is a non-cryptographic hash function - not suitable for security purposes
• Designed for speed and uniform distribution, not security
• Hash collisions are possible but statistically rare for typical use cases
• Output format is base-36 string (characters 0-9, a-z)