@keepsnappy/react-native 0.0.0-stage → 0.1.0-alpha.12

package/js/zustand-vanilla.js

@@ -0,0 +1,31 @@
+// zustand/vanilla in a PerfLab bundle. withKeepSnappy (metro.js) resolves every
+// `zustand/vanilla` request to this module (zustand 5's index, react and
+// traditional entries all load it by that name), and the name below to the real
+// one. Each store's setState goes through the cause tracker's store writer
+// (causes.ts storeWriter), also for the `set` its initializer and middleware
+// get. In a process that does not measure, stores are left as they are.
+'use strict';
+
+var real = require('@keepsnappy/react-native/zustand/vanilla');
+
+var wrap = function (createState) {
+  return function (set, get, api) {
+    var stores = globalThis.__PERFLAB_STORES__;
+    if (!stores) {
+      return createState(set, get, api);
+    }
+    var write = stores.writer(set);
+    api.setState = write;
+    return createState(write, get, api);
+  };
+};
+
+var createStore = function (createState) {
+  return createState
+    ? real.createStore(wrap(createState))
+    : function (later) {
+        return real.createStore(wrap(later));
+      };
+};
+
+module.exports = Object.assign({}, real, { createStore: createStore });

package/metro.js

@@ -0,0 +1,237 @@
+// withKeepSnappy(metroConfig): the only line an app adds to metro.config.js.
+//
+// With EXPO_PUBLIC_KEEPSNAPPY=1 it
+//  1. appends the React DevTools hook as a Metro polyfill, so the hook exists
+//     before any module (React included) evaluates;
+//  2. wraps the Babel transformer so the app's entry module imports the SDK boot
+//     module (Metro only runs pre-main modules that are already in the graph);
+//  3. lists the boot module in getModulesRunBeforeMainModule, so it runs right
+//     after InitializeCore and before the entry's own imports.
+//  4. resolves `zustand/vanilla` to js/zustand-vanilla.js, which routes every
+//     zustand store's setState through the cause tracker (REQ-MEAS-32 timers).
+// Without the flag it returns the config object untouched.
+//
+// KEEPSNAPPY_REACT_PROFILING=1 (independent of the flag) resolves React Native's
+// production renderer to its profiling build (fiber actualDuration /
+// selfBaseDuration, root.memoizedUpdaters), the same rewrite as
+// @callstack/inspector's withInspector. Nothing else in the bundle changes.
+//
+// KEEPSNAPPY_REACT_PROFILING=switch (flag on only) bundles both Fabric renderers
+// behind js/renderer-switch.js, which loads the profiling one only in a process
+// whose activation asked for it (plan 40 §2.1). Ignored with the flag off.
+
+const fs = require('fs');
+const path = require('path');
+
+const POLYFILL_PATH = path.join(__dirname, 'js', 'hook.polyfill.js');
+const BOOT_PATH = path.join(__dirname, 'js', 'sdk', 'boot.ts');
+const TRANSFORMER_PATH = path.join(__dirname, 'js', 'babel-transformer.js');
+
+const ENV_UPSTREAM = 'KEEPSNAPPY_UPSTREAM_BABEL_TRANSFORMER';
+const ENV_ENTRY = 'KEEPSNAPPY_ENTRY_FILE';
+const ENV_BOOT = 'KEEPSNAPPY_BOOT_FILE';
+
+const isEnabled = () => (process.env.EXPO_PUBLIC_KEEPSNAPPY) === '1';
+const isProfiling = () => (process.env.KEEPSNAPPY_REACT_PROFILING) === '1';
+const isSwitch = () => (process.env.KEEPSNAPPY_REACT_PROFILING) === 'switch';
+
+const SWITCH_PATH = path.join(__dirname, 'js', 'renderer-switch.js');
+// The names renderer-switch.js requires; they resolve next to RN's shim.
+const SDK_NAMES = ['@keepsnappy/react-native'];
+const SWITCH_TARGET_PREFIXES = SDK_NAMES.map(name => `${name}/renderer/`);
+const FABRIC_RENDERERS = new Set([
+  '../implementations/ReactFabric-prod',
+  '../implementations/ReactFabric-prod.js',
+  '../implementations/ReactFabric-profiling',
+  '../implementations/ReactFabric-profiling.js',
+]);
+
+const PROD_RENDERERS = {
+  '../implementations/ReactFabric-prod': '../implementations/ReactFabric-profiling',
+  '../implementations/ReactFabric-prod.js': '../implementations/ReactFabric-profiling.js',
+  '../implementations/ReactNativeRenderer-prod': '../implementations/ReactNativeRenderer-profiling',
+  '../implementations/ReactNativeRenderer-prod.js': '../implementations/ReactNativeRenderer-profiling.js',
+};
+
+const profilingModuleName = moduleName => PROD_RENDERERS[moduleName] ?? moduleName;
+
+function withReactProfiling(config) {
+  const resolver = config.resolver ?? {};
+  const upstream = resolver.resolveRequest;
+  return {
+    ...config,
+    resolver: {
+      ...resolver,
+      resolveRequest: (context, moduleName, platform) => {
+        const rewritten = profilingModuleName(moduleName);
+        return upstream
+          ? upstream(context, rewritten, platform)
+          : context.resolveRequest(context, rewritten, platform);
+      },
+    },
+  };
+}
+
+function withRendererSwitch(config) {
+  const resolver = config.resolver ?? {};
+  const upstream = resolver.resolveRequest;
+  const resolve = (context, moduleName, platform) =>
+    upstream
+      ? upstream(context, moduleName, platform)
+      : context.resolveRequest(context, moduleName, platform);
+  // RN's shim is always resolved before the switch module's own requires.
+  let shim = null;
+  return {
+    ...config,
+    resolver: {
+      ...resolver,
+      resolveRequest: (context, moduleName, platform) => {
+        const switchPrefix = SWITCH_TARGET_PREFIXES.find(prefix => moduleName.startsWith(prefix));
+        if (switchPrefix) {
+          if (!shim) {
+            throw new Error(`KeepSnappy: ${moduleName} required before React Native's renderer shim`);
+          }
+          const file = moduleName.slice(switchPrefix.length);
+          return resolve({ ...context, originModulePath: shim }, `../implementations/${file}`, platform);
+        }
+        if (FABRIC_RENDERERS.has(moduleName)) {
+          shim = context.originModulePath;
+          return { type: 'sourceFile', filePath: SWITCH_PATH };
+        }
+        return resolve(context, moduleName, platform);
+      },
+    },
+  };
+}
+
+const STORE_PATH = path.join(__dirname, 'js', 'zustand-vanilla.js');
+const STORE_MODULE = 'zustand/vanilla';
+// The name js/zustand-vanilla.js requires; it resolves to the app's own zustand.
+const STORE_TARGETS = SDK_NAMES.map(name => `${name}/${STORE_MODULE}`);
+
+// zustand 5 loads its vanilla module by package name from every entry, so one
+// name covers them. There is one wrapper module, so the app must have one
+// zustand copy: a request that resolves to another copy fails the build rather
+// than give that copy's entries a vanilla module of another version.
+function withStoreWrap(config) {
+  const resolver = config.resolver ?? {};
+  const upstream = resolver.resolveRequest;
+  const resolve = (context, moduleName, platform) =>
+    upstream
+      ? upstream(context, moduleName, platform)
+      : context.resolveRequest(context, moduleName, platform);
+  let real = null;
+  return {
+    ...config,
+    resolver: {
+      ...resolver,
+      resolveRequest: (context, moduleName, platform) => {
+        if (moduleName === STORE_MODULE) {
+          const found = resolve(context, STORE_MODULE, platform);
+          if (!real) {
+            real = found;
+          } else if (found.filePath !== real.filePath) {
+            throw new Error(
+              `KeepSnappy: two zustand copies (${real.filePath}, ${found.filePath}); the KeepSnappy store wrap needs one`,
+            );
+          }
+          return { type: 'sourceFile', filePath: STORE_PATH };
+        }
+        if (STORE_TARGETS.includes(moduleName)) {
+          if (!real) {
+            throw new Error(`KeepSnappy: ${moduleName} required before ${STORE_MODULE}`);
+          }
+          return real;
+        }
+        return resolve(context, moduleName, platform);
+      },
+    },
+  };
+}
+
+const SOURCE_EXTS = ['.ts', '.tsx', '.js', '.jsx', '.mjs', '.cjs'];
+
+const resolveEntry = projectRoot => {
+  let main = 'index';
+  try {
+    const pkg = JSON.parse(
+      fs.readFileSync(path.join(projectRoot, 'package.json'), 'utf8'),
+    );
+    if (typeof pkg.main === 'string') {
+      main = pkg.main;
+    }
+  } catch {
+    // no package.json main: Metro's own default is index
+  }
+  const base = path.resolve(projectRoot, main);
+  if (fs.existsSync(base) && fs.statSync(base).isFile()) {
+    return base;
+  }
+  for (const ext of SOURCE_EXTS) {
+    if (fs.existsSync(base + ext)) {
+      return base + ext;
+    }
+  }
+  return null;
+};
+
+function withKeepSnappy(input) {
+  if (!isEnabled()) {
+    return isProfiling() ? withReactProfiling(input) : input;
+  }
+  let config = input;
+  if (isProfiling()) {
+    config = withReactProfiling(input);
+  } else if (isSwitch()) {
+    config = withRendererSwitch(input);
+  }
+  config = withStoreWrap(config);
+  const projectRoot = config.projectRoot ?? process.cwd();
+  const entry = resolveEntry(projectRoot);
+  const upstream = config.transformer?.babelTransformerPath;
+  if (!entry || !upstream) {
+    throw new Error(
+      `KeepSnappy: cannot ${entry ? 'find transformer.babelTransformerPath' : 'resolve the entry file from package.json main'}`,
+    );
+  }
+
+  // Transform workers are forked after the config loads and inherit this env.
+  process.env[ENV_UPSTREAM] = upstream;
+  process.env[ENV_ENTRY] = entry;
+  process.env[ENV_BOOT] = BOOT_PATH;
+
+  const serializer = config.serializer ?? {};
+  const upstreamPolyfills = serializer.getPolyfills;
+  const upstreamPreMain = serializer.getModulesRunBeforeMainModule;
+
+  return {
+    ...config,
+    serializer: {
+      ...serializer,
+      getPolyfills: options => [
+        ...(upstreamPolyfills ? upstreamPolyfills(options) : []),
+        POLYFILL_PATH,
+      ],
+      getModulesRunBeforeMainModule: entryFilePath => [
+        ...(upstreamPreMain ? upstreamPreMain(entryFilePath) : []),
+        BOOT_PATH,
+      ],
+    },
+    transformer: {
+      ...config.transformer,
+      babelTransformerPath: TRANSFORMER_PATH,
+    },
+  };
+}
+
+module.exports = {
+  withKeepSnappy,
+  withReactProfiling,
+  withRendererSwitch,
+  withStoreWrap,
+  profilingModuleName,
+  STORE_PATH,
+  SWITCH_PATH,
+  POLYFILL_PATH,
+  BOOT_PATH,
+};

package/package.json

@@ -1,6 +1,28 @@
 {
   "name": "@keepsnappy/react-native",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.1.0-alpha.12",
+  "description": "KeepSnappy in-app SDK for React Native / Expo: zero-code measurement windows, React commit hook, native signposts and log file",
+  "license": "UNLICENSED",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/arekkubaczkowski/keepsnappy.git",
+    "directory": "packages/react-native"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "app.plugin.js",
+    "metro.js",
+    "expo-module.config.json",
+    "js",
+    "ios",
+    "android/build.gradle",
+    "android/src",
+    "README.md"
+  ],
+  "peerDependencies": {
+    "expo": "*",
+    "react-native": "*"
+  }
+}