Compare commits
8 Commits
3d1b406e8d
...
agentic-co
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
ac15336c9f | ||
|
|
7a15cacebf | ||
|
|
27135a8f14 | ||
|
|
e28a715f32 | ||
|
|
24d29d9ba9 | ||
|
|
7eca426e77 | ||
|
|
7a1352ead7 | ||
|
|
b9017448d8 |
525
network-poc/BUILDING_BLOCKS.md
Normal file
525
network-poc/BUILDING_BLOCKS.md
Normal file
@@ -0,0 +1,525 @@
|
||||
# Kipinä Agentic Studio — Rakennuspalaset
|
||||
|
||||
Tämä dokumentti kuvaa projektin UI-komponentit, arkkitehtuuripatternit ja työnkulut niin, että vastaavan hajautetun AI-laskentaverkon ja agenttipohjaisen käyttöliittymän voi rakentaa alusta asti.
|
||||
|
||||
## Yleiskuva
|
||||
|
||||
```
|
||||
┌─────────────────────────────────────────────────────┐
|
||||
│ Selain (käyttäjä) │
|
||||
│ ┌──────────┐ ┌──────────┐ ┌───────────────────┐ │
|
||||
│ │ Verkko- │ │ Koodi- │ │ Agents-näkymä │ │
|
||||
│ │ näkymä │ │ labra │ │ ┌───────────────┐ │ │
|
||||
│ │ │ │ │ │ │ Terminaali │ │ │
|
||||
│ │ Stats │ │ Editor │ │ │ Tab-complete │ │ │
|
||||
│ │ Chat │ │ Pipeline │ │ │ Dropdown │ │ │
|
||||
│ │ Tokenit │ │ Tulokset │ │ │ Historia │ │ │
|
||||
│ └────┬─────┘ └────┬─────┘ │ └───────────────┘ │ │
|
||||
│ │ │ └────────┬──────────┘ │
|
||||
│ └──────────┬───┘ │ │
|
||||
│ UI WebSocket HTTP API │
|
||||
│ │ /api/v1/chat │
|
||||
│ ┌───────────────┴──────────────┐ │ │
|
||||
│ │ Wasm Compute Node │ │ │
|
||||
│ │ (Candle + Burn) │ │ │
|
||||
│ │ ┌─────────┐ ┌────────────┐ │ │ │
|
||||
│ │ │ RAM │ │ IndexedDB │ │ │ │
|
||||
│ │ │ Cache │ │ Cache │ │ │ │
|
||||
│ │ └─────────┘ └────────────┘ │ │ │
|
||||
│ │ ┌─────────────────────────┐ │ │ │
|
||||
│ │ │ Model Cache (QwenModel) │ │ │ │
|
||||
│ │ └─────────────────────────┘ │ │ │
|
||||
│ └──────────────┬───────────────┘ │ │
|
||||
│ │ WS │ │
|
||||
└─────────────────┼──────────────────────┼─────────────┘
|
||||
│ │
|
||||
┌────────┴──────────────────────┴──┐
|
||||
│ Hub (Axum + Tokio) │
|
||||
│ ┌────────────┐ ┌─────────────┐ │
|
||||
│ │ Broadcast │ │ Node │ │
|
||||
│ │ Channel │ │ Registry │ │
|
||||
│ └────────────┘ └─────────────┘ │
|
||||
│ ┌────────────┐ ┌─────────────┐ │
|
||||
│ │ Busy-State │ │ Rate Limit │ │
|
||||
│ │ Tracker │ │ + Auth │ │
|
||||
│ └────────────┘ └─────────────┘ │
|
||||
│ ┌─────────────────────────────┐ │
|
||||
│ │ SQLite (sessiot, tulokset) │ │
|
||||
│ └─────────────────────────────┘ │
|
||||
└──────────────────────────────────┘
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 1. WebSocket-reaaliaikakommunikaatio
|
||||
|
||||
### 1.1 Hub ↔ Node broadcast-kanava
|
||||
|
||||
**Tarkoitus:** Jakaa tehtäviä ja vastaanottaa tuloksia kaikilta laskentasolmuilta.
|
||||
|
||||
**Työnkulku:**
|
||||
1. Hub luo `tokio::sync::broadcast::channel(100)`
|
||||
2. Jokainen solmu saa oman `rx = stats_tx.subscribe()`
|
||||
3. Hub broadcastaa tehtävät: `stats_tx.send(json)`
|
||||
4. Solmut suodattavat viestin tyypin ja `selected_task`:n perusteella
|
||||
|
||||
**Viestityupit:**
|
||||
|
||||
| Tyyppi | Suunta | Sisältö |
|
||||
|--------|--------|---------|
|
||||
| `stats` | Hub → kaikki | nodes, vram_gb, tasks |
|
||||
| `pair_task` | Hub → tokenize-solmut | en, fi tekstiparit |
|
||||
| `llm_prompt` | Hub → valittu solmu | prompt, model, task_id |
|
||||
| `llm_chunk` | Solmu → Hub → UI | token (1 kerrallaan) |
|
||||
| `llm_done` | Solmu → Hub → UI | response, tokens_generated, duration_ms |
|
||||
| `llm_error` | Solmu → Hub → UI | error, task_id |
|
||||
| `task_routed` | Hub → UI | status (routed/queued), node_id, message |
|
||||
|
||||
**Lagged-viestien käsittely:**
|
||||
```rust
|
||||
match rx.recv().await {
|
||||
Ok(msg) => { /* käsittele */ }
|
||||
Err(broadcast::error::RecvError::Lagged(n)) => {
|
||||
// Ohitetaan vanhat viestit, ei katkaista yhteyttä
|
||||
continue;
|
||||
}
|
||||
Err(_) => break, // Kanava suljettu
|
||||
}
|
||||
```
|
||||
|
||||
### 1.2 Kohdennettu reititys (Direct Channel)
|
||||
|
||||
**Tarkoitus:** Lähetä tehtävä yhdelle tietylle solmulle broadcastin sijaan.
|
||||
|
||||
**Työnkulku:**
|
||||
1. Jokainen solmu saa `mpsc::unbounded_channel` yhdistyessään
|
||||
2. Hub tallentaa `node_channels: HashMap<u64, UnboundedSender>`
|
||||
3. API-pyyntö → valitaan vapaa solmu → lähetetään suoraan kanavaan
|
||||
4. Broadcast-kanavaa käytetään vain tuloksen välittämiseen UI:lle
|
||||
|
||||
```rust
|
||||
let channels = state.node_channels.read().await;
|
||||
if let Some(tx) = channels.get(&target_node_id) {
|
||||
tx.send(msg.to_string());
|
||||
}
|
||||
```
|
||||
|
||||
### 1.3 Busy-state ja työjono
|
||||
|
||||
**Tarkoitus:** Estä tehtävien reititys varatuille solmuille.
|
||||
|
||||
**Rakenne:**
|
||||
- `node_busy: HashSet<u64>` — solmut joilla on aktiivinen tehtävä
|
||||
- Asetetaan kun tehtävä reititetään, vapautetaan `llm_done`/`llm_error`:ssa
|
||||
- Jos kaikki solmut varattuja → pollaa 500ms välein, max 30s
|
||||
|
||||
**UI-palaute:**
|
||||
```json
|
||||
{"type": "task_routed", "status": "queued", "message": "Kaikki 2 solmua varattuja — odotetaan..."}
|
||||
{"type": "task_routed", "status": "routed", "node_id": 3, "message": "Solmu #3 vapautui (2.5s jonossa)"}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 2. Wasm-laskentasolmu
|
||||
|
||||
### 2.1 Elinkaari
|
||||
|
||||
```
|
||||
init() → start_agent_node(ws_url, has_webgpu, device_info, task_id)
|
||||
│
|
||||
├─ Avaa WebSocket hubiin
|
||||
├─ Lähettää auth-viestin (laitetiedot, selected_task)
|
||||
├─ Rekisteröityy onmessage-käsittelijä
|
||||
│ ├─ pair_task → tokenize
|
||||
│ ├─ llm_prompt → inference
|
||||
│ └─ ai_task → tensor matmul
|
||||
└─ Odottaa tehtäviä loopissa
|
||||
```
|
||||
|
||||
**Globaali tila (atominen, lukitsematon):**
|
||||
```rust
|
||||
static GPU_LOAD_PERCENT: AtomicU32 = AtomicU32::new(50);
|
||||
static LLM_BUSY: AtomicBool = AtomicBool::new(false);
|
||||
static SELECTED_TASK: AtomicU32 = AtomicU32::new(0);
|
||||
```
|
||||
|
||||
### 2.2 Kolmitasoinen cache
|
||||
|
||||
```
|
||||
Pyyntö → [1] RAM-cache (thread_local HashMap)
|
||||
│ miss
|
||||
▼
|
||||
[2] IndexedDB (selaimen pysyvä tallennus)
|
||||
│ miss
|
||||
▼
|
||||
[3] Verkko (HuggingFace CDN, streaming + 5% progressi)
|
||||
│
|
||||
▼
|
||||
Tallenna → IndexedDB → RAM-cache
|
||||
```
|
||||
|
||||
| Taso | Nopeus | Koko | Pysyvyys |
|
||||
|------|--------|------|----------|
|
||||
| RAM | ~0ms | Rajaton | Sivulataus |
|
||||
| IndexedDB | ~50ms | ~50GB | Pysyvä |
|
||||
| Verkko | ~10s/100MB | ∞ | — |
|
||||
|
||||
**Malliinstanssin cache (neljäs taso):**
|
||||
```rust
|
||||
thread_local! {
|
||||
static MODEL_CACHE: RefCell<Option<CachedModel>> = RefCell::new(None);
|
||||
}
|
||||
// clear_kv_cache() promptien välillä — ei tarvitse rakentaa mallia uusiksi
|
||||
```
|
||||
|
||||
### 2.3 Warmup-esilataus
|
||||
|
||||
**Tarkoitus:** Lataa malli valmiiksi ennen ensimmäistä oikeaa promptia.
|
||||
|
||||
```javascript
|
||||
// Lähetetään 1 tokenin warmup heti kun WS on auki
|
||||
uiSocket.send(JSON.stringify({
|
||||
type: 'user_text',
|
||||
text: '{"prompt":"warmup","max_tokens":1}',
|
||||
task_type: 'qwen-coder'
|
||||
}));
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 3. LLM-inferenssipipeline
|
||||
|
||||
### 3.1 Prompt-formaatti (ChatML + prefill)
|
||||
|
||||
```
|
||||
<|im_start|>system
|
||||
You are a coding assistant. Respond with ONLY code.<|im_end|>
|
||||
<|im_start|>user
|
||||
hello world in python<|im_end|>
|
||||
<|im_start|>assistant
|
||||
``` ← PREFILL: pakottaa mallin aloittamaan koodilla
|
||||
```
|
||||
|
||||
**Prefill-tekniikka:** Lisäämällä ` ``` ` assistantin vastauksen alkuun malli jatkaa suoraan koodilla eikä tuota "Sure! Here is..." -johdantoa. Säästää 10-20 tokenia per vastaus.
|
||||
|
||||
### 3.2 Sampling-parametrit
|
||||
|
||||
| Parametri | Arvo | Tarkoitus |
|
||||
|-----------|------|-----------|
|
||||
| `temperature` | 0.7 | Pehmentää jakaumaa, vähentää toistoa |
|
||||
| `top_k` | 40 | Rajaa valinnan 40 todennäköisimpään tokeniin |
|
||||
| `repetition_penalty` | 1.15 | Rankaisee jo generoitujen tokenien uudelleenvalintaa |
|
||||
| `max_tokens` | 128 | Oletusraja, JSON-promptilla konfiguroitavissa |
|
||||
|
||||
**Sampling-funktio (top-k + temperature + repetition penalty):**
|
||||
```rust
|
||||
fn sample_top_k_with_penalty(logits, k, temperature, generated_tokens, penalty) -> u32 {
|
||||
// 1. Repetition penalty: vähennä aiempien tokenien logitteja
|
||||
// 2. Temperature scaling: jaa logitit temperaturella
|
||||
// 3. Top-k: ota k suurinta
|
||||
// 4. Softmax top-k:lle
|
||||
// 5. Satunnaisvalinta kumulatiivisella todennäköisyydellä (XorShift RNG)
|
||||
}
|
||||
```
|
||||
|
||||
### 3.3 Stop-sekvenssit
|
||||
|
||||
Generointi katkaistaan ja teksti trimmataan kun malli alkaa selittää:
|
||||
|
||||
```rust
|
||||
let stop_patterns = ["\n###", "\nExplanation", "\nNote:", "\nOutput:", "\n```\n\n"];
|
||||
```
|
||||
|
||||
### 3.4 Vastauksen siivous
|
||||
|
||||
```
|
||||
Raakavastaus: "Sure! Here is...\n```python\n# This is a simple program\nprint('hi')\n```"
|
||||
│
|
||||
strip_markdown: "# This is a simple program\nprint('hi')"
|
||||
│
|
||||
strip_preamble: "print('hi')"
|
||||
```
|
||||
|
||||
**Tunnistettavat selityskommentit:** `# This is`, `# simple`, `# program that`, `# here is`, `# the following`, `# below`
|
||||
|
||||
### 3.5 Streaming
|
||||
|
||||
Jokainen generoitu token lähetetään heti `llm_chunk`-viestinä:
|
||||
```json
|
||||
{"type": "llm_chunk", "token": "print", "prompt": "...", "model": "Qwen2.5-Coder", "task_id": "uuid"}
|
||||
```
|
||||
|
||||
UI päivittää streaming-korttia reaaliaikaisesti appendaamalla tokeneita.
|
||||
|
||||
---
|
||||
|
||||
## 4. Terminaaliemulaattori
|
||||
|
||||
### 4.1 Rakenne
|
||||
|
||||
```html
|
||||
<div id="agent-hub-status"> <!-- Status-palkki (Hub + Laskenta) -->
|
||||
<div id="agent-terminal"> <!-- Scrollaava tulosalue, max 100 riviä -->
|
||||
<div> <!-- Input-rivi -->
|
||||
<span>$</span>
|
||||
<input id="term-input">
|
||||
<div id="term-dropdown"> <!-- Autocompletion-valikko -->
|
||||
</div>
|
||||
```
|
||||
|
||||
### 4.2 Komentojen käsittely
|
||||
|
||||
```javascript
|
||||
function termExec(cmd) {
|
||||
// Parsitaan: "kpn" + alikomento + argumentit
|
||||
// Tuetut: help, run, pipeline, load, status, models, hello, clear
|
||||
// Agenttinimi → malli-mapping: "coder" → "qwen-coder"
|
||||
}
|
||||
```
|
||||
|
||||
### 4.3 Tab-completion (kolmitasoinen)
|
||||
|
||||
```javascript
|
||||
const kpnCommands = {
|
||||
'kpn': ['help', 'run', 'pipeline', 'load', ...],
|
||||
'kpn run': ['coder', 'manager', 'qwen-coder', ...],
|
||||
};
|
||||
const kpnExamples = {
|
||||
'kpn run coder': ['"hello world in python"', ...],
|
||||
};
|
||||
```
|
||||
|
||||
**Käyttö:**
|
||||
|
||||
| Näppäin | Toiminto |
|
||||
|---------|----------|
|
||||
| TAB | Täydennä seuraava sana tai avaa dropdown |
|
||||
| Shift-TAB | Poista viimeinen sana (lainausmerkit kokonaisuutena) |
|
||||
| ↑ / ↓ | Navigoi dropdownissa (tai komentohistoriassa) |
|
||||
| Enter | Valitse dropdownista tai suorita komento |
|
||||
| Esc | Sulje dropdown |
|
||||
|
||||
### 4.4 Dropdown-valikko
|
||||
|
||||
```javascript
|
||||
function showDropdown(items, prefix) {
|
||||
// Luo div.term-dd-item per vaihtoehto
|
||||
// Positio: absolute, bottom: 100% (inputin yläpuolella)
|
||||
// Mouseenter → highlight, click → valinta
|
||||
}
|
||||
```
|
||||
|
||||
### 4.5 Komentohistoria
|
||||
|
||||
```javascript
|
||||
const termHistory = []; // Kaikki ajetut komennot (viimeisin ensin)
|
||||
let termHistIdx = -1; // Nykyinen positio historiassa
|
||||
// ArrowUp: termHistIdx++, ArrowDown: termHistIdx--
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 5. Status-palkit ja tilaindikaattorit
|
||||
|
||||
### 5.1 Hub-yhteyden tila
|
||||
|
||||
| Tila | Väri | Teksti | Tooltip |
|
||||
|------|------|--------|---------|
|
||||
| Yhdistetään | 🟡 | "Yhdistetään..." | WebSocket-yhteys Kipinä Hubiin |
|
||||
| Yhdistetty | 🟢 | "Yhdistetty" | Tehtävien jakelu aktiivinen |
|
||||
| Katkennut | 🔴 | "Yhteys katkennut" | Tarkista verkko, lataa uudelleen |
|
||||
|
||||
### 5.2 Laskentasolmun tila
|
||||
|
||||
| Tila | Väri | Teksti | Nappi |
|
||||
|------|------|--------|-------|
|
||||
| Ei käynnissä | ⚫ | "—" | `[Alusta laskentasolmu]` sininen |
|
||||
| Lataa | 🟡 | "Ladataan..." | `[Peruuta]` punainen |
|
||||
| Valmis | 🟢 | "Qwen2.5-Coder" | `[✓ Valmis]` vihreä |
|
||||
|
||||
### 5.3 Pipeline-tilakone (Codelab)
|
||||
|
||||
```
|
||||
Step 1: WebAssembly-ytimen lataus [◯ → ◷ → ✓]
|
||||
Step 2: Tokenizer (7 MB) [◯ → ◷ → ✓]
|
||||
Step 3: Mallipainot (990 MB) [◯ → ◷ 45% → ✓ cache]
|
||||
Step 4: Mallin rakentaminen [◯ → ◷ → ✓]
|
||||
Step 5: Valmis generoimaan [◯ → ✓]
|
||||
```
|
||||
|
||||
**Seuranta console.log-viesteistä:**
|
||||
```javascript
|
||||
if (msg.includes('[Coder]') && msg.includes('Malli ladattu')) {
|
||||
// Merkkaa kaikki vaiheet valmiiksi (myös cache-hitillä)
|
||||
setStep('step-wasm', 'done');
|
||||
setStep('step-tokenizer', 'done');
|
||||
setStep('step-model', 'done', 'cache');
|
||||
setStep('step-build', 'done');
|
||||
setStep('step-ready', 'done');
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 6. Tietoturva
|
||||
|
||||
### 6.1 XSS-suojaus
|
||||
|
||||
```javascript
|
||||
function esc(str) {
|
||||
return String(str).replace(/&/g,'&').replace(/</g,'<')
|
||||
.replace(/>/g,'>').replace(/"/g,'"');
|
||||
}
|
||||
```
|
||||
|
||||
**Käyttöpaikat:** Kaikki `innerHTML`-insertoinnit joissa on käyttäjä- tai backend-dataa.
|
||||
|
||||
### 6.2 System prompt -piilotus
|
||||
|
||||
```javascript
|
||||
function stripSystemPrompt(prompt) {
|
||||
const parts = prompt.split('\n\n');
|
||||
return parts[parts.length - 1] || prompt;
|
||||
}
|
||||
```
|
||||
|
||||
### 6.3 Viestityyppivalidointi (backend)
|
||||
|
||||
```rust
|
||||
const ALLOWED_MSG_TYPES: &[&str] = &[
|
||||
"auth", "result", "pair_done", "llm_chunk", "llm_done",
|
||||
"llm_error", "download_progress", "user_text", "single_tokenize_done"
|
||||
];
|
||||
|
||||
fn validate_message(text: &str) -> Result<Value, &'static str> {
|
||||
// 1. JSON-parsinta
|
||||
// 2. "type"-kenttä pakollinen
|
||||
// 3. Tyyppi sallittujen listalla
|
||||
// 4. Tyyppikohtainen validointi (esim. pair_done: token_count <= 10000)
|
||||
}
|
||||
```
|
||||
|
||||
### 6.4 Rate limiting
|
||||
|
||||
```rust
|
||||
// Per-IP liukuva ikkuna: max 10 pyyntöä per 60s
|
||||
let entry = limits.entry(addr.ip()).or_insert((now, 0));
|
||||
if now.duration_since(entry.0).as_secs() >= 60 {
|
||||
*entry = (now, 1);
|
||||
} else {
|
||||
entry.1 += 1;
|
||||
if entry.1 > 10 { return 429 Too Many Requests; }
|
||||
}
|
||||
```
|
||||
|
||||
### 6.5 Gamification-huijauksen esto
|
||||
|
||||
```rust
|
||||
// Hub jakaa task_id:n → tallentaa pending_task_ids:hen
|
||||
// Merkkejä jaetaan VAIN jos llm_done sisältää validin task_id:n
|
||||
let valid_task = state.pending_task_ids.lock().unwrap().remove(tid);
|
||||
if active_incentives && valid_task {
|
||||
*balance += 20;
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 7. Syntaksikorostus
|
||||
|
||||
### 7.1 Highlight.js-integraatio
|
||||
|
||||
```html
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/styles/github-dark.min.css">
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/highlight.min.js"></script>
|
||||
```
|
||||
|
||||
```javascript
|
||||
function highlightCode(code) {
|
||||
if (typeof hljs !== 'undefined') {
|
||||
return hljs.highlightAuto(code).value; // Automaattinen kielentunnistus
|
||||
}
|
||||
return esc(code); // Fallback
|
||||
}
|
||||
```
|
||||
|
||||
**Käyttöpaikat:** Codelab-tulokset, agents-terminaalin vastaukset, network-chat.
|
||||
|
||||
---
|
||||
|
||||
## 8. Agenttien orkestrointi
|
||||
|
||||
### 8.1 Multi-agent pipeline
|
||||
|
||||
```
|
||||
┌──────────┐ ┌──────────┐ ┌──────────┐
|
||||
│ Manageri │ ──→ │ Koodari │ ──→ │ Testaaja │
|
||||
│ Analysoi │ │ Koodaa │ │ Arvioi │
|
||||
│ tehtävä │ │ ratkaisu │ │ koodi │
|
||||
└──────────┘ └──────────┘ └──────────┘
|
||||
```
|
||||
|
||||
```javascript
|
||||
async function kpnPipeline(task) {
|
||||
const plan = await kpnRun('qwen-coder', `Analysoi: ${task}`);
|
||||
if (!plan) return;
|
||||
const code = await kpnRun('qwen-coder', `Koodaa: ${plan}`);
|
||||
if (!code) return;
|
||||
await kpnRun('smollm-135m', `Arvioi: ${code}`);
|
||||
}
|
||||
```
|
||||
|
||||
### 8.2 Agenttien promptien hallinta
|
||||
|
||||
```javascript
|
||||
const agentPrompts = {
|
||||
manager: { model: 'qwen-coder', prompt: 'Olet projektipäällikkö...' },
|
||||
coder: { model: 'qwen-coder', prompt: 'Olet ohjelmistokehittäjä...' },
|
||||
// ...
|
||||
};
|
||||
// Tallennetaan localStorage:en per agentti
|
||||
localStorage.setItem('kpn-agent-prompt-coder', customPrompt);
|
||||
```
|
||||
|
||||
### 8.3 Yhteinen promptikonteksti
|
||||
|
||||
```javascript
|
||||
async function kpnRun(model, prompt) {
|
||||
const parts = [];
|
||||
if (sharedPrompt) parts.push(sharedPrompt); // Kaikille yhteinen
|
||||
if (agent.prompt) parts.push(agent.prompt); // Agenttikohtainen
|
||||
parts.push(prompt); // Käyttäjän pyyntö
|
||||
const fullPrompt = parts.join('\n\n');
|
||||
// → HTTP POST /api/v1/chat/completions
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 9. Teknologiapino
|
||||
|
||||
| Kerros | Teknologia | Tarkoitus |
|
||||
|--------|------------|-----------|
|
||||
| Frontend | Vanilla JS + HTML + CSS | Ei build-steppiä, toimii suoraan |
|
||||
| Wasm | Rust + wasm-bindgen | Inferenssi selaimessa |
|
||||
| LLM | Candle (Rust) | Transformer-inferenssi CPU:lla |
|
||||
| Tensorit | Burn (Rust) | GPU-tensorilaskenta (WebGPU/NdArray) |
|
||||
| Backend | Axum + Tokio (Rust) | Async WebSocket + HTTP -palvelin |
|
||||
| Tietokanta | SQLite (rusqlite) | Sessiot ja tulokset |
|
||||
| Cache | IndexedDB | Mallipainot selaimen pysyvässä muistissa |
|
||||
| Korostus | Highlight.js (CDN) | Syntaksikorostus, automaattinen kielentunnistus |
|
||||
| Tokenizer | HuggingFace tokenizers | BPE-tokenisaatio Wasmissa |
|
||||
|
||||
---
|
||||
|
||||
## 10. Jatkokehitysideoita
|
||||
|
||||
Näiden rakennuspalasten pohjalta voi rakentaa:
|
||||
|
||||
- **Oma chat-UI:** WebSocket + streaming + syntaksikorostus
|
||||
- **Hajautettu laskentaverkko:** Hub + node-rekisteri + busy-state + työjono
|
||||
- **Selain-LLM:** Wasm + Candle + IndexedDB-cache + warmup
|
||||
- **Agenttipohjainen työnkulku:** Pipeline + prompt-orkestrointi + reititys
|
||||
- **Terminaaliemulasttori:** Input + historia + tab-completion + dropdown
|
||||
- **Reaaliaikadashboard:** WebSocket broadcast + tilaindikaattorit + metriikat
|
||||
@@ -207,8 +207,8 @@ impl LlmEngine {
|
||||
|
||||
// Stop-sekvenssit: katkaistaan kun malli alkaa selittää
|
||||
let lower = generated_text.to_lowercase();
|
||||
if lower.contains("\n###") || lower.contains("\nexplanation") || lower.contains("\nnote:") || lower.contains("\noutput:") || lower.contains("\n```\n\n") {
|
||||
for stop in &["\n###", "\nExplanation", "\nNote:", "\nOutput:", "\n```\n\n"] {
|
||||
if lower.contains("\n###") || lower.contains("\nexplanation") || lower.contains("\nnote:") || lower.contains("\noutput:") || lower.contains("\n```\n\n") || lower.contains("\n// example") || lower.contains("\n# example") {
|
||||
for stop in &["\n###", "\nExplanation", "\nNote:", "\nOutput:", "\n```\n\n", "\n// Example", "\n// example", "\n# Example", "\n# example"] {
|
||||
if let Some(pos) = generated_text.find(stop) {
|
||||
generated_text.truncate(pos);
|
||||
}
|
||||
@@ -234,33 +234,50 @@ impl LlmEngine {
|
||||
}
|
||||
}
|
||||
|
||||
/// Poistaa mallin tuottaman markdown-wrapperin ja johdantotekstin.
|
||||
const LANG_TAGS: &[&str] = &[
|
||||
"python", "py", "rust", "rs", "javascript", "js", "typescript", "ts",
|
||||
"java", "kotlin", "scala", "go", "ruby", "rb", "php", "swift",
|
||||
"c", "cpp", "c++", "c#", "csharp", "r", "sql", "bash", "sh", "zsh",
|
||||
"html", "css", "json", "yaml", "yml", "toml", "xml", "markdown", "md",
|
||||
"lua", "perl", "dart", "elixir", "haskell", "hs", "ocaml", "zig",
|
||||
"plaintext", "text", "txt",
|
||||
];
|
||||
|
||||
/// Siivoa mallin tuottama vastaus (prefill-yhteensopiva).
|
||||
fn strip_markdown_wrapper(text: &str) -> String {
|
||||
let text = text.trim();
|
||||
if let Some(start) = text.find("```") {
|
||||
let after = &text[start + 3..];
|
||||
let code_start = after.find('\n').map(|i| i + 1).unwrap_or(0);
|
||||
let code = &after[code_start..];
|
||||
if let Some(end) = code.find("```") {
|
||||
return code[..end].trim().to_string();
|
||||
}
|
||||
return code.trim().to_string();
|
||||
}
|
||||
let mut result = text.to_string();
|
||||
let lower = result.to_lowercase();
|
||||
for prefix in &["sure!", "here is", "here's", "certainly!", "below is"] {
|
||||
if lower.starts_with(prefix) {
|
||||
let mut result = text.trim().to_string();
|
||||
|
||||
// 1. Kielitunniste — VAIN tunnettu kieli
|
||||
if let Some(nl) = result.find('\n') {
|
||||
let first = result[..nl].trim().to_lowercase();
|
||||
if LANG_TAGS.contains(&first.as_str()) {
|
||||
result = result[nl + 1..].to_string();
|
||||
}
|
||||
}
|
||||
|
||||
// 2. Sulkeva ``` — VAIN omalla rivillään lopussa
|
||||
let trimmed = result.trim_end();
|
||||
if trimmed.ends_with("```") {
|
||||
let before = &trimmed[..trimmed.len() - 3];
|
||||
if before.is_empty() || before.ends_with('\n') {
|
||||
result = before.trim_end().to_string();
|
||||
}
|
||||
}
|
||||
|
||||
// 3. Johdantolauseet
|
||||
let lower = result.trim().to_lowercase();
|
||||
for prefix in &["sure!", "here is", "here's", "certainly!", "below is"] {
|
||||
if lower.starts_with(prefix) {
|
||||
if let Some(nl) = result.find('\n') { result = result[nl + 1..].to_string(); }
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// 4. Selityskommentit alusta
|
||||
let mut lines: Vec<&str> = result.trim().lines().collect();
|
||||
while !lines.is_empty() {
|
||||
let first = lines[0].trim();
|
||||
let is_preamble = first.starts_with("# ")
|
||||
&& !first.starts_with("#!")
|
||||
let is_preamble = first.starts_with("# ") && !first.starts_with("#!")
|
||||
&& (first.to_lowercase().contains("this is")
|
||||
|| first.to_lowercase().contains("simple")
|
||||
|| first.to_lowercase().contains("program that")
|
||||
|
||||
@@ -27,26 +27,42 @@ struct CachedModel {
|
||||
is_3b: bool,
|
||||
}
|
||||
|
||||
/// Poistaa mallin tuottaman markdown-wrapperin ja johdantotekstin.
|
||||
/// "Sure! Here is...\n```python\nprint('hi')\n```" → "print('hi')"
|
||||
/// Tunnetut kielitunnisteet joita malli voi tuottaa prefill-backtickien jälkeen.
|
||||
const LANG_TAGS: &[&str] = &[
|
||||
"python", "py", "rust", "rs", "javascript", "js", "typescript", "ts",
|
||||
"java", "kotlin", "scala", "go", "ruby", "rb", "php", "swift",
|
||||
"c", "cpp", "c++", "c#", "csharp", "r", "sql", "bash", "sh", "zsh",
|
||||
"html", "css", "json", "yaml", "yml", "toml", "xml", "markdown", "md",
|
||||
"lua", "perl", "dart", "elixir", "haskell", "hs", "ocaml", "zig",
|
||||
"plaintext", "text", "txt",
|
||||
];
|
||||
|
||||
/// Siivoa mallin tuottama vastaus.
|
||||
/// Prefill-tekniikan vuoksi malli tuottaa: "rust\nfn main() {...}\n```"
|
||||
/// eli kielitunniste alussa + sulkeva ``` lopussa. Molemmat poistetaan.
|
||||
fn strip_markdown_wrapper(text: &str) -> String {
|
||||
let text = text.trim();
|
||||
// Jos vastaus sisältää ```-koodiblokin, ota vain sen sisältö
|
||||
if let Some(start) = text.find("```") {
|
||||
let after_backticks = &text[start + 3..];
|
||||
// Ohita mahdollinen kielitunniste (```python, ```rust jne.)
|
||||
let code_start = after_backticks.find('\n').map(|i| i + 1).unwrap_or(0);
|
||||
let code = &after_backticks[code_start..];
|
||||
// Etsi sulkeva ```
|
||||
if let Some(end) = code.find("```") {
|
||||
return code[..end].trim().to_string();
|
||||
let mut result = text.trim().to_string();
|
||||
|
||||
// 1. Poistetaan kielitunniste ensimmäiseltä riviltä — VAIN jos se on tunnettu kieli
|
||||
if let Some(first_newline) = result.find('\n') {
|
||||
let first_line = result[..first_newline].trim().to_lowercase();
|
||||
if LANG_TAGS.contains(&first_line.as_str()) {
|
||||
result = result[first_newline + 1..].to_string();
|
||||
}
|
||||
// Ei sulkevaa ``` — ota kaikki loput
|
||||
return code.trim().to_string();
|
||||
}
|
||||
// Ei koodiblokkia — poista yleiset johdantolauseet ja selityskommentit alusta
|
||||
let mut result = text.to_string();
|
||||
let lower = result.to_lowercase();
|
||||
|
||||
// 2. Poistetaan sulkeva ``` VAIN jos se on omalla rivillään lopussa
|
||||
let trimmed = result.trim_end();
|
||||
if trimmed.ends_with("```") {
|
||||
let before = &trimmed[..trimmed.len() - 3];
|
||||
// Varmistetaan: edellinen merkki on rivinvaihto tai alku (eli ``` on oma rivinsä)
|
||||
if before.is_empty() || before.ends_with('\n') {
|
||||
result = before.trim_end().to_string();
|
||||
}
|
||||
}
|
||||
|
||||
// 3. Poistetaan johdantolauseet: "Sure! Here is...", "Certainly!" jne.
|
||||
let lower = result.trim().to_lowercase();
|
||||
for prefix in &["sure!", "here is", "here's", "certainly!", "below is"] {
|
||||
if lower.starts_with(prefix) {
|
||||
if let Some(newline) = result.find('\n') {
|
||||
@@ -55,12 +71,12 @@ fn strip_markdown_wrapper(text: &str) -> String {
|
||||
break;
|
||||
}
|
||||
}
|
||||
// Poistetaan alun selityskommentit: "# This is a simple..." -tyyppiset rivit
|
||||
// jotka eivät ole osa varsinaista koodia (esim. shebangia #! pidetään)
|
||||
|
||||
// 4. Poistetaan selityskommentit alusta: "# This is a simple program..."
|
||||
let mut lines: Vec<&str> = result.trim().lines().collect();
|
||||
while !lines.is_empty() {
|
||||
let first = lines[0].trim();
|
||||
let is_preamble_comment = first.starts_with("# ")
|
||||
let is_preamble = first.starts_with("# ")
|
||||
&& !first.starts_with("#!")
|
||||
&& (first.to_lowercase().contains("this is")
|
||||
|| first.to_lowercase().contains("simple")
|
||||
@@ -68,12 +84,9 @@ fn strip_markdown_wrapper(text: &str) -> String {
|
||||
|| first.to_lowercase().contains("here is")
|
||||
|| first.to_lowercase().contains("the following")
|
||||
|| first.to_lowercase().contains("below"));
|
||||
if is_preamble_comment {
|
||||
lines.remove(0);
|
||||
} else {
|
||||
break;
|
||||
}
|
||||
if is_preamble { lines.remove(0); } else { break; }
|
||||
}
|
||||
|
||||
lines.join("\n").trim().to_string()
|
||||
}
|
||||
|
||||
@@ -245,13 +258,13 @@ pub async fn run_coder_inference(prompt: String, ws: Rc<RefCell<WebSocket>>, use
|
||||
if let Ok(json) = serde_json::from_str::<serde_json::Value>(&prompt) {
|
||||
let p = json.get("prompt").and_then(|v| v.as_str()).unwrap_or(&prompt).to_string();
|
||||
let s = json.get("system").and_then(|v| v.as_str()).unwrap_or(default_system).to_string();
|
||||
let m = json.get("max_tokens").and_then(|v| v.as_u64()).unwrap_or(128) as usize;
|
||||
let m = json.get("max_tokens").and_then(|v| v.as_u64()).unwrap_or(256) as usize;
|
||||
(p, s, m)
|
||||
} else {
|
||||
(prompt.clone(), default_system.to_string(), 128)
|
||||
(prompt.clone(), default_system.to_string(), 256)
|
||||
}
|
||||
} else {
|
||||
(prompt.clone(), default_system.to_string(), 128)
|
||||
(prompt.clone(), default_system.to_string(), 256)
|
||||
};
|
||||
|
||||
// Prefill: aloitetaan vastaus ```-koodiblokkilla, jolloin malli jatkaa suoraan koodilla
|
||||
@@ -329,8 +342,8 @@ pub async fn run_coder_inference(prompt: String, ws: Rc<RefCell<WebSocket>>, use
|
||||
|
||||
// Stop-sekvenssit: katkaistaan kun malli alkaa selittää
|
||||
let lower = generated_text.to_lowercase();
|
||||
if lower.contains("\n###") || lower.contains("\nexplanation") || lower.contains("\nnote:") || lower.contains("\noutput:") || lower.contains("\n```\n\n") {
|
||||
for stop in &["\n###", "\nExplanation", "\nNote:", "\nOutput:", "\n```\n\n"] {
|
||||
if lower.contains("\n###") || lower.contains("\nexplanation") || lower.contains("\nnote:") || lower.contains("\noutput:") || lower.contains("\n```\n\n") || lower.contains("\n// example") || lower.contains("\n# example") {
|
||||
for stop in &["\n###", "\nExplanation", "\nNote:", "\nOutput:", "\n```\n\n", "\n// Example", "\n// example", "\n# Example", "\n# example"] {
|
||||
if let Some(pos) = generated_text.find(stop) {
|
||||
generated_text.truncate(pos);
|
||||
}
|
||||
|
||||
@@ -1491,12 +1491,19 @@
|
||||
let detectedWebGPU = false;
|
||||
let detectedGpuInfo = null;
|
||||
let wasmInitialized = false;
|
||||
let coderSize = '05b'; // '05b' tai '3b'
|
||||
let coderSize = localStorage.getItem('kpn-coder-size') || '05b';
|
||||
|
||||
// Mallivalinnan radio-napit
|
||||
// Mallivalinnan radio-napit — asetetaan oikea valinta localStoragesta
|
||||
const savedRadio = document.querySelector(`input[name="coder-size"][value="${coderSize}"]`);
|
||||
if (savedRadio) savedRadio.checked = true;
|
||||
if (coderSize === '3b') {
|
||||
document.getElementById('coder-opt-05b')?.style && (document.getElementById('coder-opt-05b').style.borderColor = 'var(--border-color)');
|
||||
document.getElementById('coder-opt-3b')?.style && (document.getElementById('coder-opt-3b').style.borderColor = 'var(--accent-color)');
|
||||
}
|
||||
document.querySelectorAll('input[name="coder-size"]').forEach(radio => {
|
||||
radio.addEventListener('change', (e) => {
|
||||
coderSize = e.target.value;
|
||||
localStorage.setItem('kpn-coder-size', coderSize);
|
||||
// Visuaalinen korostus
|
||||
document.getElementById('coder-opt-05b').style.borderColor = coderSize === '05b' ? 'var(--accent-color)' : 'var(--border-color)';
|
||||
document.getElementById('coder-opt-3b').style.borderColor = coderSize === '3b' ? 'var(--accent-color)' : 'var(--border-color)';
|
||||
@@ -1849,14 +1856,37 @@
|
||||
}
|
||||
|
||||
if (sub === 'load') {
|
||||
const arg = parts[2];
|
||||
const btn = document.getElementById('agent-compute-btn');
|
||||
if (btn && btn.dataset.state === 'ready') {
|
||||
termLog(' ✓ Kielimalli on jo ladattu ja valmis', '#3fb950');
|
||||
} else {
|
||||
termLog(' Alustetaan laskentasolmua...', '#d29922');
|
||||
if (btn) btn.click(); // Käytetään samaa logiikkaa kuin napissa
|
||||
else ensureCoderNode();
|
||||
// Mallikatalogista valinta numerolla tai nimellä
|
||||
const loadModels = [
|
||||
{ id: '1', key: '05b', name: 'Qwen2.5-Coder:0.5B', size: '~990 MB', coderSize: '05b' },
|
||||
{ id: '2', key: '3b', name: 'Qwen2.5-Coder:3B', size: '~6.2 GB', coderSize: '3b' },
|
||||
];
|
||||
if (!arg) {
|
||||
// Näytetään lista
|
||||
termLog(' Ladattavat mallit:', '#c9d1d9');
|
||||
for (const m of loadModels) {
|
||||
const active = (btn?.dataset.state === 'ready' && coderSize === m.coderSize) ? ' <span style="color:#3fb950">✓ ladattu</span>' : '';
|
||||
termLog(` <span style="color:#58a6ff">${m.id}</span> ${m.name} <span style="color:#8b949e">(${m.size})</span>${active}`);
|
||||
}
|
||||
termLog(' Käyttö: kpn load <numero>', '#8b949e');
|
||||
return;
|
||||
}
|
||||
const selected = loadModels.find(m => m.id === arg || m.key === arg || m.coderSize === arg);
|
||||
if (!selected) {
|
||||
termLog(` Tuntematon malli "${esc(arg)}". Kokeile: kpn load`, '#f85149');
|
||||
return;
|
||||
}
|
||||
if (btn?.dataset.state === 'ready' && coderSize === selected.coderSize) {
|
||||
termLog(` ✓ ${selected.name} on jo ladattu ja valmis`, '#3fb950');
|
||||
return;
|
||||
}
|
||||
coderSize = selected.coderSize;
|
||||
localStorage.setItem('kpn-coder-size', coderSize);
|
||||
termLog(` Alustetaan ${selected.name} (${selected.size})...`, '#d29922');
|
||||
if (btn) btn.click();
|
||||
else ensureCoderNode();
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -1868,11 +1898,14 @@
|
||||
}
|
||||
|
||||
if (sub === 'models') {
|
||||
termLog(' smollm-135m — SmolLM 135M (kevyt)', '#a5d6ff');
|
||||
termLog(' qwen-05b — Qwen2.5 0.5B', '#a5d6ff');
|
||||
termLog(' phi3-mini — Phi-3 Mini', '#a5d6ff');
|
||||
termLog(' qwen-coder — Qwen2.5-Coder 0.5B', '#a5d6ff');
|
||||
termLog(' qwen-coder-3b — Qwen2.5-Coder 3B', '#a5d6ff');
|
||||
termLog(' Käytettävissä olevat mallit:', '#c9d1d9');
|
||||
termLog(' <span style="color:#58a6ff">1</span> qwen-coder Qwen2.5-Coder:0.5B <span style="color:#8b949e">~990 MB | koodin generointi</span>');
|
||||
termLog(' <span style="color:#58a6ff">2</span> qwen-coder-3b Qwen2.5-Coder:3B <span style="color:#8b949e">~6.2 GB | parempi koodinlaatu</span>');
|
||||
termLog(' <span style="color:#58a6ff">3</span> smollm-135m SmolLM 135M <span style="color:#8b949e">~270 MB | kevyt, nopea</span>');
|
||||
termLog(' <span style="color:#58a6ff">4</span> qwen-05b Qwen2.5:0.5B <span style="color:#8b949e">~990 MB | yleismalli</span>');
|
||||
termLog(' <span style="color:#58a6ff">5</span> phi3-mini Phi-3 Mini <span style="color:#8b949e">~2.2 GB | Microsoftin malli</span>');
|
||||
termLog(' Käyttö: kpn run <malli> "<prompti>"', '#8b949e');
|
||||
termLog(' Lataus: kpn load <numero>', '#8b949e');
|
||||
return;
|
||||
}
|
||||
|
||||
@@ -1905,7 +1938,9 @@
|
||||
}
|
||||
|
||||
// Jos käyttäjä syötti agentin nimen (esim. "coder"), vaihdetaan se oikeaksi tekoälymalliksi ("qwen-coder")
|
||||
if (agentPrompts[model]) {
|
||||
if (model === 'coder-3b') {
|
||||
model = 'qwen-coder-3b';
|
||||
} else if (agentPrompts[model]) {
|
||||
model = agentPrompts[model].model;
|
||||
}
|
||||
|
||||
@@ -1919,12 +1954,14 @@
|
||||
// Tab-completion: ennustava komennonsyöttö sana kerrallaan
|
||||
const kpnCommands = {
|
||||
'kpn': ['help', 'run', 'pipeline', 'load', 'status', 'models', 'hello', 'clear'],
|
||||
'kpn run': ['coder', 'manager', 'tester', 'qa', 'data', 'observer', 'qwen-coder', 'smollm-135m', 'qwen-05b', 'phi3-mini'],
|
||||
'kpn run': ['coder', 'coder-3b', 'manager', 'tester', 'qa', 'data', 'observer', 'qwen-coder', 'qwen-coder-3b', 'smollm-135m', 'qwen-05b', 'phi3-mini'],
|
||||
'kpn load': ['1', '2'],
|
||||
'kpn pipeline': ['"'],
|
||||
};
|
||||
// Esimerkkipromptit malleittain
|
||||
const kpnExamples = {
|
||||
'kpn run coder': ['"hello world in python"', '"fibonacci in rust"', '"quicksort in javascript"'],
|
||||
'kpn run coder-3b': ['"binary search tree in rust"', '"REST API with Flask"', '"async web scraper in python"'],
|
||||
'kpn run manager': ['"suunnittele REST API"', '"priorisoi tiimin tehtävät"'],
|
||||
'kpn run tester': ['"testaa login-toiminto"'],
|
||||
'kpn pipeline': ['"rakenna todo-sovellus"', '"tee laskin pythonilla"'],
|
||||
@@ -2446,7 +2483,8 @@
|
||||
: `→ ${msg} — generoidaan...`;
|
||||
}
|
||||
} else if (data.type === "llm_prompt") {
|
||||
if (data.task_id) {
|
||||
// Reagoidaan VAIN agents-pipelinen tehtäviin (task_id + activeStreams)
|
||||
if (data.task_id && activeStreams[data.task_id]) {
|
||||
const term = document.getElementById('agent-terminal');
|
||||
if (term) {
|
||||
const model = data.model || 'llm';
|
||||
@@ -2458,7 +2496,8 @@
|
||||
while (term.children.length > 50 && !term.firstChild.querySelector('.stream-content')) term.removeChild(term.firstChild);
|
||||
term.scrollTop = term.scrollHeight;
|
||||
}
|
||||
}
|
||||
|
||||
// Avatar-aktivointi vain omille tehtäville
|
||||
document.querySelectorAll('.avatar-card').forEach(c => c.classList.remove('active'));
|
||||
const model = data.model || '';
|
||||
const p = data.prompt ? data.prompt.toLowerCase() : '';
|
||||
@@ -2472,12 +2511,11 @@
|
||||
} else if (p.includes('test')) {
|
||||
document.getElementById('avatar-qa')?.classList.add('active');
|
||||
} else if (model.includes('coder') || model.includes('Coder')) {
|
||||
// Koodari aktivoituu, jos kyse on suoraan koodarille osoitetusta mallitehtävästä (esim. network task)
|
||||
document.getElementById('avatar-coder')?.classList.add('active');
|
||||
} else if (model.includes('deepseek') || model.includes('r1')) {
|
||||
document.getElementById('avatar-observer')?.classList.add('active');
|
||||
}
|
||||
// Emme enää aseta oletusagenttia, jottei tuntemattomissa verkkopyynnöissä mikään turhaan hypi silmille.
|
||||
}
|
||||
}
|
||||
} catch(e) {}
|
||||
};
|
||||
@@ -2746,6 +2784,7 @@
|
||||
if (cd) cd.style.background = '#3fb950';
|
||||
if (cl) { cl.textContent = 'Qwen2.5-Coder'; cl.style.color = '#3fb950'; }
|
||||
if (btn) { btn.dataset.state = 'ready'; btn.textContent = '✓ Valmis'; btn.style.borderColor = '#3fb950'; btn.style.color = '#3fb950'; btn.style.cursor = 'default'; btn.title = 'Kielimalli ladattu — oma kone on valmis laskentaan'; }
|
||||
localStorage.setItem('kpn-coder-loaded', 'true');
|
||||
}
|
||||
if (msg.includes('[Coder]') && msg.includes('Syöte:')) {
|
||||
// Pipeline piiloon kun generointi alkaa
|
||||
@@ -2832,7 +2871,11 @@
|
||||
}
|
||||
}
|
||||
|
||||
// Agents-sivun coder-node käynnistetään "Alusta laskentasolmu" -napista tai kpn load -komennolla
|
||||
// Automaattinen uudelleenkäynnistys: jos malli oli ladattu ennen refreshiä, ladataan se uudelleen cachesta
|
||||
if (localStorage.getItem('kpn-coder-loaded') === 'true') {
|
||||
// Pieni viive jotta UI ehtii piirtyä
|
||||
setTimeout(() => ensureCoderNode(), 500);
|
||||
}
|
||||
|
||||
// Laskentasolmun käynnistys/pysäytys -nappi
|
||||
let computeAbortController = null;
|
||||
|
||||
Reference in New Issue
Block a user