# WebGPU Uyumluluk Rehberi

## Mevcut Durum (Guncelleme: 2024-12)

WebGPU altyapisi hazir, ancak mevcut sahnelerde custom isiklar oldugu icin `FORCE_WEBGL2 = true`.

---

## Tamamlanan Calismalar

### 1. Renderer Factory Sistemi ✅

**Dosya:** `FikoRendererFactory.ts`

WebGPU/WebGL2 auto-detection ve fallback sistemi:

```typescript
const renderer = await FikoRendererFactory.createRenderer({
  canvas: myCanvas,
  antialias: true
}, 'auto'); // 'auto' | 'webgpu' | 'webgl2'

// Tip kontrolu
FikoRendererFactory.isWebGPU(renderer)
FikoRendererFactory.isWebGL2(renderer)
```

### 2. Light Factory Sistemi ✅

**Dosya:** `FikoLightFactory.ts`

WebGPU'da native Three.js isiklari, WebGL2'de custom siniflar:

```typescript
// WebGPU uyumlu isik olusturma
const light = await FikoLightFactory.createDirectionalLight(sahne, 'Isik1');
const ambient = await FikoLightFactory.createAmbientLight(sahne, 'Ortam1');

// Renderer modunu ayarla (baslatmada)
FikoLightFactory.setRendererMode(renderer);
```

**WebGPU Modu:**
- `THREE.DirectionalLight` + userData
- `THREE.AmbientLight` + userData
- `THREE.SpotLight` + userData

**WebGL2 Modu:**
- `FikoIsikYonsel` (custom class)
- `FikoIsikOrtam` (custom class)
- `FikoIsikSpotlight` (custom class)

### 3. Line Material Factory ✅

**Dosya:** `FikoLineMaterialFactory.ts`

WebGPU'da LineBasicMaterial fallback:

```typescript
const material = FikoLineMaterialFactory.create(renderer, {
  color: 0xff0000,
  linewidth: 2
});

// Resolution guncelleme (resize sonrasi)
FikoLineMaterialFactory.updateResolution(renderer);
```

### 4. FikoIsiklar Async Metodlar ✅

**Dosya:** `FikoIsiklar.ts`

Yeni async metodlar eklendi:

```typescript
// WebGPU uyumlu
await isiklar.ekleFikoOrtamIsikAsync('Ortam1');
await isiklar.ekleFikoYonselIsikAsync('Yonsel1');

// Eski metodlar (WebGL2 only, deprecated)
isiklar.ekleFikoOrtamIsik('Ortam1');
isiklar.ekleFikoYonselIsik('Yonsel1');
```

---

## WebGPU Uyumsuzluk Nedenleri

### Sorun 1: Custom Light Siniflari

**Hata:**
```
LightsNode.setupNodeLights: Light node not found for FikoIsikOrtam
LightsNode.setupNodeLights: Light node not found for _FikoIsikYonsel
```

**Sebep:**
WebGPU Node sistemi `constructor.name` kullanarak isik tipini belirliyor.
Custom siniflar (`FikoIsikYonsel`, `FikoIsikOrtam`) kayitli degil.

**Cozum:**
`FikoLightFactory` WebGPU modunda native Three.js siniflarini kullaniyor.

### Sorun 2: LineMaterial

**Hata:**
```
NodeMaterial: Material "LineMaterial" is not compatible.
```

**Sebep:**
`LineMaterial` WebGPU Node sisteminde desteklenmiyor.

**Cozum:**
`FikoLineMaterialFactory` WebGPU modunda `LineBasicMaterial` kullaniyor.

---

## WebGPU Gecis Plani

### Faz 1: Altyapi ✅ TAMAMLANDI
- [x] `FikoRendererFactory.ts` - Renderer factory
- [x] `FikoLightFactory.ts` - Light factory (native/custom)
- [x] `FikoLineMaterialFactory.ts` - Line material factory
- [x] `FikoWebGPULightNodes.ts` - Node registration denemesi
- [x] `FikoIsiklar.ts` - Async metodlar eklendi

### Faz 2: Sahne Donusumu (Yapilacak)
- [ ] Mevcut sahnelerde `FikoIsikYonsel` → native `DirectionalLight` donusumu
- [ ] Mevcut sahnelerde `FikoIsikOrtam` → native `AmbientLight` donusumu
- [ ] Sahne yuklenirken renderer moduna gore isik olusturma

### Faz 3: LineMaterial Donusumu (Yapilacak)
- [ ] `FikoOlcumCizgisi.ts` - Material pool guncellenmeli
- [ ] `FikoInstancedEdgeRenderer.ts` - Line material factory kullanmali
- [ ] `fiko-highlight.service.ts` - LineMaterial guncellenmeli

### Faz 4: WebGPU Aktif
- [ ] `FORCE_WEBGL2 = false` yap
- [ ] Tum testleri gecir
- [ ] Performans karsilastirmasi

---

## Test Komutlari

```javascript
// Console'da renderer tipini kontrol et
fikoThreeJs.rendererType

// WebGPU'yu zorla test et (gelistirici)
localStorage.setItem('FikoThreeJSAyarlari', JSON.stringify({rendererType: 'webgpu'}));
location.reload();

// WebGL2'ye geri don
localStorage.removeItem('FikoThreeJSAyarlari');
location.reload();

// Light factory modu
FikoLightFactory.isWebGPU
```

---

## Eklenen Dosyalar

| Dosya | Aciklama |
|-------|----------|
| `FikoRendererFactory.ts` | WebGPU/WebGL2 renderer factory |
| `FikoLightFactory.ts` | Native/Custom light factory |
| `FikoLineMaterialFactory.ts` | Line material factory |
| `FikoWebGPULightNodes.ts` | Node registration (deneme) |

---

## Notlar

- Three.js 0.177.0 WebGPU destegi **experimental**
- WebGPU avantajlari: Compute shaders, daha iyi CPU-GPU paralelligi
- Mevcut `FikoWebGPU.ts` compute pipeline zaten calisiyor
- `FORCE_WEBGL2 = true` oldugu icin sistem stabil WebGL2 kullanıyor
- WebGPU gecisi icin mevcut sahnelerdeki custom isiklarin donusturulmesi gerekiyor