anshk/builder-research
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: added task notes and builder notes

Browse Source
This commit is contained in:
anshk 2026-03-26 20:10:35 +05:30
parent 9f0f74617d
commit 5d3475ebf0
2 changed files with 131 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
Week-1/Task-1/TaskNotes.md
View File

@ -1,60 +1,66 @@
# Task: [Feature Name]
# Task: Parent-Child Hierarchy
## Objective
What is the feature trying to do?
The objective was to create a simple 3D scene with two objects in a parent-child hierarchy, then verify that transformations applied to the parent (such as position and scale) are correctly inherited by the child.
## Vanilla three.js
-Possible: Yes / Partial / No
-Notes:
-Key concepts:
-Complexity: Easy / Medium / Hard
- Possible: Yes
- Notes: Implemented by creating sunMesh and attaching an earthOrbit group to it (`sunMesh.add(earthOrbit)`), then adding earthMesh to that group. Parent transforms propagate correctly to child.
- Key concepts: Scene graph hierarchy, `THREE.Group` as orbit pivot, local vs world transforms, animation loop for orbit/spin.
- Complexity: Easy
## R3F
-Possible: Yes / Partial / No
-Notes:
-What R3F abstracted:
-Complexity: Easy / Medium / Hard
- Possible: Yes
- Notes: Implemented by nesting Earth inside a `<group ref={orbitRef}>` inside the Sun `<mesh>`, making Earth a child in the same scene graph hierarchy.
- What R3F abstracted: Declarative JSX scene creation, automatic render lifecycle integration with React, and frame updates via `useFrame` instead of manual renderer/loop setup.
- Complexity: Easy
## Thob Page Builder
-Possible: Yes / Partial / No
-Notes:
-Builder steps:
-Complexity: Easy / Medium / Hard
- Possible: Yes
- Notes: Implemented by putting the Earth mesh inside the Sun mesh (parent-child). Changing Sun position/scale also affects Earth as expected (Earth follows position and scale inheritance). However, when Earth position is changed directly, Earth shape appears to distort/stretch as it moves farther from Sun.
- Builder steps: Create Sun mesh -> add Earth mesh as child of Sun -> test parent transform inheritance by changing Sun position/scale -> test child local transform by changing Earth position.
- Complexity: Easy
## Comparison Summary
-Possible in all 3? Yes / Partial / No
-Main differences:
-Where Thob is better:
-Where Thob is weaker:
-What feels awkward or unclear:
- Possible in all 3? Yes
- Main differences:
- Vanilla gives explicit low-level control;
- R3F gives cleaner declarative hierarchy;
- Thob gives fastest visual setup but less predictable child transform behavior in this case.
- Animation was not possible in Thob but was possible in vanilla and r3f.
- Where Thob is better: Quick setup and visual parenting without writing code.
- Where Thob is weaker: Child transform behavior is less transparent when editing child position under a transformed parent.
- What feels awkward or unclear: Local vs inherited transforms are not obvious in the editor, and distortion behavior on child position change is unexpected.
## Limitation Type (if any)
-[ ] Editor UX limitation
-[ ] Runtime limitation
-[ ] Schema / data model limitation
-[ ] Component limitation
-[ ] Event system limitation
-[ ] Asset pipeline limitation
-[ ] Unknown / needs investigation
- [x] Editor UX limitation
- [x] Runtime limitation
- [ ] Schema / data model limitation
- [x] Component limitation
- [ ] Event system limitation
- [ ] Asset pipeline limitation
- [ ] Unknown / needs investigation
## Workaround
-Is there a workaround?
-If yes, what is it?
- Is there a workaround?
- NO
- No, I tried a lot of different things, like many groupa and flex inside the parent mesh and different ways to place the components.
## Suggested Improvement
-What should improve in Thob?
-Is it:
-editor
-runtime
-component
-UX
-schema/data
- What should improve in Thob?
- Make transform inheritance behavior explicit and stable for nested meshes, especially when parent scale is applied and child position is edited.
- It is:
- editor
- component
- runtime
- UX
## Difficulty Estimate
-Easy / Medium / Hard
Easy
## Business Value
-Low / Medium / High
High
## Recommendation
Should Thob support this better? Why?
Should Thob support this better? Why?
- Yes. Parent-child transform consistency is a core 3D workflow; reliable nested transforms reduce confusion, improve trust in the builder, and make more advanced scenes practical without code-level debugging.

87
Week-1/Task-1/builder/BuilderNotes.md Normal file
View File

