# Task 2 Report: [Texture / Visual Surface Change]

## Objective
Apply a texture or change the surface appearance of an object interactively.

## Vanilla Three.js
- Possible: **Yes**
- Notes: Requires using `TextureLoader` to load assets and manually assigning the texture to the material's `map` property.
- Key concepts: `THREE.TextureLoader`, `Asset URL Management`, `Material Map`.
- Complexity: **Easy but verbose** (Needs explicit code for every asset loader).

## R3F
- Possible: **Yes**
- Notes: Highly efficient. The `useLoader` hook (with `TextureLoader`) handles asset loading declaratively and integrates with React Suspense.
- What R3F abstracted: `Loading callbacks`, `Declarative asset loading`, `Suspense integration`.
- Complexity: **Easy** (Very concise, 1-2 lines of code).

## Thob Page Builder
- Possible: **Yes**
- Notes: **Significantly faster** than code-based approaches for simple asset application. You simply select a file or link a URL in the UI, and the mesh updates instantly.
- Builder steps: `Canvas > Mesh > Material > Map > Browse/URL`.
- Complexity: **Minimal** (Completely No-Code).

## Comparison Summary
- Possible in all 3? **Yes**.
- Key abstraction difference:
  - Vanilla = imperative asset handling  
  - R3F = declarative asset loading  
  - Thob = UI-driven asset configuration  

- Main differences:
  - **Vanilla**: Gives full control, but requires several lines of code for a single texture.
  - **R3F**: The fastest way to write complex texture logic with simple code.
  - **Thob**: The fastest overall for visual users. No code required for initial mapping.

- Where Thob is better: **Applying a visual asset that you already have.**

- Where Thob is weaker:
  - **Asset error handling**. When a texture fails (like CORS/404 errors), it’s harder to debug than in code.
  - **Limited flexibility for complex material setups**. Applying different textures to different faces of a single object is not straightforward compared to code-based approaches.

- What feels awkward or unclear:
  - The CORS issues for external assets make it difficult to link textures that aren't already in the Thob library.

## Limitation Type (if any)
- [ ] Editor UX limitation
- [x] Runtime limitation (CORS/URL fetching)
- [ ] Schema / data model limitation
- [ ] Component limitation
- [ ] Event system limitation
- [ ] Property binding limitation
- [x] Asset pipeline limitation
- [ ] Unknown / needs investigation

## Workaround
- Is there a workaround? **Yes**. Ensure all assets are uploaded directly to the Thob project rather than linking from external URLs to avoid CORS blocks.

## Suggested Improvement
- What should improve in Thob? **Improve the asset importer** to handle external URL fetching with a proxy to avoid CORS blocks. Provide more descriptive "Map Loading" feedback in the UI.
- Is it:
  - editor (Yes)
  - runtime (Yes)
  - component (No)
  - UX (Yes)
  - schema/data (Yes)

## Difficulty Estimate
- **Easy**

## Business Value
- **High** (Asset application is a core part of 3D design workflows).

## Recommendation
Thob is already **strong** in texture application. The speed advantage over R3F and Vanilla is clear for visual workflows. To make it production-ready, it should improve external asset handling and support more flexible material configurations.