@geenius/tools 0.1.0

package/packages/perf/solidjs/src/hooks/createPerformanceMetrics.ts

@@ -0,0 +1,73 @@
+// @geenius-tools/perf-solidjs — src/hooks/createPerformanceMetrics.ts
+
+import { createSignal, createEffect, onCleanup } from 'solid-js'
+import { PerformanceMonitor } from '../services/PerformanceMonitor'
+import type { PerformanceMetrics } from '../types'
+
+export interface CreatePerformanceMetricsOptions {
+    timeRange?: number
+    pollingInterval?: number
+    autoRefresh?: boolean
+}
+
+/**
+ * SolidJS signal for performance metrics
+ *
+ * @example
+ * const { metrics, isLoading, refresh, clearMetrics } = createPerformanceMetrics({
+ *   timeRange: 60 * 60 * 1000,
+ * })
+ *
+ * return <div>Score: {metrics()?.score}</div>
+ */
+export function createPerformanceMetrics(
+    options: CreatePerformanceMetricsOptions = {},
+) {
+    const {
+        timeRange = 24 * 60 * 60 * 1000,
+        pollingInterval = 5000,
+        autoRefresh = true,
+    } = options
+
+    const [metrics, setMetrics] = createSignal<PerformanceMetrics | null>(null)
+    const [isLoading, setIsLoading] = createSignal(true)
+    const [error, setError] = createSignal<Error | null>(null)
+
+    const fetchMetrics = () => {
+        try {
+            const end = Date.now()
+            const start = end - timeRange
+            setMetrics(PerformanceMonitor.getMetrics({ start, end }))
+            setError(null)
+        } catch (err) {
+            setError(err instanceof Error ? err : new Error('Failed to fetch metrics'))
+        } finally {
+            setIsLoading(false)
+        }
+    }
+
+    createEffect(() => {
+        fetchMetrics()
+
+        if (autoRefresh) {
+            const interval = setInterval(fetchMetrics, pollingInterval)
+            onCleanup(() => clearInterval(interval))
+        }
+    })
+
+    const clearMetrics = () => {
+        PerformanceMonitor.clear()
+        fetchMetrics()
+    }
+
+    const exportMetrics = () => PerformanceMonitor.exportMetrics()
+
+    return {
+        metrics,
+        isLoading,
+        error,
+        refresh: fetchMetrics,
+        clearMetrics,
+        exportMetrics,
+    }
+}

package/packages/perf/solidjs/src/index.ts

@@ -0,0 +1,31 @@
+// @geenius-tools/perf-solidjs — src/index.ts
+
+// ===== Types =====
+export type {
+    CacheMetrics,
+    QueryMetrics,
+    PageLoadMetrics,
+    ErrorMetrics,
+    PerformanceMetrics,
+    PerformanceConfig,
+    CacheHitEvent,
+    CacheMissEvent,
+} from './types'
+
+// ===== Service =====
+export { PerformanceMonitor } from './services/PerformanceMonitor'
+
+// ===== Hooks =====
+export { createPerformanceMetrics } from './hooks/createPerformanceMetrics'
+export type { CreatePerformanceMetricsOptions } from './hooks/createPerformanceMetrics'
+
+// ===== Components =====
+export { PerformanceDashboard } from './components/PerformanceDashboard'
+export type {
+    PerformanceDashboardProps,
+    PerformanceMetricsData,
+    CacheMetrics as DashboardCacheMetrics,
+    QueryMetric,
+    ErrorMetric,
+} from './components/PerformanceDashboard'
+

package/packages/perf/solidjs/src/services/PerformanceMonitor.ts