@ -0,0 +1,87 @@
# Builder Notes (Thob) — Task 1: Parent-Child Hierarchy
## Thob Observations from Task Notes
- **Possible:** Yes
- **Implementation used:** Earth mesh was placed inside Sun mesh to create a parent-child relationship.
- **What worked as expected:**
- Changing Sun position moved Earth with it.
- Changing Sun scale also scaled Earth (inherited transform behavior).
- **Unexpected behavior observed:**
- Changing Earth position directly caused visual distortion/stretch-like behavior as Earth moved farther from Sun.
- **Builder flow used:**
1. Create Sun mesh.
2. Add Earth mesh as child of Sun.
3. Change Sun position/scale to verify inheritance.
4. Change Earth local position to test child transform.
- **Complexity:** Easy
- **Main limitation signals:** Editor UX + Component + Runtime concerns.
- **Workaround status:** No reliable workaround found after trying multiple groups/flex layouts and different placement approaches.
## Console Warnings/Errors Seen (Deduplicated) and Probable Meaning
### warn: `Permissions-Policy header unrecognized feature ('browsing-topics')`
- **Type:** Browser/header compatibility warning.
- **Probable meaning:** A server response includes a `Permissions-Policy` directive with `browsing-topics`, but the browser/runtime does not recognize it.
- **Impact:** Usually low for editor functionality; mostly noise unless policy enforcement is required.
### warn: `Component changing from uncontrolled to controlled`
- **Type:** React state-management warning.
- **Probable meaning:** UI components are initialized without a stable value and later receive a controlled value (or vice versa).
- **Impact:** Can cause flaky UI behavior (selection glitches, inconsistent panel state), especially in property editors.
### warn: `GetBindingData... method already registered`
- **Type:** Internal registration/duplicate listener warning.
- **Probable meaning:** Binding handlers are being registered repeatedly (possibly on rerender/remount) without proper cleanup/de-duplication.
- **Impact:** High log noise, possible duplicated updates, degraded performance over time.
### warn: `resetPOI/update-static-component-prop method already registered`
- **Type:** Duplicate method registration warning.
- **Probable meaning:** Same command/event pipeline is attached multiple times.
- **Impact:** Multiple executions of one action, state drift, and performance overhead.
### error: `THREE.GLTFLoader invalid plugin (missing name)`
- **Type:** Asset loader/plugin configuration error.
- **Probable meaning:** A GLTF loader plugin object is passed without required `name` metadata or wrong plugin shape.
- **Impact:** Model import pipeline may partially fail or skip plugin behavior.
### warn: `THREE.MaterialLoader undefined texture (null)`
- **Type:** Asset/material reference warning.
- **Probable meaning:** Material expects a texture slot but received `null`/missing reference.
- **Impact:** Material may render incorrectly; not always fatal.
### error: `Cannot read properties of null (reading 'contentWindow')`
- **Type:** Runtime exception.
- **Probable meaning:** Code tries to post a message to an iframe/window that is not mounted or already destroyed.
- **Impact:** Can break sync/preview communication and interrupt some editor actions.
### error: `THREE.WebGLRenderer context lost`
- **Type:** Graphics runtime warning/error.
- **Probable meaning:** WebGL context got dropped (GPU reset, heavy resource pressure, canvas recreation, or browser throttling).
- **Impact:** Preview can freeze/black out until context is restored.
### error: `Failed to load resource (404)`
- **Type:** Network/resource error.
- **Probable meaning:** A referenced asset/component/resource ID does not exist or URL/path is stale.
- **Impact:** Missing assets/components in scene and follow-up loader warnings.
### warn: `Icon component has been deprecated`
- **Type:** Deprecation warning.
- **Probable meaning:** Code path still uses an older icon API.
- **Impact:** Non-blocking now, but future break risk if API is removed.
### warn: `ReconnectingWebSocket reconnecting/syncing events`
- **Type:** Collaboration/sync transport logs.
- **Probable meaning:** WebSocket connection dropped and resumed normal sync handshake.
- **Impact:** Usually informational; frequent reconnects may indicate unstable connection/session.
### error: `R3F: Div is not part of the THREE namespace`
- **Type:** Critical scene composition/runtime error.
- **Probable meaning:** A DOM element (`Div`) is being rendered inside R3F 3D canvas tree where only Three.js objects (or properly extended objects) are valid.
- **Impact:** Can break render subtree and cause scene/editor preview failures.
## Overall Read
- The hierarchy feature itself works for basic parent transform inheritance.
- The major risk signals are repeated duplicate registrations, controlled/uncontrolled UI transitions, and mixed runtime/render errors.
- The distortion observed during child position edits aligns with the broader instability indicated by runtime/component warnings.