jinrai 1.0.0

package/lib/generate.js

@@ -0,0 +1,26 @@
+#!/usr/bin/env node
+
+// src/config/userConfig.ts
+import { createJiti } from "jiti";
+import { pathToFileURL } from "url";
+import { resolve } from "path";
+var getUserConfig = async () => {
+  const jiti = createJiti(import.meta.url, {
+    debug: false
+  });
+  const configPath = pathToFileURL(resolve(process.cwd(), ".ssr.config")).href;
+  console.log("#######", { configPath });
+  const configModule = await jiti.import(configPath);
+  return configModule.default;
+};
+
+// src/generate.ts
+import ReactDOMServer from "react-dom/server";
+console.log(">>");
+var config = await getUserConfig();
+for (const mask of config.pages) {
+  console.log(" - ", mask);
+  const url = mask.replaceAll("{", "").replaceAll("}", "");
+  const html = ReactDOMServer.renderToString(config.renderPage(url));
+  console.log(html);
+}

package/lib/index.d.ts

@@ -0,0 +1 @@
+export { defineConfig } from "./src/config/define";

package/lib/index.js

@@ -0,0 +1,7 @@
+// src/config/define.ts
+var defineConfig = (config) => {
+  return config;
+};
+export {
+  defineConfig
+};

package/lib/src/config/define.d.ts

@@ -0,0 +1,2 @@
+import type { Config } from "./userConfig";
+export declare const defineConfig: (config: Config) => Config;

package/lib/src/config/userConfig.d.ts

@@ -0,0 +1,14 @@
+interface ExportHTML {
+    index: string;
+    outDir: string;
+}
+export interface Config {
+    url: string;
+    pages: string[];
+    api: string;
+    dev?: boolean;
+    meta: string;
+    export: ExportHTML;
+}
+export declare const getUserConfig: () => Promise<Config>;
+export {};

package/package.json

@@ -0,0 +1,35 @@
+{
+    "name": "jinrai",
+    "version": "1.0.0",
+    "description": "A powerful library that analyzes your modern web application and automatically generates a perfectly rendered, static snapshot of its pages. Experience unparalleled loading speed and SEO clarity without the complexity of traditional SSR setups. Simply point Jinrai at your SPA and witness divine speed.",
+    "main": "lib/index.ts",
+    "scripts": {
+        "test": "node ./lib/bin",
+        "test2": "node --import tsx src/bin.ts",
+        "build": "npm run build-config && npm run build-index && npm run build:types",
+        "build:types": "tsc",
+        "build-index": "npx esbuild index.ts --bundle --platform=node --format=esm --outfile=lib/index.js --external:jiti --external:node:*  --external:playwright",
+        "build-config": "npx esbuild src/bin.ts --bundle --platform=node --format=esm --outfile=lib/bin.js --external:jiti --external:node:* --external:playwright --external:prettier"
+    },
+    "keywords": [],
+    "author": "",
+    "license": "ISC",
+    "type": "module",
+    "devDependencies": {
+        "@types/node": "^24.5.2",
+        "@types/ora": "^3.1.0",
+        "dotenv": "^17.2.2",
+        "tsx": "^4.20.6",
+        "typescript": "^5.9.2"
+    },
+    "bin": {
+        "rsr": "lib/bin.js"
+    },
+    "dependencies": {
+        "@types/prettier": "^2.7.3",
+        "jiti": "^2.6.0",
+        "ora": "^9.0.0",
+        "playwright": "^1.55.1",
+        "prettier": "^3.6.2"
+    }
+}

package/readme.md

@@ -0,0 +1,24 @@
+# **Jinrai - Instant Static Rendering for SPAs.**
+
+A powerful library that analyzes your modern web application and automatically
+generates a perfectly rendered, static snapshot of its pages. Experience unparalleled
+loading speed and SEO clarity without the complexity of traditional SSR setups.
+Simply point Jinrai at your SPA and witness divine speed.
+
+---
+
+.ssr.config.ts
+
+```ts
+import { defineConfig } from "jinrai"
+
+export default defineConfig({
+    url: "<spa-url>",
+    dev: true,
+    pages: ["/", "/products", "/products/{phones}", "/product/{iphone17pro}", "/{iphone17pro_42}"],
+    export: {
+        outDir: "export",
+        index: "index.html",
+    },
+})
+```

package/src/bin.ts

