@keepsnappy/react-native 0.1.0-alpha.14 → 0.1.0-alpha.16

package/README.md

@@ -19,6 +19,18 @@ const { withKeepSnappy } = require('@keepsnappy/react-native/metro');
 module.exports = withKeepSnappy(config);
 ```
 
+Shared client packages can opt into component keys:
+
+```js
+module.exports = withKeepSnappy(config, { clientPackages: ['@my-app/ui'] });
+```
+
+With the flag on, `.js/.jsx/.ts/.tsx` files inside the real project root, outside `node_modules`, and owned by the root package count as client code. Another package (including a workspace sibling or linked SDK) counts only when its name is in `clientPackages` (default `[]`). Package keys use `<package>/<path inside it>`, never a parent-relative path.
+
+A plugin in the client's own Babel pipeline stamps only module-scope named functions, React component classes, function-valued constants and outer `memo`/`forwardRef` bindings. Nested declarations and anonymous default exports remain unstamped. An unsupported instrumentation path falls back to the client's transform. The key is `Name@file`; the file part uses `encodeURIComponent`, keeps `/` and `@` readable, and additionally encodes `~`. Names support uppercase/titlecase Unicode identifiers. Parsing accepts only the exact canonical encoding. `@keepsnappy/facts` owns the grammar and fragment schema. The SDK's small build-time encoder is pinned by a round-trip test through facts, without adding a private workspace dependency to the shipped SDK.
+
+Workers write atomic, content-addressed fragments under `.keepsnappy/components/`, with source paths relative to the project root. Metro excludes that directory from its resolver. `keepsnappy sourcemaps upload` sends source maps first, then prepares sorted `.keepsnappy/components.json`; component-map errors only print a warning. Use `--project-root PATH` for a moved checkout. Each configuration has its own `.config.json`; when several exist, select its directory name with `--components-config ID`. Keep this build-output directory out of version control. The map's upload awaits API support.
+
 `app.config.js` / `app.json`:
 
 ```js

package/js/babel-transformer.js

@@ -1,5 +1,5 @@
-// Wraps the app's Babel transformer (set by withKeepSnappy) and adds one import to
-// the entry module: the keepsnappy boot module. That import is what puts the SDK
+// Wraps the app's Babel transformer (set by withKeepSnappy), stamps client
+// declarations and imports the keepsnappy boot module in the entry. That import puts the SDK
 // in the graph; getModulesRunBeforeMainModule then runs it before the entry.
 //
 // babel-preset-expo inlines EXPO_PUBLIC_* only outside node_modules, and the
@@ -12,6 +12,9 @@ const upstreamPath = (process.env.KEEPSNAPPY_UPSTREAM_BABEL_TRANSFORMER);
 const entryFile = (process.env.KEEPSNAPPY_ENTRY_FILE);
 const bootFile = (process.env.KEEPSNAPPY_BOOT_FILE);
 const sdkVersion = process.env.KEEPSNAPPY_SDK_VERSION;
