mirror of
https://github.com/kjanat/livedash-node.git
synced 2026-02-13 23:55:43 +01:00
Kaj Kowalski
cd05fc8648
- Fix syntax errors in skills markdown files (.github/skills, .opencode/skills) - Change typescript to tsx for code blocks with JSX - Replace ellipsis (...) in array examples with valid syntax - Separate CSS from TypeScript into distinct code blocks - Convert JavaScript object examples to valid JSON in docs - Fix enum definitions with proper comma separation
1.0 KiB
1.0 KiB
title, impact, impactDescription, tags
| title | impact | impactDescription | tags |
|---|---|---|---|
| Hoist RegExp Creation | LOW-MEDIUM | avoids recreation | javascript, regexp, optimization, memoization |
Hoist RegExp Creation
Don't create RegExp inside render. Hoist to module scope or memoize with useMemo().
Incorrect (new RegExp every render):
function Highlighter({ text, query }: Props) {
const regex = new RegExp(`(${query})`, "gi");
const parts = text.split(regex);
return <>{parts.map((part, i) => part)}</>;
}
Correct (memoize or hoist):
const EMAIL_REGEX = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
function Highlighter({ text, query }: Props) {
const regex = useMemo(() => new RegExp(`(${escapeRegex(query)})`, "gi"), [query]);
const parts = text.split(regex);
return <>{parts.map((part, i) => part)}</>;
}
Warning (global regex has mutable state):
Global regex (/g) has mutable lastIndex state:
const regex = /foo/g;
regex.test("foo"); // true, lastIndex = 3
regex.test("foo"); // false, lastIndex = 0