json-as 1.1.26 → 1.2.0

package/scripts/build-chart03.ts

@@ -0,0 +1,139 @@
+import fs from "fs";
+import path from "path";
+import { ChartJSNodeCanvas } from "chartjs-node-canvas";
+import ChartDataLabels from "chartjs-plugin-datalabels";
+import type { ChartConfiguration } from "chart.js";
+
+const LOGS_DIR = "./build/logs";
+
+/**
+ * Load a bench log JSON by file path
+ */
+function loadJSON(file: string) {
+  const text = fs.readFileSync(file, "utf-8");
+  return JSON.parse(text);
+}
+
+/**
+ * Get throughput (mbps) and size (bytes) from a bench log
+ */
+function getBenchData(filePath: string) {
+  const data = loadJSON(filePath);
+  return {
+    bytes: typeof data.bytes === "number" ? data.bytes : 0,
+    mbps: typeof data.mbps === "number" ? data.mbps : 0,
+  };
+}
+
+/* ================================
+ * Payload Types — only strings
+ * ================================ */
+const payloads = ["small-str", "medium-str", "large-str"];
+const engines = ["swar", "simd"];
+const modes = ["serialize", "deserialize"];
+
+// Helper to build log file path
+function logPath(payload: string, engine: string, mode: string) {
+  return path.join(LOGS_DIR, "as", engine, `${payload}.${mode}.as.json`);
+}
+
+/* ================================
+ * Prepare Chart Data
+ * ================================ */
+interface ChartPoint { x: number; y: number; }
+const chartData: Record<string, ChartPoint[]> = {};
+
+for (const payload of payloads) {
+  for (const engine of engines) {
+    for (const mode of modes) {
+      const key = `${payload}-${engine}-${mode}`;
+      const data = getBenchData(logPath(payload, engine, mode));
+      const sizeKB = data.bytes / 1024;
+
+      if (!chartData[key]) chartData[key] = [];
+      chartData[key].push({ x: sizeKB, y: data.mbps });
+    }
+  }
+}
+
+/* ================================
+ * Configure Chart
+ * ================================ */
+const canvas = new ChartJSNodeCanvas({
+  width: 1200,
+  height: 700,
+  chartCallback: ChartJS => ChartJS.register(ChartDataLabels),
+});
+
+const colors: Record<string, string> = {
+  "swar-serialize": "34,197,94",    // green
+  "swar-deserialize": "59,130,246", // blue
+  "simd-serialize": "234,179,8",    // yellow
+  "simd-deserialize": "220,38,38",  // red
+};
+
+
+const datasets = [];
+
+for (const mode of modes) {
+  for (const engine of engines) {
+    const data: ChartPoint[] = payloads.map(p => chartData[`${p}-${engine}-${mode}`][0]);
+    datasets.push({
+      label: `${engine} ${mode}`,
+      data,
+      borderColor: `rgba(${colors[engine + "-" + mode]},0.9)`,
+      backgroundColor: `rgba(${colors[engine+"-"+mode]},0.3)`,
+      fill: false,
+      tension: 0.2,
+      pointStyle: mode === "serialize" ? "circle" : "rect",
+      pointRadius: 6,
+      borderDash: engine === "simd" ? [5, 5] : undefined,
+    });
+  }
+}
+
+
+/* ================================
+ * Chart Configuration
+ * ================================ */
+const config: ChartConfiguration<"line"> = {
+  type: "line",
+  data: { datasets },
+  options: {
+    responsive: true,
+    plugins: {
+      title: {
+        display: true,
+        text: "String Serialization & Deserialization Throughput vs Payload Size (KB)",
+        font: { size: 20, weight: "bold" },
+      },
+      legend: { position: "top", labels: { font: { size: 14, weight: "bold" } } },
+      datalabels: {
+        anchor: "end",
+        align: "top",
+        font: { size: 10, weight: "bold" },
+        formatter: (value: any) => `${value.y.toFixed(0)} MB/s`,
+      },
+    },
+    scales: {
+      x: {
+        title: { display: true, text: "Payload Size (KB)", font: { size: 16, weight: "bold" } },
+        type: "linear",
+      },
+      y: {
+        title: { display: true, text: "Throughput (MB/s)", font: { size: 16, weight: "bold" } },
+        beginAtZero: true,
+      },
+    },
+  },
+  plugins: [ChartDataLabels],
+};
+
+/* ================================
+ * Render Chart to PNG
+ * ================================ */
+console.log("Rendering chart03 for strings (serialize + deserialize)...");
+const buffer = canvas.renderToBufferSync(config, "image/png");
+const outFile = path.join(LOGS_DIR, "chart03.png");
+fs.writeFileSync(outFile, buffer);
+console.log(`chart03.png written → ${outFile}`);