@@ -0,0 +1,43 @@
+#!/usr/bin/env node
+
+import { writeFile } from "node:fs/promises"
+import { Config, getUserConfig } from "./config/userConfig"
+import { getRoutesAndTemplates } from "./routes/getRoutes"
+import { getRawPageData } from "./templates"
+import path from "node:path"
+import { mkdir } from "node:fs/promises"
+import prettier from "prettier"
+import Task from "./ui/task"
+
+const task = new Task()
+
+task.do("Load config")
+const config: Config = await getUserConfig()
+task.success()
+
+const data = await getRawPageData(config.url, config.pages, config.dev)
+
+task.do("Format")
+const { routes, templates } = getRoutesAndTemplates(data)
+
+task.next(`Export: ${config.export.outDir} (${templates.length})`)
+await mkdir(config.export.outDir, { recursive: true })
+
+await writeFile(path.join(config.export.outDir, "config.json"), JSON.stringify(routes, null, 2))
+
+for await (let [index, template] of templates.entries()) {
+    try {
+        template = await prettier.format(template, {
+            parser: "html",
+            printWidth: 500,
+            tabWidth: 2,
+            useTabs: false,
+            semi: true,
+            singleQuote: true,
+        })
+    } catch (error) {}
+
+    await writeFile(path.join(config.export.outDir, `${index}.html`), template)
+}
+
+task.success()

package/src/config/define.ts

@@ -0,0 +1,7 @@
+import type { Config } from "./userConfig"
+
+export const defineConfig = (config: Config) => {
+    return config
+}
+
+

package/src/config/userConfig.ts

@@ -0,0 +1,34 @@
+import { createJiti } from "jiti"
+import { pathToFileURL } from "url"
+import { resolve } from "path"
+
+interface ExportHTML {
+    // root: string
+    // assets: {
+    //     root: string
+    //     prefix: string
+    // }
+    index: string
+    outDir: string
+}
+
+export interface Config {
+    url: string
+    pages: string[]
+    api: string
+    dev?: boolean
+    meta: string
+    export: ExportHTML
+}
+
+export const getUserConfig = async (): Promise<Config> => {
+    const jiti = createJiti(import.meta.url, {
+        debug: false,
+    })
+
+    const configPath = pathToFileURL(resolve(process.cwd(), ".ssr.config")).href
+
+    const configModule = (await jiti.import(configPath)) as { default: Config }
+
+    return configModule.default
+}

package/src/routes/getRoutes.ts

@@ -0,0 +1,29 @@
+import { input, PageData } from "../templates"
+import { ParseItem, Parser } from "./parser"
+
+interface Route {
+    mask: string
+    requests: input[]
+    content: ParseItem[]
+}
+
+export const getRoutesAndTemplates = (templates: PageData[]) => {
+    const routes: Route[] = []
+    const parser = new Parser()
+
+    for (const template of templates) {
+        const content = parser.parse(template.root)
+        const mask = template.mask.replaceAll("/", "\\/").replace(/{(.*?)}/, ".+?")
+
+        routes.push({
+            content,
+            mask,
+            requests: template.input,
+        })
+    }
+
+    return {
+        routes,
+        templates: parser.templates,
+    }
+}

package/src/routes/parser.ts

@@ -0,0 +1,58 @@
+import { splitByTag } from "./splitByTag.ts"
+
+export interface ParseItem {
+    type: string
+    template: ParseItem[] | number
+    contentKey?: string
+}
+
+const toBinary = (content: string) => {
+    return btoa(unescape(encodeURIComponent(content)))
+}
+
+export class Parser {
+    templates: string[] = []
+    ctemplates: string[] = []
+    convertor?: (content: string) => string
+
+    constructor(convertor?: (content: string) => string) {
+        this.convertor = convertor
+    }
+
+    parse(html: string): ParseItem[] {
+        const parts = splitByTag("loopwrapper", html)
+
+        return parts.map(content => {
+            const isArray = content.startsWith("ArrayDataKey=")
+
+            let contentKey = undefined
+            if (isArray) {
+                ;[contentKey, content] = this.firstPypeSplit(content)
+            }
+
+            return {
+                type: isArray ? "array" : "html",
+                template: isArray ? this.parse(content) : this.getTemplateId(content),
+                contentKey,
+            }
+        })
+    }
+
+    getTemplateId(template: string): number {
+        const index = this.templates.indexOf(template)
+        if (index != -1) {
+            return index
+        }
+
+        this.templates.push(template)
+        this.ctemplates.push(this.convertor ? this.convertor(template) : toBinary(template))
+
+        return this.templates.length - 1
+    }
+
+    firstPypeSplit(content: string) {
+        const index = content.indexOf("|")
+
+        return [content.slice(13, index), content.slice(index + 1)]
+    }
+}

package/src/routes/splitByTag.ts