@@ -0,0 +1,134 @@
+// @geenius-tools/perf-solidjs — src/services/PerformanceMonitor.ts
+// Same PerformanceMonitor service as perf-react (framework-agnostic singleton)
+// Re-implemented here to avoid cross-package dependency
+
+import type {
+    PerformanceMetrics,
+    PerformanceConfig,
+    CacheMetrics,
+    QueryMetrics,
+    PageLoadMetrics,
+    ErrorMetrics,
+    CacheHitEvent,
+    CacheMissEvent,
+} from '../types'
+
+interface QueryEntry { key: string; duration: number; timestamp: number; error?: Error; cached: boolean }
+interface CacheEntry { type: 'hit' | 'miss'; queryKey: string; duration: number; fetchDuration?: number; timestamp: number; cacheType: 'ssr' | 'client' | 'memory' }
+interface ErrorEntry { type: string; message: string; stack?: string; timestamp: number; source: string }
+interface PageLoadEntry { route: string; ttfb: number; fcp: number; lcp: number; tti: number; loadTime: number; ssr: boolean; timestamp: number }
+
+const DEFAULT_CONFIG: PerformanceConfig = {
+    enableCacheTracking: true, enableQueryTracking: true,
+    enablePageLoadTracking: true, enableErrorTracking: true,
+    sampleRate: 1, maxMetrics: 1000,
+}
+
+export class PerformanceMonitor {
+    private static queries: QueryEntry[] = []
+    private static cacheEntries: CacheEntry[] = []
+    private static errors: ErrorEntry[] = []
+    private static pageLoads: PageLoadEntry[] = []
+    private static config: PerformanceConfig = DEFAULT_CONFIG
+
+    static configure(config: Partial<PerformanceConfig>): void {
+        PerformanceMonitor.config = { ...PerformanceMonitor.config, ...config }
+    }
+
+    static trackQuery(queryKey: string, duration: number, error?: Error, cached = false): void {
+        if (!PerformanceMonitor.config.enableQueryTracking) return
+        if (Math.random() > (PerformanceMonitor.config.sampleRate ?? 1)) return
+        PerformanceMonitor.queries.push({ key: queryKey, duration, timestamp: Date.now(), error, cached })
+        const max = PerformanceMonitor.config.maxMetrics ?? 1000
+        if (PerformanceMonitor.queries.length > max) PerformanceMonitor.queries = PerformanceMonitor.queries.slice(-max)
+    }
+
+    static trackCacheHit(event: CacheHitEvent): void {
+        if (!PerformanceMonitor.config.enableCacheTracking) return
+        PerformanceMonitor.cacheEntries.push({ type: 'hit', ...event })
+        const max = PerformanceMonitor.config.maxMetrics ?? 1000
+        if (PerformanceMonitor.cacheEntries.length > max) PerformanceMonitor.cacheEntries = PerformanceMonitor.cacheEntries.slice(-max)
+    }
+
+    static trackCacheMiss(event: CacheMissEvent): void {
+        if (!PerformanceMonitor.config.enableCacheTracking) return
+        PerformanceMonitor.cacheEntries.push({ type: 'miss', ...event })
+        const max = PerformanceMonitor.config.maxMetrics ?? 1000
+        if (PerformanceMonitor.cacheEntries.length > max) PerformanceMonitor.cacheEntries = PerformanceMonitor.cacheEntries.slice(-max)
+    }
+
+    static trackError(error: Error, source: string): void {
+        if (!PerformanceMonitor.config.enableErrorTracking) return
+        PerformanceMonitor.errors.push({ type: error.name || 'Error', message: error.message, stack: error.stack, timestamp: Date.now(), source })
+        const max = PerformanceMonitor.config.maxMetrics ?? 1000
+        if (PerformanceMonitor.errors.length > max) PerformanceMonitor.errors = PerformanceMonitor.errors.slice(-max)
+    }
+
+    static trackPageLoad(metrics: Omit<PageLoadEntry, 'timestamp'>): void {
+        if (!PerformanceMonitor.config.enablePageLoadTracking) return
+        PerformanceMonitor.pageLoads.push({ ...metrics, timestamp: Date.now() })
+        const max = PerformanceMonitor.config.maxMetrics ?? 1000
+        if (PerformanceMonitor.pageLoads.length > max) PerformanceMonitor.pageLoads = PerformanceMonitor.pageLoads.slice(-max)
+    }
+
+    static getMetrics(timeRange: { start: number; end: number }): PerformanceMetrics {
+        const { start, end } = timeRange
+        const rq = PerformanceMonitor.queries.filter(q => q.timestamp >= start && q.timestamp <= end)
+        const rc = PerformanceMonitor.cacheEntries.filter(c => c.timestamp >= start && c.timestamp <= end)
+        const re = PerformanceMonitor.errors.filter(e => e.timestamp >= start && e.timestamp <= end)
+        const rp = PerformanceMonitor.pageLoads.filter(p => p.timestamp >= start && p.timestamp <= end)
+
+        const hits = rc.filter(c => c.type === 'hit')
+        const misses = rc.filter(c => c.type === 'miss')
+        const total = hits.length + misses.length
+
+        const cache: CacheMetrics = {
+            totalRequests: total, hits: hits.length, misses: misses.length,
+            hitRate: total > 0 ? (hits.length / total) * 100 : 0,
+            avgHitTime: hits.length > 0 ? hits.reduce((s, h) => s + h.duration, 0) / hits.length : 0,
+            avgMissTime: misses.length > 0 ? misses.reduce((s, m) => s + (m.fetchDuration ?? m.duration), 0) / misses.length : 0,
+        }
+
+        const qMap = new Map<string, QueryEntry[]>()
+        for (const q of rq) { const arr = qMap.get(q.key) || []; arr.push(q); qMap.set(q.key, arr) }
+
+        const queries: QueryMetrics[] = Array.from(qMap.entries()).map(([key, entries]) => {
+            const d = entries.map(e => e.duration)
+            return {
+                queryKey: key, executions: entries.length,
+                avgDuration: d.reduce((s, v) => s + v, 0) / d.length,
+                minDuration: Math.min(...d), maxDuration: Math.max(...d),
+                errors: entries.filter(e => e.error).length,
+                lastExecuted: Math.max(...entries.map(e => e.timestamp)),
+                cached: entries.some(e => e.cached),
+            }
+        })
+
+        const eMap = new Map<string, ErrorEntry[]>()
+        for (const e of re) { const k = `${e.type}:${e.message}`; const a = eMap.get(k) || []; a.push(e); eMap.set(k, a) }
+
+        const errors: ErrorMetrics[] = Array.from(eMap.entries()).map(([, entries]) => ({
+            type: entries[0].type, message: entries[0].message, stack: entries[0].stack,
+            count: entries.length, firstSeen: Math.min(...entries.map(e => e.timestamp)),
+            lastSeen: Math.max(...entries.map(e => e.timestamp)), affectedUsers: 1,
+        }))
+
+        const pageLoads: PageLoadMetrics[] = rp
+        let score = 100
+        if (cache.hitRate < 80) score -= 20
+        if (queries.some(q => q.avgDuration > 1000)) score -= 15
+        if (errors.length > 0) score -= Math.min(errors.length * 5, 30)
+        if (pageLoads.some(p => p.lcp > 2500)) score -= 15
+
+        return { cache, queries, pageLoads, errors, score: Math.max(0, score), timeRange: { start, end } }
+    }
+
+    static clear(): void {
+        PerformanceMonitor.queries = []; PerformanceMonitor.cacheEntries = []; PerformanceMonitor.errors = []; PerformanceMonitor.pageLoads = []
+    }
+
+    static exportMetrics(): string {
+        const end = Date.now()
+        return JSON.stringify(PerformanceMonitor.getMetrics({ start: end - 86400000, end }), null, 2)
+    }
+}