package/scripts/build-chart05.ts

@@ -0,0 +1,47 @@
+import { getBenchResults, createLineChart, generateChart, BenchResults } from './lib/bench-utils';
+
+const PAYLOADS_BY_TYPE: Record<string, string[]> = {
+  object: ['smallObj', 'mediumObj', 'largeObj'],
+  array: ['smallArr', 'mediumArr', 'largeArr'],
+  string: ['smallStr', 'mediumStr', 'largeStr']
+};
+
+const payloadLabels: Record<string, string> = {
+  smallObj: 'Small Object',
+  mediumObj: 'Medium Object',
+  largeObj: 'Large Object',
+  smallArr: 'Small Array',
+  mediumArr: 'Medium Array',
+  largeArr: 'Large Array',
+  smallStr: 'Small String',
+  mediumStr: 'Medium String',
+  largeStr: 'Large String'
+};
+
+// Load all payloads
+const allPayloads = Object.values(PAYLOADS_BY_TYPE).flat();
+const results: BenchResults = getBenchResults(allPayloads);
+
+// Generate datasets per type
+const series = Object.entries(PAYLOADS_BY_TYPE).flatMap(([type, keys]) => {
+  const engines = ['JS', 'SWAR', 'SIMD'] as const;
+
+  return engines.map((engine, idx) => ({
+    label: `${type} (${engine})`,
+    data: keys.map(k => results[k].serialize[idx].mbps),
+    borderColor: engine === 'JS' ? '#6366f1' : engine === 'SWAR' ? '#22c55e' : '#ef4444'
+  }));
+});
+
+// Create chart
+const chartConfig = createLineChart(
+  ['small', 'medium', 'large'],
+  series,
+  {
+    title: 'Serialization Throughput by Type',
+    xLabel: 'Payload Size',
+    yLabel: 'Throughput (MB/s)'
+  }
+);
+
+generateChart(chartConfig, './data/chart03.svg');

package/scripts/generate-as-class.ts

@@ -0,0 +1,50 @@
+// gen-obj-properties.ts
+import fs from "fs";
+import path from "path";
+
+/**
+ * Generates AssemblyScript class properties to reach a target byte size.
+ * Each i32 property is 4 bytes.
+ *
+ * @param targetBytes Total desired size in bytes
+ * @param prefix Property name prefix
+ */
+function generateProperties(targetBytes: number, prefix = "key"): string {
+  const bytesPerProp = 4; // i32
+  const numProps = Math.ceil(targetBytes / bytesPerProp);
+  let result = "";
+
+  for (let i = 0; i < numProps; i++) {
+    result += `${prefix}${i}: i32 = ${i}; `;
+    if ((i + 1) % 10 === 0) result += "\n  ";
+  }
+
+  return result.trim();
+}
+
+/**
+ * Generate AssemblyScript class source
+ */
+function generateClass(name: string, targetBytes: number) {
+  const props = generateProperties(targetBytes);
+  return `@json
+class ${name} {
+  ${props}
+}
+`;
+}
+
+/* =================================
+ * CONFIGURATION
+ * ================================= */
+const classes = [
+  { name: "ObjSmall", sizeKB: 100 },
+  { name: "ObjMedium", sizeKB: 500 },
+  { name: "ObjLarge", sizeKB: 1024 },
+];
+
+for (const cls of classes) {
+  const source = generateClass(cls.name, cls.sizeKB * 1024);
+  console.log(`// ===== ${cls.name} =====`);
+  console.log(source);
+}

package/scripts/lib/bench-utils.ts