+const clientPackages = JSON.parse(process.env.KEEPSNAPPY_CLIENT_PACKAGES ?? '[]');
+const projectRoot = process.env.KEEPSNAPPY_PROJECT_ROOT;
+const componentCacheKey = process.env.KEEPSNAPPY_COMPONENT_CACHE_KEY ?? '';
 
 if (!upstreamPath || !entryFile || !bootFile || !sdkVersion) {
   throw new Error(
@@ -53,23 +56,38 @@ const absolute = (filename, options) =>
 module.exports = {
   ...upstream,
   transform(args) {
+    if (process.env.EXPO_PUBLIC_KEEPSNAPPY !== '1') return upstream.transform(args);
     const file = absolute(args.filename, args.options);
+    const original = args;
     if (file === entryFile) {
-      return upstream.transform({ ...args, src: bootImport() + args.src });
+      args = { ...args, src: bootImport() + args.src };
     }
     if (file.startsWith(packageRoot)) {
       const src = file === path.join(packageRoot, 'js', 'sdk', 'push-install.ts')
         ? args.src.replace("require('../../package.json')", JSON.stringify({ version: sdkVersion }))
         : args.src;
-      return upstream.transform({ ...args, src: inlineEnv(src) });
+      args = { ...args, src: inlineEnv(src) };
     }
-    return upstream.transform(args);
+    let stamps;
+    try {
+      stamps = require('./component-stamps.js').instrumentation(
+        original.src, file, args.options?.projectRoot ?? projectRoot ?? process.cwd(), clientPackages, file === entryFile ? 1 : 0,
+      );
+    } catch { return upstream.transform(args); }
+    if (!stamps) return upstream.transform(args);
+    const complete = result => { stamps.complete(); return result; };
+    const passthrough = () => { stamps.complete(true); return upstream.transform(args); };
+    try {
+      const result = upstream.transform({ ...args, plugins: [stamps.plugin, ...(args.plugins ?? [])] });
+      return result && typeof result.then === 'function'
+        ? result.then(complete, passthrough) : complete(result);
+    } catch { return passthrough(); }
   },
   getCacheKey(...args) {
     const base =
       typeof upstream.getCacheKey === 'function'
         ? upstream.getCacheKey(...args)
         : '';
-    return `${base}$keepsnappy:${entryFile}:${bootFile}:${sdkVersion}:${envSignature()}`;
+    return `${base}$keepsnappy:${entryFile}:${bootFile}:${sdkVersion}:${envSignature()}:components-v2:${JSON.stringify(clientPackages)}:${componentCacheKey}`;
   },
 };

package/js/component-contract.cjs

@@ -0,0 +1,14 @@
+// Build-time copy of @keepsnappy/facts. The SDK ships without the
+// private facts workspace; Metro's round-trip test pins this encoder to it.
+const FRAGMENT_VERSION = 2;
+const isComponentName = name => typeof name === 'string' && /^[\p{Lu}\p{Lt}][\p{ID_Continue}$\u200C\u200D]*$/u.test(name);
+function componentKey(name, file) {
+  if ((name !== 'default' && !isComponentName(name)) || typeof file !== 'string' || !file
+    || /^(?:\/|[A-Za-z]:)/.test(file) || file.includes('\\')
+    || file.split('/').some(part => part === '..' || part === '.' || part === '')) {
+    throw new Error('invalid client component name or file');
+  }
+  const encoded = encodeURIComponent(file).replace(/%2F/g, '/').replace(/%40/g, '@').replace(/~/g, '%7E');
+  return `${name}@${encoded}`;
+}
+module.exports = { FRAGMENT_VERSION, componentKey, isComponentName };

package/js/component-stamps.js

@@ -0,0 +1,192 @@
+const fs = require('fs');
+const path = require('path');
+const { createHash, randomUUID } = require('crypto');
+const { FRAGMENT_VERSION, componentKey, isComponentName } = require('./component-contract.cjs');
+
+const hash = value => createHash('sha256').update(value).digest('hex');
+const posix = value => value.replace(/\\/g, '/');
+const realPath = file => {
+  try { return fs.realpathSync(file); }
+  catch (error) {
+    if (error.code !== 'ENOENT') throw error;
+    return path.resolve(file);
+  }
+};
+
+function atomicJson(file, value) {
+  fs.mkdirSync(path.dirname(file), { recursive: true });
+  const temporary = `${file}.${process.pid}.${randomUUID()}.tmp`;
+  try {
+    fs.writeFileSync(temporary, JSON.stringify(value));
+    fs.renameSync(temporary, file);
+  } finally { fs.rmSync(temporary, { force: true }); }
+}
+
+const configuration = clientPackages => hash(JSON.stringify([FRAGMENT_VERSION, clientPackages]));
+const contexts = new Map();
+function context(projectRoot) {
+  const absolute = path.resolve(projectRoot);
+  if (contexts.has(absolute)) return contexts.get(absolute);
+  const root = realPath(absolute);
+  const owners = new Map();
+  const owningPackage = directory => {
+    if (owners.has(directory)) return owners.get(directory);
+    let owner;
+    try {
+      const pkg = JSON.parse(fs.readFileSync(path.join(directory, 'package.json'), 'utf8'));
+      if (typeof pkg.name === 'string') owner = { name: pkg.name, directory };
+    } catch (error) {
+      if (error.code !== 'ENOENT' && !(error instanceof SyntaxError)) throw error;
+    }
+    if (!owner) {
+      const parent = path.dirname(directory);
+      owner = parent === directory ? null : owningPackage(parent);
+    }
+    owners.set(directory, owner);
+    return owner;
+  };
+  const value = { root, owningPackage, projectPackage: owningPackage(root)?.name };
+  contexts.set(absolute, value);
+  return value;
+}
+
+function configure(projectRoot, clientPackages) {
+  context(projectRoot);
+  const directory = configuration(clientPackages);
+  const selected = path.join(projectRoot, '.keepsnappy', 'components', directory);
+  fs.mkdirSync(selected, { recursive: true });
+  const cacheFile = path.join(selected, '.cache-key');
+  try { fs.writeFileSync(cacheFile, randomUUID(), { flag: 'wx' }); }
+  catch (error) { if (error.code !== 'EEXIST') throw error; }
+  atomicJson(path.join(selected, '.config.json'), { version: FRAGMENT_VERSION, directory });
+  return fs.readFileSync(cacheFile, 'utf8');
+}
+
+function clientFile(filename, projectRoot, clientPackages) {
+  if (!/\.[jt]sx?$/.test(filename)) return null;
+  const source = realPath(filename);
+  if (source.split(path.sep).includes('node_modules') && clientPackages.length === 0) return null;
+  const { root, owningPackage, projectPackage } = context(projectRoot);
+  const pkg = owningPackage(path.dirname(source));
+  const relative = posix(path.relative(root, source));
+  if (pkg && clientPackages.includes(pkg.name)) {
+    return { source: relative, file: `${pkg.name}/${posix(path.relative(pkg.directory, source))}` };
+  }
+  if (relative.startsWith('../') || path.isAbsolute(relative) || source.split(path.sep).includes('node_modules')) return null;
+  if (pkg && pkg.name !== projectPackage) return null;
+  return { source: relative, file: relative };
+}
+
+const reactMember = (node, names) => node?.type === 'Identifier'
+  ? names.includes(node.name)
+  : node?.type === 'MemberExpression' && !node.computed && node.object.type === 'Identifier'
+    && node.object.name === 'React' && names.includes(node.property.name);
+const unwrap = node => {
+  while (['TSAsExpression', 'TSSatisfiesExpression', 'TSNonNullExpression', 'TypeCastExpression', 'ParenthesizedExpression'].includes(node?.type)) node = node.expression;
+  return node;
+};
+const componentValue = node => {
+  node = unwrap(node);
+  return node?.type === 'ArrowFunctionExpression' || node?.type === 'FunctionExpression'
+    || (node?.type === 'CallExpression' && reactMember(node.callee, ['memo', 'forwardRef']));
+};
+
+const jsxResult = node => {
+  node = unwrap(node);
+  if (!node) return false;
+  if (['JSXElement', 'JSXFragment'].includes(node.type)) return true;
+  if (node.type === 'ConditionalExpression') return jsxResult(node.consequent) || jsxResult(node.alternate);
+  if (node.type === 'LogicalExpression') return jsxResult(node.right) || (node.operator !== '&&' && jsxResult(node.left));
+  if (node.type === 'SequenceExpression') return jsxResult(node.expressions.at(-1));
+  return false;
+};
+const returnsJSX = (body, t) => {
+  if (body.type !== 'BlockStatement') return jsxResult(body);
+  const visit = node => {
+    if (!node || t.isFunction(node) || t.isClass(node)) return false;
+    if (node.type === 'ReturnStatement') return jsxResult(node.argument);
+    return (t.VISITOR_KEYS[node.type] ?? []).some(key => {
+      const child = node[key];
+      return Array.isArray(child) ? child.some(visit) : visit(child);
+    });
+  };
+  return visit(body);
+};
+const anonymousRender = (node, t) => {
+  node = unwrap(node);
+  if (node?.type === 'CallExpression' && reactMember(node.callee, ['memo', 'forwardRef'])) return anonymousRender(node.arguments[0], t);
+  return ['FunctionDeclaration', 'FunctionExpression', 'ArrowFunctionExpression'].includes(node?.type)
+    && !node.id && !node.async && !node.generator && returnsJSX(node.body, t);
+};
+
+function instrumentation(src, filename, projectRoot, clientPackages, lineOffset = 0) {
+  const client = clientFile(filename, projectRoot, clientPackages);
+  if (!client) return null;
+  const components = [];
+  const contentHash = hash(src);
+  const target = path.join(projectRoot, '.keepsnappy', 'components', configuration(clientPackages), `${hash(client.source)}-${contentHash}.json`);
+  const plugin = ({ types: t }) => ({
+    name: 'keepsnappy-components',
+    visitor: {
+      Program(program) {
+        // Inspect the original module body once, before preset visitors lower declarations.
+        for (const statement of program.get('body')) {
+          const node = statement.node;
+          const declaration = ['ExportNamedDeclaration', 'ExportDefaultDeclaration'].includes(node.type) ? node.declaration : node;
+          if (!declaration || declaration.declare) continue;
+          const found = [];
+          if (declaration.type === 'FunctionDeclaration' && isComponentName(declaration.id?.name)) found.push(declaration.id);
+          else if (declaration.type === 'ClassDeclaration' && isComponentName(declaration.id?.name)
+            && reactMember(declaration.superClass, ['Component', 'PureComponent'])) found.push(declaration.id);
+          else if (declaration.type === 'VariableDeclaration' && declaration.kind === 'const') {
+            for (const binding of declaration.declarations) {
+              if (binding.id.type === 'Identifier' && isComponentName(binding.id.name) && componentValue(binding.init)) found.push(binding.id);
+            }
+          }
+          let defaultId;
+          if (node.type === 'ExportDefaultDeclaration' && (
+            anonymousRender(declaration, t) || (declaration.type === 'ClassDeclaration' && !declaration.id
+              && reactMember(declaration.superClass, ['Component', 'PureComponent']))
+          )) {
+            // Only real component defaults gain an uppercase binding.
+            let name = 'KeepSnappyDefault';
+            while (program.scope.hasBinding(name) || program.scope.hasGlobal(name) || program.scope.hasReference(name)) name += '_';
+            defaultId = t.identifier(name);
+            defaultId.loc = declaration.loc;
+            if (['FunctionDeclaration', 'ClassDeclaration'].includes(declaration.type)) {
+              // Keep declarations in place, including function hoisting through circular imports.
+              declaration.id = defaultId;
+            } else {
+              statement.insertBefore(t.variableDeclaration('const', [t.variableDeclarator(defaultId, declaration)]));
+              statement.get('declaration').replaceWith(t.cloneNode(defaultId));
+            }
+            found.push(defaultId);
+            program.scope.crawl();
+          }
+          const stamps = [];
+          for (const id of found) {
+            const componentName = id === defaultId ? 'default' : id.name;
+            const key = componentKey(componentName, client.file);
+            components.push({ key, name: componentName, file: client.file, line: Math.max(1, id.loc.start.line - lineOffset) });
+            const name = () => t.identifier(id.name);
+            const typeIs = value => t.binaryExpression('===', t.unaryExpression('typeof', name()), t.stringLiteral(value));
+            stamps.push(t.ifStatement(t.logicalExpression('||', typeIs('function'), t.logicalExpression('&&',
+              t.binaryExpression('!==', name(), t.nullLiteral()), typeIs('object'))),
+            t.expressionStatement(t.assignmentExpression('=', t.memberExpression(name(), t.identifier('__ks')), t.stringLiteral(key)))));
+          }
+          if (stamps.length) statement.insertAfter(stamps);
+        }
+      },
+    },
+  });
+  return {
+    plugin,
+    complete(skipped = false) {
+      // Inventory output is optional; source compilation must remain usable on write failures.
+      try { atomicJson(target, { version: FRAGMENT_VERSION, source: client.source, hash: contentHash, components: skipped ? [] : components }); }
+      catch { /* The CLI reports an unavailable inventory without blocking source maps. */ }
+    },
+  };
+}
+
+module.exports = { configure, instrumentation };

package/js/sdk/bytes.ts

@@ -0,0 +1,20 @@
+// The push queue drops a window line over this many bytes (push.ts enqueue). The window summary budgets against half of it.
+export const MAX_BATCH_BYTES = 256 * 1024;
+
+export const utf8Length = (text: string) => {
+  let n = 0;
+  for (let i = 0; i < text.length; i++) {
+    const c = text.charCodeAt(i);
+    if (c < 0x80) {
+      n += 1;
+    } else if (c < 0x800) {
+      n += 2;
+    } else if (c >= 0xd800 && c <= 0xdbff) {
+      n += 4;
+      i++;
+    } else {
+      n += 3;
+    }
+  }
+  return n;
+};

package/js/sdk/core.ts

@@ -1,6 +1,8 @@
 // keepsnappy core: settings, windows, the commit walk, observers, faults, logs.
 // Loaded by boot.ts, which Metro runs before the app's entry module.
 
+import { setPlaceLog } from './place';
+
 import {
   type ActivationStore,
   type Decision,
@@ -12,6 +14,8 @@ import {
 } from './activation';
 import {
   componentName,
+  clientKeyOf,
+  OUTSIDE_APP,
   type Fiber,
   type FiberRoot,
   isComponentTag,
@@ -66,6 +70,7 @@ import {
   type ProfiledFiber,
   type ProfiledRoot,
   recordFiber,
+  recordRolledUp,
   selfMs,
   summarizeWindowProfile,
   totalMs,
@@ -364,6 +369,8 @@ export const perfLog = (message: string, sink: LogSink = settings.log) => {
     }
   }
 };
+setPlaceLog(perfLog);
+
 
 // Requests started per window (fetch/XHR hooks in net-install.ts feed it).
 export const net = createNetCounter({ now, onStart: noteRequestSent });
@@ -611,6 +618,8 @@ const diffStats = (
 export type WindowKind = 'marker' | 'press' | 'screen' | 'background';
 
 interface MarkerWindow {
+  legacyName: string | null;
+  beforeEnd: (() => void) | null;
   id: number;
   key: string;
   name: string;
@@ -839,9 +848,12 @@ export const lastCommitAt = (key: string) =>
 export const isWindowOpen = (key?: string) =>
   key ? openWindows.has(key) : openWindows.size > 0;
 
-const traceName = (name: string) => `keepsnappy:${name}`;
+const traceName = (name: string) => `keepsnappy:${name}`.slice(0, 120);
+const fileNamePart = (name: string) => name.replace(/[^\w.:+-]/g, '_').slice(0, 64);
 
 interface StartOptions {
+  legacyName?: string | null;
+  beforeEnd?: () => void;
   key?: string;
   kind?: WindowKind;
   // Backdates t0 (e.g. to the hardware touch time). performance.now() timebase.
@@ -879,6 +891,8 @@ const backgroundWindow = (source: string, t: number): MarkerWindow => {
     key: name,
     name,
     kind: 'background',
+    legacyName: null,
+    beforeEnd: null,
     trace: traceName(name),
     t0: t,
     t1: null,
@@ -990,6 +1004,8 @@ const start = (name: string, options: StartOptions = {}) => {
     key,
     name,
     kind: options.kind ?? 'marker',
+    legacyName: options.legacyName ?? null,
+    beforeEnd: options.beforeEnd ?? null,
     trace: traceName(name),
     t0: startT,
     t1: null,
@@ -1043,6 +1059,7 @@ const end = (key: string, reason = 'end', at?: number) => {
   if (!window) {
     return;
   }
+  window.beforeEnd?.();
   window.t1 = at ?? now();
   window.endReason = reason;
   openWindows.delete(key);
@@ -1086,8 +1103,9 @@ const endAll = (reason: string) => {
   }
 };
 
-const rename = (key: string, name: string) => {
+const rename = (key: string, name: string, legacyName?: string | null) => {
   const window = openWindows.get(key);
+  if (window && legacyName !== undefined) window.legacyName = legacyName;
   if (window && window.name !== name) {
     perfLog(`PERF_MARK ${window.name} renamed=${name} id=${window.id}`);
     window.name = name;
@@ -1135,30 +1153,43 @@ const walkCommit = (
   causes: CommitCauses,
 ) => {
   const stack: Fiber[] = [root.current];
+  const owners: string[] = [OUTSIDE_APP];
+  const parents: (string | null)[] = [null];
   const renders: Record<string, number> = {};
   let mounts = 0;
   let visited = 0;
   const ancestors = exported ? createAncestorPaths() : null;
   while (stack.length > 0) {
     const fiber = stack.pop() as Fiber;
+    const inherited = owners.pop() as string;
+    const inheritedParent = parents.pop() as string | null;
+    let owner = inherited, parentOfOwner = inheritedParent;
     visited++;
     const mounted = fiber.alternate === null;
     if (mounted) {
       noteMounted(fiber);
     }
     noteHostFiber(fiber, causes);
-    if (isComponentTag(fiber.tag) && (fiber.flags & PERFORMED_WORK) !== 0) {
+    const component = isComponentTag(fiber.tag);
+    const own = component ? clientKeyOf(fiber) : null;
+    if (own !== null) {
+      owner = own;
+      parentOfOwner = inherited === OUTSIDE_APP ? null : inherited;
+    }
+    if (component && (fiber.flags & PERFORMED_WORK) !== 0) {
       const name = componentName(fiber);
       renders[name] = (renders[name] ?? 0) + 1;
       if (mounted) {
         mounts++;
       }
-      if (profile || exported) {
+      if ((profile && own !== null) || exported) {
         const cause = updateCause(fiber as ProfiledFiber);
-        if (profile) {
-          recordFiber(profile, name, fiber as ProfiledFiber, cause, fiberId(fiber));
+        if (profile && own !== null) {
+          recordFiber(profile, own, fiber as ProfiledFiber, cause, fiberId(fiber), parentOfOwner);
         }
         if (exported) {
+          // Profiled exports assign the rendered id before fresh ancestor ids.
+          if (profile && own === null) fiberId(fiber);
           exported.fibers.push(
             exportFiber(
               fiber,
@@ -1167,10 +1198,14 @@ const walkCommit = (
               totalMs(fiber as ProfiledFiber),
               selfMs(fiber as ProfiledFiber),
               (ancestors as (f: Fiber) => number[])(fiber),
+              owner,
             ),
           );
         }
       }
+      if (profile && own === null) {
+        recordRolledUp(profile, inherited, inheritedParent, name, fiber as ProfiledFiber);
+      }
     }
     // Children not cloned in this render are the previous commit's fibers and
     // carry stale flags, so a bailed-out subtree is skipped entirely.
@@ -1180,6 +1215,8 @@ const walkCommit = (
     }
     for (let child = fiber.child; child !== null; child = child.sibling) {
       stack.push(child);
+      owners.push(owner);
+      parents.push(parentOfOwner);
     }
   }
   return { renders, mounts, visited };
@@ -1217,7 +1254,7 @@ const onCommitFiberRoot = (rendererId: number, root: FiberRoot) => {
     // The figure `profile.renderMs` reads; null when the renderer does not time commits.
     renderMs = isProfilingFiber(profiled.current) ? totalMs(profiled.current) : null;
     if (settings.profile) {
-      profile = createCommitProfile(profiled, seq);
+      profile = createCommitProfile(profiled, seq, t0);
     }
     // Only commits a window can take are exported (open now, or backfilled
     // into a window opened later with a backdated start).
@@ -1477,7 +1514,7 @@ const netForWindow = (window: MarkerWindow): NetWindow | null =>
   window.net ? net.windowClose(window.id) : null;
 
 const reactExportName = (window: MarkerWindow) =>
-  `react-${PROCESS_ID}-${window.id}-${window.name.replace(/[^\w.:+-]/g, '_')}.json`;
+  `react-${PROCESS_ID}-${window.id}-${fileNamePart(window.name)}.json`;
 
 interface PendingExport {
   name: string;
@@ -1720,7 +1757,7 @@ const finalizeWindow = (window: MarkerWindow) => {
   // Sampler first: its records carry the display rate the frame budget needs.
   const sampler = samplerForWindow(window);
   const profile = window.profile
-    ? summarizeWindowProfile(window.profile, { budget: frameBudget })
+    ? summarizeWindowProfile(window.profile, { budget: frameBudget, t0: window.t0 })
     : null;
   const perf = settings.po ? summarizeEntries(window) : null;
   noteBudgetBreak(
@@ -1734,6 +1771,7 @@ const finalizeWindow = (window: MarkerWindow) => {
     windowModel: WINDOW_MODEL,
     id: window.id,
     name: window.name,
+    ...(window.legacyName !== null && window.legacyName !== window.name ? { legacyName: window.legacyName } : {}),
     kind: window.kind,
     t0: window.t0,
     t1: window.t1,
@@ -1799,7 +1837,7 @@ const writeWindowRecord = (window: MarkerWindow, summary: Record<string, unknown
   windowListener?.(`${Date.now()} KEEPSNAPPY window ${json}`);
   if (settings.file) {
     const path = getNative()?.writeText(
-      `window-${window.id}-${window.name.replace(/[^\w.:+-]/g, '_')}.json`,
+      `window-${window.id}-${fileNamePart(window.name)}.json`,
       json,
     );
     perfLog(`window file id=${window.id} path=${path ?? 'unavailable'}`);
@@ -1839,13 +1877,14 @@ const externalSummary = (window: MarkerWindow, timed: boolean) => {
 
 const finalizeBackground = (window: MarkerWindow) => {
   const profile = window.profile
-    ? summarizeWindowProfile(window.profile, { budget: frameBudget })
+    ? summarizeWindowProfile(window.profile, { budget: frameBudget, t0: window.t0 })
     : null;
   writeWindowRecord(window, {
     v: 1,
     windowModel: WINDOW_MODEL,
     id: window.id,
     name: window.name,
+    ...(window.legacyName !== null && window.legacyName !== window.name ? { legacyName: window.legacyName } : {}),
     kind: window.kind,
     t0: window.t0,
     t1: window.t1,
@@ -1903,11 +1942,13 @@ const leakJsHeap = (mb: number) => {
   leakState.retainedMB += mb;
 };
 
-export const isFaultTarget = (windowName: string) =>
-  settings.faultTarget
+export const isFaultTarget = (press: { name: string; legacyName: string; target: { testID: string | null; accessibilityLabel: string | null } }) => {
+  const names = [press.name, press.legacyName, press.target.testID, press.target.accessibilityLabel];
+  return settings.faultTarget
     .split(',')
     .map(part => part.trim())
-    .some(part => part !== '' && windowName.includes(part));
+    .some(part => part !== '' && names.some(name => name?.includes(part)));
+};
 
 export const runOpenFaults = (where: string) => {
   const faults = settings.faults;

package/js/sdk/device-model.ts

@@ -0,0 +1,10 @@
+// The model a device reports to the API: what the OS calls the hardware, never the marketing name. expo-device's `modelId` is an
+// iPhone's machine id ("iPhone17,1") and null on Android, where `modelName` is already Build.MODEL ("SM-S911B"); `modelName` on iOS
+// is the marketing name, so the id comes first. A simulator keeps its name: there `modelId` is the host's `uname` machine ("arm64")
+// and `modelName` is "Simulator iOS" (an emulator's Build.MODEL carries the word the API reads the device kind from).
+export const deviceModelOf = (device: { isDevice?: boolean | null; modelId?: string | null; modelName?: string | null }): string | null => {
+  const modelId = /^(arm64|x86_64|i386)$/i.test(device.modelId ?? '') && device.isDevice === false ? null : device.modelId;
+  if (device.isDevice !== false) return modelId || device.modelName || null;
+  const model = device.modelName || modelId;
+  return model ? /(simulator|emulator|sdk_gphone|android sdk built for)/i.test(model) ? model : `${model} Simulator` : null;
+};