ghostflow-wasm 1.0.0

WebAssembly bindings for GhostFlow ML framework
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>GhostFlow WASM Demo</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            max-width: 800px;
            margin: 50px auto;
            padding: 20px;
        }
        .demo-section {
            margin: 20px 0;
            padding: 20px;
            border: 1px solid #ddd;
            border-radius: 5px;
        }
        button {
            background: #4CAF50;
            color: white;
            padding: 10px 20px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            margin: 5px;
        }
        button:hover {
            background: #45a049;
        }
        pre {
            background: #f4f4f4;
            padding: 10px;
            border-radius: 4px;
            overflow-x: auto;
        }
    </style>
</head>
<body>
    <h1>🚀 GhostFlow WebAssembly Demo</h1>
    
    <div class="demo-section">
        <h2>1. Tensor Operations</h2>
        <button onclick="runTensorDemo()">Run Tensor Demo</button>
        <pre id="tensor-output"></pre>
    </div>

    <div class="demo-section">
        <h2>2. Matrix Multiplication</h2>
        <button onclick="runMatmulDemo()">Run Matmul Demo</button>
        <pre id="matmul-output"></pre>
    </div>

    <div class="demo-section">
        <h2>3. Simple Model</h2>
        <button onclick="runModelDemo()">Run Model Demo</button>
        <pre id="model-output"></pre>
    </div>

    <script type="module">
        import init, { 
            WasmTensor, 
            WasmModel, 
            version, 
            log 
        } from './pkg/ghostflow_wasm.js';

        async function run() {
            await init();
            
            log('GhostFlow WASM initialized!');
            document.getElementById('tensor-output').textContent = 
                `GhostFlow version: ${version()}`;

            // Make functions available globally
            window.WasmTensor = WasmTensor;
            window.WasmModel = WasmModel;
            window.ghostflowLog = log;
        }

        run();

        window.runTensorDemo = function() {
            const output = document.getElementById('tensor-output');
            try {
                // Create tensors
                const t1 = WasmTensor.zeros([2, 3]);
                const t2 = WasmTensor.ones([2, 3]);
                
                // Add tensors
                const result = t1.add(t2);
                
                output.textContent = `

Tensor 1 (zeros): shape=${JSON.stringify(t1.shape())}, data=${JSON.stringify(t1.data())}

Tensor 2 (ones): shape=${JSON.stringify(t2.shape())}, data=${JSON.stringify(t2.data())}

Result (t1 + t2): shape=${JSON.stringify(result.shape())}, data=${JSON.stringify(result.data())}

                `.trim();
            } catch (e) {
                output.textContent = `Error: ${e}`;
            }
        };

        window.runMatmulDemo = function() {
            const output = document.getElementById('matmul-output');
            try {
                // Create matrices
                const a = new WasmTensor([1, 2, 3, 4], [2, 2]);
                const b = new WasmTensor([5, 6, 7, 8], [2, 2]);
                
                // Matrix multiplication
                const result = a.matmul(b);
                
                output.textContent = `

Matrix A: shape=${JSON.stringify(a.shape())}, data=${JSON.stringify(a.data())}

Matrix B: shape=${JSON.stringify(b.shape())}, data=${JSON.stringify(b.data())}

A @ B: shape=${JSON.stringify(result.shape())}, data=${JSON.stringify(result.data())}

                `.trim();
            } catch (e) {
                output.textContent = `Error: ${e}`;
            }
        };

        window.runModelDemo = function() {
            const output = document.getElementById('model-output');
            try {
                // Create a simple model
                const model = new WasmModel();
                
                // Add weight matrix (3x2)
                const weight = new WasmTensor([0.5, 0.3, 0.2, 0.1, 0.4, 0.5], [3, 2]);
                model.addWeight(weight);
                
                // Create input (1x3)
                const input = new WasmTensor([1.0, 2.0, 3.0], [1, 3]);
                
                // Forward pass
                const prediction = model.forward(input);
                
                output.textContent = `

Model created with ${model.numWeights()} weight tensor(s)

Input: shape=${JSON.stringify(input.shape())}, data=${JSON.stringify(input.data())}

Prediction: shape=${JSON.stringify(prediction.shape())}, data=${JSON.stringify(prediction.data())}

                `.trim();
            } catch (e) {
                output.textContent = `Error: ${e}`;
            }
        };
    </script>
</body>
</html>