@@ -0,0 +1,38 @@
+export const splitByTag = (tag: string, content: string): string[] => {
+	const htmls = content
+		.replace(new RegExp(`(<\/?${tag}.*?>)`, "gm"), (_, find) => {
+			return `<**${tag}**>` + (find.startsWith('</') ? 'CLS' : 'OPN')
+		})
+		.split(`<**${tag}**>`)
+
+	if (htmls.length == 1)
+		return htmls
+
+	let count = 0
+	const result: string[][] = []
+
+	for (let itm of htmls) {
+		let step = 0
+
+		if (itm.startsWith('OPN')) step = 1
+		if (itm.startsWith('CLS')) step = -1
+		
+		if (step != 0)
+			itm = itm.substring(3)
+
+		if (step > 0) {
+			count+=step
+			step = 0
+		}
+
+		if (count<=1)
+			result.push([itm])
+		else
+			result[result.length -1].push(itm)
+
+		count+=step
+	}
+
+	return result.map(itms => itms.join(`<**${tag}**>`))
+};
+

package/src/templates.ts

@@ -0,0 +1,67 @@
+import { chromium } from "playwright"
+import Task from "./ui/task"
+import { spinners } from "ora"
+
+export type input = {
+    method: string
+    url: string
+    input: object
+}
+
+export interface PageData {
+    mask: string
+    root: string
+    input: input[]
+}
+
+export const getRawPageData = async (url: string, pages: string[], debug: boolean = false): Promise<PageData[]> => {
+    const task = new Task()
+    task.next("Parsing pages", "yellow", spinners.dotsCircle)
+
+    const result: PageData[] = []
+
+    const browser = await chromium.launch({ headless: !debug, devtools: true })
+    const context = await browser.newContext({
+        userAgent: "____fast-ssr-tool___",
+    })
+
+    let date: any[] = []
+
+    for await (const mask of pages) {
+        task.next(mask, "yellow", spinners.dotsCircle, 1)
+
+        const page = await context.newPage()
+
+        const path = mask.replaceAll("{", "").replaceAll("}", "")
+        await page.goto(url + path)
+
+        await page.waitForLoadState("networkidle")
+
+        await page.waitForTimeout(1000)
+
+        const requests = await page.evaluate(() => {
+            return (window as any).__ssr_preload
+        })
+
+        const input = requests ? (JSON.parse(requests) as input[]) : []
+
+        const root = await page.locator("#root").innerHTML()
+
+        if (debug) {
+            await task.ask("continue?")
+        }
+
+        page.close()
+
+        result.push({
+            input,
+            mask,
+            root,
+        })
+    }
+
+    await browser.close()
+
+    task.success()
+    return result
+}

package/src/types/shims.d.ts

@@ -0,0 +1 @@
+declare module "jiti"

package/src/ui/task.tsx

@@ -0,0 +1,52 @@
+import ora, { Color, Ora, Spinner, spinners } from "ora";
+import { stdin as input, stdout as output } from "node:process";
+import readline from "node:readline/promises";
+
+export default class Task {
+  spiner: Ora | undefined = undefined;
+
+  do(task: string, color?: Color, spinner?: Spinner, prefix?: string) {
+    this.spiner = ora({
+      text: task,
+      color,
+      spinner: spinner,
+      prefixText: prefix,
+    }).start();
+  }
+
+  next(task: string, color?: Color, spinner?: Spinner, level: number = 0) {
+    this.success();
+    this.do(
+      task,
+      color,
+      spinner,
+      level ? "   ".repeat(level) + "└─" : undefined
+    );
+  }
+
+  success() {
+    if (this.spiner) this.spiner.succeed();
+  }
+
+  fail() {
+    if (this.spiner) this.spiner.fail();
+  }
+
+  async ask(question: string, defaultAnswer: string = ""): Promise<string> {
+    if (this.spiner) {
+        // this.spiner.text = `${question}: `
+        this.spiner.spinner = {
+            interval: 100,
+            frames: [
+                "?", ".", " ", "."
+            ]
+        }
+    }
+
+    const rl = readline.createInterface({ input, output });
+    const answer = (await rl.question("")).trim();
+    rl.close();
+
+    return answer ? answer : defaultAnswer;
+  }
+}

package/test/.ssr.config.ts

@@ -0,0 +1,20 @@
+import { defineConfig } from "../src/config/define";
+
+export default defineConfig({
+  url: "https://fld.ru",
+  dev: true,
+  pages: [
+    "/",
+    "/products",
+    "/products/{klapany}",
+    "/product/{krany_sharovye_serii_105_prohodnoj_2h_hodovoj}",
+    "/{CMC-8M-4N}",
+  ],
+  // dev: true,
+  api: "http://nginx",
+  meta: "http://nginx/Api/Meta/GetTags",
+  export: {
+    outDir: "export",
+    index: "index.html",
+  },
+});

package/tsconfig.json

@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "jsxImportSource": "react",
+    "module": "esnext",  
+    "declaration": true,
+    "emitDeclarationOnly": true,
+    "outDir": "lib",
+    "skipLibCheck": true
+  },
+  "include": ["index.ts", "src/types"],
+  
+}