` currently only accepts 1 string flag from the user. Using only flags means the system relies solely on us predicting users' needs and implementing a \"mode\" for them.\r\nAccepting only a single flag means we can't have a compound policy, e.g., \"rerender if advance or invalidate were called or the window resized. Afaik, this currently leads to cases where manual is the mode – the canvas will be blank if the window is resized, until invalidate is called.\r\n\r\n\r\n\r\n### Suggested solution\r\n\r\nEncapsulate the logic for \"Should the next tick update/render?\" in a module – maybe `src/core/renderPolicy.ts`?\r\nLet the render policy be specified via functions/objects as follows:\r\n\r\n```ts\r\nimport { createRenderPolicy, manual } from '...'\r\nconst policy = createRenderPolicy(manual)\r\nconst { invalidate } = policy\r\n...\r\n\u003CTresCanvas :render-policy=\"policy\" />\r\n```\r\n\r\nAbove, \r\n\r\n- manual is \"rule\" function that contains its own state, tracking if invalidate() was called since the last update.\r\n- policy is an object that relays calls to invalidate and advance to its rules, then asks the rules if the next tick should update/render or not.\r\n\r\nIn this way, we could have compound policies. E.g.,\r\n\r\n```ts\r\n// NOTE: This policy will approve the next tick of jobs if ...\r\n// - `invalidate()` was called\r\n// - the window was resized\r\n// but cancel if ...\r\n// - the canvas is off-screen\r\nconst { shouldUpdate, invalidate } = createRenderPolicy([manual, windowResize, cancelIfOffScreen])\r\nshouldUpdate() // false\r\ninvalidate()\r\nshouldUpdate() // true\r\n```\r\n\r\nRules would be evaluated in FILO order, with the result of lower ranking rules being passed to higher ranking rules, so this ...\r\n\r\n```\r\ncreateRenderPolicy([manual, cancelIfOffScreen, windowResize])\r\n```\r\n\r\n... cancels true from windowResize if the canvas is offscreen. But if the canvas is off-screen, manual's advance(n) will still take precedence.\r\n\r\nWhereas here ...\r\n\r\n```\r\ncreateRenderPolicy([cancelIfOffScreen, manual, windowResize])\r\n```\r\n\r\n... `cancelIfOffScreen` takes precedence over the other 2 rules and cancels both if the canvas is off-screen. \r\n----\r\n\r\nRules are relatively simple to write and users could supply their own rules, if we surface that in the API. Here's a \"complicated\" rule – `windowResize` – in its current form:\r\n\r\n```ts\r\nexport const windowResize: CreateUpdateRule = () => {\r\n let invalidated = true\r\n const invalidate = () => { invalidated = true }\r\n window.addEventListener('resize', invalidate)\r\n return {\r\n shouldUpdate: (lowRankResult: boolean) => {\r\n const result = invalidated\r\n invalidated = false\r\n return result || lowRankResult\r\n },\r\n dispose: () => {\r\n window.removeEventListener('resize', invalidate)\r\n }\r\n }\r\n}\r\n```\r\nHere's manual:\r\n\r\n```ts\r\nexport const manual: CreateUpdateRule = () => {\r\n let numFramesToAdvance = 0\r\n return {\r\n advance: (numFrames = 1) => {\r\n numFramesToAdvance = Math.max(numFramesToAdvance, numFrames)\r\n },\r\n shouldUpdate: (lowRankResult: boolean) => {\r\n const result = numFramesToAdvance > 0\r\n numFramesToAdvance = Math.max(0, numFramesToAdvance - 1)\r\n return result || lowRankResult\r\n }\r\n }\r\n}\r\n```\r\n\r\n### Alternative\r\n\r\n_No response_\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Validations\r\n\r\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/tres/blob/main/CODE_OF_CONDUCT.md)\r\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/tres/blob/main/CONTRIBUTING.md).\r\n- [X] Read the [docs](https://tresjs.org/guide).\r\n- [X] Check that there isn't [already an issue](https://github.com/tresjs/tres/issues) that reports the same bug to avoid creating a duplicate.\r\n\r\nEdit (andretchen0): fixed formatting ",[2892,2893],{"name":2868,"color":2869},{"name":2894,"color":2895},"pending-triage","97A4FE",689,"Render mode policies","2024-05-24T14:21:03Z","https://github.com/Tresjs/tres/issues/689",0.8003869,{"description":2902,"labels":2903,"number":1027,"owner":2874,"repository":2904,"state":2876,"title":2905,"updated_at":2906,"url":2907,"score":2908},"I was seeing how people gianluca (a youtuber, coder) use the library: https://www.youtube.com/watch?v=9Y8XGa7gg-E\r\n\r\nAnd one of the mistakes was the time to start a project, The ideal here would be to have a dedicated CLI for create a project with Tres. But the other options should be just point the started template to the people in the initial page. wdyt?",[],"tresjs.org","Point to the starting template","2024-12-30T15:42:30Z","https://github.com/Tresjs/tresjs.org/issues/21",0.80841017,{"description":2910,"labels":2911,"number":2915,"owner":2874,"repository":2916,"state":2876,"title":2917,"updated_at":2918,"url":2919,"score":2920},"### Description\n\nAs a developer using TresJS,\nI want a straightforward way to enable a bounding volume hierarchy (BVH) on my 3D meshes and geometries,\nso that I can benefit from drastically improved raycasting performance and more efficient collision detection in complex scenes.\n\n### Reason / Use Cases\n- **Performance Gains**: A BVH can accelerate raycasting operations, especially for large/complex geometry.\n\n- **Collision Detection**: Many real-time applications (e.g. games, simulations) need fast collision checks; BVH can help optimize these.\n\n- **Simplicity & Consistency**: Having a composable approach in TresJS aligns with the rest of the API, keeping logic encapsulated and Vue-friendly.\n\n### Suggested solution\n\nIn the appropriate module (e.g.,`/useBVH.ts` or similar), we could provide:\n\n> [!TIP]\n> Check R3F Drei's implementation https://drei.docs.pmnd.rs/performances/bvh\n\n```ts\nimport { ref, onMounted } from 'vue'\n// Possibly import { MeshBVH, MeshBVHVisualizer } from 'three-mesh-bvh' \n// or any relevant utility from three-mesh-bvh\n\nexport function useBVH(geometryRef) {\n const bvhRef = ref(null)\n\n onMounted(() => {\n // Pseudocode: \n // 1. Create or update the BVH\n // 2. Store the result in bvhRef\n // 3. Optionally expose utilities for intersection, collision checks, etc.\n\n // Example:\n // bvhRef.value = new MeshBVH(geometryRef.value)\n })\n\n // Return whatever is helpful for the user:\n // e.g. the BVH instance, methods for raycasting, collision checks, etc.\n return {\n bvhRef,\n // raycastWithBVH, collisionCheck, etc.\n }\n}\n```\n\nReactive Updates\n\nOptionally watch for changes in the provided geometry or the mesh and re-build BVH if necessary.\n\n### Alternative\n\n_No response_\n\n### Additional context\n\n- Potentially wrap [three-mesh-bvh](https://github.com/gkjohnson/three-mesh-bvh) or another library under the hood.\n- Consider how to handle dynamic geometries versus static ones (e.g., partial updates vs. full rebuilds).\n- Align the API style with other TresJS composables (useXyz naming, returning refs or methods, etc.).\n\n### Validations\n\n- [x] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/cientos/blob/main/CODE_OF_CONDUCT.md)\n- [x] Read the [Contributing Guidelines](https://github.com/Tresjs/cientos/blob/main/CONTRIBUTING.md).\n- [x] Read the [docs](https://cientos.tresjs.org/guide).\n- [x] Check that there isn't [already an issue](https://github.com/tresjs/cientos/issues) that reports the same bug to avoid creating a duplicate.",[2912],{"name":2913,"color":2914},"p4-important-bug","D93F0B",604,"cientos","useBVH (Bounding Volume Hierarchy) composable","2025-03-24T15:26:01Z","https://github.com/Tresjs/cientos/issues/604",0.80946445,{"description":2922,"labels":2923,"number":2927,"owner":2874,"repository":2928,"state":2929,"title":2930,"updated_at":2931,"url":2932,"score":2933},"## Description\r\n\r\n[In Cientos docs](https://cientos.tresjs.org/guide/abstractions/lensflare.html), when navigating *back to* a page with Leches controls, the controls are duplicated – and reduplicated on every subsequent visit until the page is reloaded.\r\n\r\nhttps://github.com/Tresjs/leches/assets/20469369/88e6e989-8e86-4e87-bda6-d7368d59a78a\r\n\r\n## Reproduction\r\n\r\nSteps to reproduce the behavior:\r\n\r\n1. Go to [Lensflare](https://cientos.tresjs.org/guide/abstractions/lensflare.html)\r\n2. See 1 control for scale\r\n3. Click on 'MouseParallax' in the left-hand menu\r\n4. Click on 'Lensflare' in the left-hand menu\r\n5. See 2 controls for scale\r\n6. Click on 'MouseParallax' in the left-hand menu\r\n7. Click on 'Lensflare' in the left-hand menu\r\n8. See 3 controls for scale\r\n\r\n## Expected behavior\r\n\r\nThe controls should not be duplicated.",[2924],{"name":2925,"color":2926},"bug","d73a4a",62,"leches","closed","Leches controls multiply when page is revisited in Cientos docs","2023-11-03T13:52:32Z","https://github.com/Tresjs/leches/issues/62",0.7539984,{"description":2935,"labels":2936,"number":2940,"owner":2874,"repository":2941,"state":2929,"title":2942,"updated_at":2943,"url":2944,"score":2945},"To make the changes made in https://github.com/Tresjs/tres/pull/365 work with postprocessing, the effect composer component should check wether the canvas has a height and width larger than 0.",[2937],{"name":2938,"color":2939},"enhancement","a2eeef",45,"post-processing","prevent creation of effect composer when canvas has zero height or width","2023-08-21T12:56:26Z","https://github.com/Tresjs/post-processing/issues/45",0.77986974,{"description":2947,"labels":2948,"number":104,"owner":2874,"repository":2875,"state":2929,"title":2953,"updated_at":2954,"url":2955,"score":2956},"Something similar to \r\n\r\n- [x] Transform Controls https://github.com/pmndrs/drei#pivotcontrols\r\n- [x] Make default",[2949,2952],{"name":2950,"color":2951},"good first issue","7057ff",{"name":2868,"color":2869},"Transform Controls","2022-12-30T15:13:38Z","https://github.com/Tresjs/tres/issues/3",0.7967406,{"description":2958,"labels":2959,"number":2964,"owner":2874,"repository":2875,"state":2929,"title":2965,"updated_at":2966,"url":2967,"score":2968},"**Describe the bug**\r\nThis bug comes from a new user trying to set her first scene using the documentation here https://tresjs.org/guide/your-first-scene.html\r\n\r\nSeems like the code provided in the documentation is not enough and is frustrating because they are experiencing a blank page.\r\nThe main issue was the camera since `OrbitControls` is not used in the first example\r\n\r\nhttps://twitter.com/puppycat_uaena/status/1643857982512594944?s=20\r\n\r\n**Expected behavior**\r\nMake it easier for users and add default values to the camera if not set.\r\n\r\n**Screenshots**\r\nIf applicable, add screenshots to help explain your problem.\r\n\r\n\r\n\r\n",[2960,2961],{"name":2925,"color":2926},{"name":2962,"color":2963},"dx","1576AD",190,"[v2] - Set default position and look-at for Camera","2023-04-06T09:12:33Z","https://github.com/Tresjs/tres/issues/190",0.7982557,{"description":2970,"labels":2971,"number":644,"owner":2874,"repository":2928,"state":2929,"title":2975,"updated_at":2976,"url":2977,"score":2978},"Create interactive docs similar to https://cocopon.github.io/tweakpane/",[2972],{"name":2973,"color":2974},"documentation","0075ca","Docs with Vitepress ","2023-08-28T18:16:55Z","https://github.com/Tresjs/leches/issues/7",0.7998301,["Reactive",2980],{},["Set"],["ShallowReactive",2983],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fiRLWPbg0943AL9YOxS5TOdNOG86Hl8e3TeJN4lWEUhc":-1},"/Tresjs/leches/88"]