@@ -0,0 +1,308 @@
+import fs from "fs";
+import path from "path";
+import { execSync } from "child_process";
+import { ChartJSNodeCanvas } from "chartjs-node-canvas";
+import ChartDataLabels from "chartjs-plugin-datalabels";
+import type { ChartConfiguration } from "chart.js";
+
+/* ================================
+ * Types
+ * ================================ */
+
+export interface BenchResult {
+  language: "as" | "js";
+  description: string;
+  elapsed: number;
+  bytes: number;
+  operations: number;
+  features: string[];
+  mbps: number;
+  gbps: number;
+}
+
+export type BenchKind = "serialize" | "deserialize";
+
+export interface BenchResults {
+  [payload: string]: {
+    serialize: BenchResult[];
+    deserialize: BenchResult[];
+  };
+}
+
+export interface LineSeries {
+  label: string;
+  data: number[];
+  borderColor: string;
+  backgroundColor?: string;
+}
+
+/* ================================
+ * Metadata
+ * ================================ */
+
+const LOGS_DIR = "./build/logs";
+
+const VERSION =
+  "v" + JSON.parse(fs.readFileSync("./package.json", "utf-8")).version;
+
+const GIT_HASH = execSync("git rev-parse --short HEAD").toString().trim();
+const GIT_BRANCH = execSync("git rev-parse --abbrev-ref HEAD").toString().trim();
+
+function subtitle() {
+  return `${new Date().toLocaleString()} • ${VERSION} • ${GIT_HASH} • ${GIT_BRANCH}`;
+}
+
+/* ================================
+ * IO helpers
+ * ================================ */
+
+function readBenchLog(filePath: string): BenchResult {
+  return JSON.parse(fs.readFileSync("./" + filePath, "utf-8")) as BenchResult;
+}
+
+function benchPath(
+  kind: "js" | "as",
+  payload: string,
+  type: BenchKind,
+  engine?: "swar" | "simd"
+): string {
+  if (kind === "js") {
+    return path.join(LOGS_DIR, "js", `${payload}.${type}.js.json`);
+  }
+  return path.join(LOGS_DIR, "as", engine!, `${payload}.${type}.as.json`);
+}
+
+/* ================================
+ * Public API
+ * ================================ */
+
+export function getBenchResults(payloads: string[]): BenchResults {
+  const out: BenchResults = {};
+
+  for (const payload of payloads) {
+    out[payload] = { serialize: [], deserialize: [] };
+
+    for (const kind of ["serialize", "deserialize"] as const) {
+      const js = readBenchLog(benchPath("js", payload, kind));
+      const swar = readBenchLog(benchPath("as", payload, kind, "swar"));
+      const simd = readBenchLog(benchPath("as", payload, kind, "simd"));
+
+      out[payload][kind] = [js, swar, simd];
+    }
+  }
+
+  return out;
+}
+
+/* ================================
+ * Bar chart (existing)
+ * ================================ */
+
+export function createBarChart(
+  data: Record<string, BenchResult[]>,
+  payloadLabels: Record<string, string>,
+  options: {
+    title: string;
+    yLabel?: string;
+    xLabel?: string;
+    datasetLabels?: [string, string, string];
+  }
+): ChartConfiguration<"bar"> {
+  const payloadKeys = Object.keys(data);
+  const labels = payloadKeys.map(k => payloadLabels[k] ?? k);
+
+  const maxMBps = Math.max(
+    ...Object.values(data).flat().map(r => r.mbps)
+  );
+
+  const datasetNames = options.datasetLabels ?? [
+    "Built-in JSON (JS)",
+    "JSON-AS (SWAR)",
+    "JSON-AS (SIMD)"
+  ];
+
+  return {
+    type: "bar",
+    data: {
+      labels,
+      datasets: [
+        {
+          label: datasetNames[0],
+          data: payloadKeys.map(k => data[k][0].mbps),
+          backgroundColor: "rgba(99,102,241,0.85)",
+          borderColor: "#6366f1",
+          borderWidth: 1
+        },
+        {
+          label: datasetNames[1],
+          data: payloadKeys.map(k => data[k][1].mbps),
+          backgroundColor: "rgba(34,197,94,0.85)",
+          borderColor: "#22c55e",
+          borderWidth: 1
+        },
+        {
+          label: datasetNames[2],
+          data: payloadKeys.map(k => data[k][2].mbps),
+          backgroundColor: "rgba(239,68,68,0.9)",
+          borderColor: "#ef4444",
+          borderWidth: 2
+        }
+      ]
+    },
+    options: {
+      responsive: true,
+      plugins: {
+        title: {
+          display: !!options.title,
+          text: options.title,
+          font: { size: 20, weight: "bold" }
+        },
+        legend: {
+          position: "top",
+          labels: {
+            font: { size: 16, weight: "bold" },
+            padding: 20
+          }
+        },
+        datalabels: {
+          anchor: "end",
+          align: "end",
+          font: { weight: "bold", size: 12 },
+          formatter: (v: number) => v.toFixed(0)
+        },
+        subtitle: {
+          display: true,
+          text: subtitle(),
+          font: { size: 14, weight: "bold" },
+          color: "#6b7280",
+          padding: 16,
+          position: "right"
+        }
+      },
+      scales: {
+        y: {
+          beginAtZero: true,
+          max: Math.ceil(maxMBps / 500) * 500,
+          title: {
+            display: true,
+            text: options.yLabel ?? "Throughput (MB/s)",
+            font: { size: 16, weight: "bold" }
+          },
+          ticks: {
+            stepSize: 500,
+            font: { size: 14, weight: "bold" }
+          }
+        },
+        x: {
+          title: {
+            display: true,
+            text: options.xLabel ?? "Payload",
+            font: { size: 16, weight: "bold" }
+          },
+          ticks: {
+            maxRotation: 0,
+            minRotation: 0,
+            font: { size: 14, weight: "bold" }
+          }
+        }
+      }
+    },
+    plugins: [ChartDataLabels]
+  };
+}
+
+/* ================================
+ * NEW: Line chart (charts 3 & 4)
+ * ================================ */
+
+export function createLineChart(
+  labels: string[],
+  series: LineSeries[],
+  options: {
+    title: string;
+    xLabel: string;
+    yLabel: string;
+    logX?: boolean;
+  }
+): ChartConfiguration<"line"> {
+  return {
+    type: "line",
+    data: {
+      labels,
+      datasets: series.map(s => ({
+        label: s.label,
+        data: s.data,
+        borderColor: s.borderColor,
+        backgroundColor: s.backgroundColor ?? s.borderColor,
+        borderWidth: 3,
+        tension: 0.25,
+        pointRadius: 4
+      }))
+    },
+    options: {
+      responsive: true,
+      plugins: {
+        title: {
+          display: true,
+          text: options.title,
+          font: { size: 20, weight: "bold" }
+        },
+        legend: {
+          position: "top",
+          labels: {
+            font: { size: 16, weight: "bold" }
+          }
+        },
+        subtitle: {
+          display: true,
+          text: subtitle(),
+          font: { size: 14, weight: "bold" },
+          color: "#6b7280",
+          padding: { bottom: 16 }
+        }
+      },
+      scales: {
+        x: {
+          type: options.logX ? "logarithmic" : "category",
+          title: {
+            display: true,
+            text: options.xLabel,
+            font: { size: 16, weight: "bold" }
+          }
+        },
+        y: {
+          beginAtZero: true,
+          title: {
+            display: true,
+            text: options.yLabel,
+            font: { size: 16, weight: "bold" }
+          }
+        }
+      }
+    }
+  };
+}
+
+/* ================================
+ * Render
+ * ================================ */
+
+export function generateChart(
+  config: ChartConfiguration,
+  outfile: string
+) {
+  const canvas = new ChartJSNodeCanvas({
+    width: 1000,
+    height: 600,
+    type: outfile.endsWith(".svg") ? "svg" : "png",
+    chartCallback: ChartJS => ChartJS.register(ChartDataLabels)
+  });
+
+  const buffer = canvas.renderToBufferSync(
+    config,
+    outfile.endsWith(".svg") ? "image/svg+xml" : "image/png"
+  );
+
+  fs.writeFileSync(outfile, buffer);
+  console.log(`Chart written -> ${outfile}`);
+}

package/transform/lib/index.js

@@ -994,8 +994,8 @@ export class JSONTransform extends Visitor {
         let fromPath = node.range.source.normalizedPath.replaceAll("/", path.sep);
         const isLib = path.dirname(baseDir).endsWith("node_modules");
         if (!isLib && !this.parser.sources.some((s) => s.normalizedPath.startsWith("assembly/index"))) {
-            const newPath = "./assembly/index.ts";
-            this.parser.parseFile(readFileSync(path.join(...newPath.split("/"))).toString(), newPath, false);
+            const newPath = path.join(baseDir, "assembly", "index.ts");
+            this.parser.parseFile(readFileSync(newPath).toString(), newPath, false);
         }
         else if (isLib && !this.parser.sources.some((s) => s.normalizedPath.startsWith("~lib/json-as/assembly/index"))) {
             const newPath = "~lib/json-as/assembly/index.ts";