package/packages/perf/solidjs/src/types.ts

@@ -0,0 +1,78 @@
+// @geenius-tools/perf-solidjs — src/types.ts
+// Self-contained perf types (same as perf-react)
+
+export interface CacheMetrics {
+    totalRequests: number
+    hits: number
+    misses: number
+    hitRate: number
+    avgHitTime: number
+    avgMissTime: number
+    cacheSize?: number
+    evictions?: number
+}
+
+export interface QueryMetrics {
+    queryKey: string
+    executions: number
+    avgDuration: number
+    minDuration: number
+    maxDuration: number
+    errors: number
+    lastExecuted: number
+    cached: boolean
+}
+
+export interface PageLoadMetrics {
+    route: string
+    ttfb: number
+    fcp: number
+    lcp: number
+    tti: number
+    loadTime: number
+    ssr: boolean
+    timestamp: number
+}
+
+export interface ErrorMetrics {
+    type: string
+    message: string
+    stack?: string
+    count: number
+    firstSeen: number
+    lastSeen: number
+    affectedUsers: number
+}
+
+export interface PerformanceMetrics {
+    cache: CacheMetrics
+    queries: QueryMetrics[]
+    pageLoads: PageLoadMetrics[]
+    errors: ErrorMetrics[]
+    score: number
+    timeRange: { start: number; end: number }
+}
+
+export interface PerformanceConfig {
+    enableCacheTracking?: boolean
+    enableQueryTracking?: boolean
+    enablePageLoadTracking?: boolean
+    enableErrorTracking?: boolean
+    sampleRate?: number
+    maxMetrics?: number
+}
+
+export interface CacheHitEvent {
+    queryKey: string
+    duration: number
+    timestamp: number
+    cacheType: 'ssr' | 'client' | 'memory'
+}
+
+export interface CacheMissEvent {
+    queryKey: string
+    duration: number
+    timestamp: number
+    cacheType: 'ssr' | 'client' | 'memory'
+    fetchDuration: number
+}

package/packages/perf/solidjs/tsconfig.json

@@ -0,0 +1,26 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "jsx": "preserve",
+    "jsxImportSource": "solid-js",
+    "strict": true,
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "forceConsistentCasingInFileNames": true,
+    "declaration": true,
+    "declarationDir": "./dist",
+    "outDir": "./dist",
+    "sourceMap": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true
+  },
+  "include": [
+    "src"
+  ],
+  "exclude": [
+    "node_modules",
+    "dist"
+  ]
+}

package/packages/perf/solidjs/tsup.config.ts

@@ -0,0 +1,14 @@
+import { defineConfig } from 'tsup'
+
+export default defineConfig({
+    entry: { index: 'src/index.ts' },
+    format: ['esm'],
+    dts: true,
+    clean: true,
+    outDir: 'dist',
+    sourcemap: true,
+    external: ['solid-js', 'solid-js/web', 'solid-js/store'],
+    esbuildOptions(options) {
+        options.jsx = 'preserve'
+    },
+})