` 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 ",[2882,2885],{"name":2883,"color":2884},"feature","c2e0c6",{"name":2886,"color":2887},"pending-triage","97A4FE",689,"tres","Render mode policies","2024-05-24T14:21:03Z","https://github.com/Tresjs/tres/issues/689",0.8127568,{"description":2895,"labels":2896,"number":1521,"owner":2860,"repository":2874,"state":2898,"title":2899,"updated_at":2900,"url":2901,"score":2902},"\r\n\u003Cimg width=\"623\" alt=\"Screenshot 2023-03-01 at 08 05 55\" src=\"https://user-images.githubusercontent.com/4699008/222068182-92bd8c64-8551-4df5-a78b-8917a40f5867.png\">\r\n\r\n\r\n**Is your feature request related to a problem? Please describe.**\r\nA [contact shadow](https://threejs.org/examples/#webgl_shadow_contact) implementation, facing upwards (positive Y) by default. scale can be a positive number or a 2D array [x: number, y: number].\r\n\r\n```\u003CContactShadows opacity=\"1\" scale=\"10\" blur=\"1\" far=\"10\" resolution=\"256\" color=\"#000000\" />```\r\n\r\nSince this is a rather expensive effect you can limit the number of frames it renders when your objects are static. For instance, making it render only once:\r\n\r\n```\u003CContactShadows frames=\"1\" />```\r\n\r\n**Describe the solution you'd like**\r\nAbstraction in cientos\r\n\r\n**Suggested solution**\r\nCheck drei [implementation](https://github.com/pmndrs/drei/blob/master/src/core/ContactShadows.tsx)\r\n\r\n\r\n**Additional context**\r\nAdd any other context or screenshots about the feature request here.\r\n",[2897],{"name":2883,"color":2884},"closed","Contact Shadows ","2023-05-17T13:56:58Z","https://github.com/Tresjs/cientos/issues/4",0.47727713,{"description":2904,"labels":2905,"number":2859,"owner":2860,"repository":2909,"state":2898,"title":2910,"updated_at":2911,"url":2912,"score":2866},"**Describe the bug**\r\nWhen resizing the viewport with an active effect composer, the scene gets distorted.\r\n\r\n**Reproduction**\r\n**Steps**\r\n1. open demo (in playground for example)\r\n2. change canvas size\r\n\r\n**Expected behavior**\r\nThe scene should not become distorted\r\n\r\n**Screenshots**\r\n\r\n\r\n",[2906],{"name":2907,"color":2908},"bug","d73a4a","post-processing","EffectComposer does not correctly react to canvas resizing","2023-06-26T12:57:39Z","https://github.com/Tresjs/post-processing/issues/29",{"description":2914,"labels":2915,"number":2917,"owner":2860,"repository":2889,"state":2898,"title":2918,"updated_at":2919,"url":2920,"score":2921},"**Is your feature request related to a problem? Please describe.**\r\nAt the moment there is no working way of implementing particles using `\u003CTresBufferGeometry />`, especially attributes.\r\n\r\n**Describe the solution you'd like**\r\nA way of replicate this\r\n\r\n```\r\nconst firefliesGeometry = new THREE.BufferGeometry()\r\nconst firefliesCount = 30\r\nconst positionArray = new Float32Array(firefliesCount * 3)\r\n\r\nfor(let i = 0; i \u003C firefliesCount; i++)\r\n{\r\n positionArray[i * 3 + 0] = Math.random() * 4\r\n positionArray[i * 3 + 1] = Math.random() * 4\r\n positionArray[i * 3 + 2] = Math.random() * 4\r\n}\r\n\r\nfirefliesGeometry.setAttribute('position', new THREE.BufferAttribute(positionArray, 3))\r\n\r\n// Material\r\nconst firefliesMaterial = new THREE.PointsMaterial({ size: 0.1, sizeAttenuation: true })\r\n\r\nconst fireflies = new THREE.Points(firefliesGeometry, firefliesMaterial)\r\nscene.add(fireflies)\r\n``` \r\n\r\n\r\n**Suggested solution**\r\nSimilar to R3F \r\n\r\n```\r\n \u003Cpoints ref={geom} position={[0, 10, 0]} rotation={[-Math.PI / 4, 0, Math.PI / 6]}>\r\n \u003CbufferGeometry>\r\n \u003CbufferAttribute attachObject={[\"attributes\", \"position\"]} count={coords.length / 3} array={coords} itemSize={3} />\r\n \u003CbufferAttribute attachObject={[\"attributes\", \"size\"]} count={sizes.length} array={sizes} itemSize={1} />\r\n \u003C/bufferGeometry>\r\n \u003CdotMaterial />\r\n \u003C/points>\r\n```\r\n\r\n**Additional context**\r\nAdd any other context or screenshots about the feature request here.\r\n",[2916],{"name":2883,"color":2884},56,"BufferGeometry and BufferAttribute support","2022-12-22T10:31:58Z","https://github.com/Tresjs/tres/issues/56",0.7894597,{"description":2923,"labels":2924,"number":2935,"owner":2860,"repository":2889,"state":2898,"title":2936,"updated_at":2937,"url":2938,"score":2939},"**Describe the bug**\r\n\r\nCamera aspect ratio looks incorrect on mobile when resizing\r\n\r\n**Reproduction**\r\nPlease provide a link using this template on [Stackblitz](https://stackblitz.com/edit/tresjs-basic?file=README.md) \r\n\r\n**Steps**\r\nSteps to reproduce the behavior:\r\n1. Go to https://tresjs.org/guide/ on mobile\r\n\r\n**Expected behavior**\r\nScene is correctly resized \r\n\r\n**Screenshots**\r\n\r\n\r\n\r\n",[2925,2926,2929,2932],{"name":2907,"color":2908},{"name":2927,"color":2928},"docs","0075ca",{"name":2930,"color":2931},"good first issue","7057ff",{"name":2933,"color":2934},"help wanted","008672",65,"Docs local first scene doesn't scale on mobile","2022-12-30T20:32:53Z","https://github.com/Tresjs/tres/issues/65",0.79882264,{"description":2941,"labels":2942,"number":2943,"owner":2860,"repository":2889,"state":2898,"title":2944,"updated_at":2945,"url":2946,"score":2947},"**Is your feature request related to a problem? Please describe.**\r\nFollowing #116 at the moment is only possible to do this on hardcoded properties like `rotation`, `scale`, `position` and `color`\r\n\r\n**Describe the solution you'd like**\r\nAutomatic nested properties using dashes like this:\r\n\r\n`\u003CTresDirectionalLight :rotation-x=\"1\" :shadow-map-camera-near=\"0.5\" />`\r\n\r\n**Suggested solution**\r\nI'm thinking something like this:\r\n\r\n```ts\r\nconst propsName = 'shadow-map-camera-near'\r\nconst propVal = 0.5\r\nconst nestedProps = propName.split('-').map(p => p.replace(/^[a-z]/g, c => c.toLowerCase())); // ['material', 'uniforms',...'value']\r\n\r\nfor (let i = 0; i \u003C nestedProps.length - 1; i++) {\r\n if (!instance[nestedProps[i]]) {\r\n instance[nestedProps[i]] = {};\r\n }\r\n instance = instance[nestedProps[i]];\r\n}\r\n\r\ninstance[nestedProps[nestedProps.length - 1]] = propVal; // \r\n```\r\n\r\nProbably we will need to check if the property with the dashes already exists and is not a nested property, like `cast-shadow`, also considering that maybe a key of the nested properties also has dashes, like `shadow-**map-size**-height`\r\n",[],121,"Nested Props","2023-03-22T09:56:21Z","https://github.com/Tresjs/tres/issues/121",0.8083932,{"description":2949,"labels":2950,"number":2959,"owner":2860,"repository":2874,"state":2898,"title":2960,"updated_at":2961,"url":2962,"score":2963},"### Describe the bug\r\n\r\nLensflare seems to be broken on v4\r\n\r\nCannot destructure property 'registerCamera' of '(intermediate value)(intermediate value)(intermediate value)' as it is undefined.\r\n\r\n\r\n\r\n\r\n### Reproduction\r\n\r\nRun local playground\r\n\r\n### Steps to reproduce\r\n\r\n_No response_\r\n\r\n### System Info\r\n\r\n```shell\r\nSystem:\r\n OS: macOS 14.5\r\n CPU: (8) arm64 Apple M1 Pro\r\n Memory: 51.02 MB / 16.00 GB\r\n Shell: 5.9 - /bin/zsh\r\n Binaries:\r\n Node: 20.12.2 - ~/.nvm/versions/node/v20.12.2/bin/node\r\n Yarn: 1.22.19 - /usr/local/bin/yarn\r\n npm: 10.5.0 - ~/.nvm/versions/node/v20.12.2/bin/npm\r\n pnpm: 8.15.4 - ~/Library/pnpm/pnpm\r\n bun: 1.0.2 - ~/.bun/bin/bun\r\n Browsers:\r\n Brave Browser: 120.1.61.116\r\n Chrome: 125.0.6422.142\r\n Safari: 17.5\r\n npmPackages:\r\n @tresjs/core: 4.0.0-rc.2 => 4.0.0-rc.2 \r\n @tresjs/leches: ^0.14.0 => 0.14.0\r\n```\r\n\r\n\r\n### Used Package Manager\r\n\r\npnpm\r\n\r\n### Code of Conduct\r\n\r\n- [X] I agree to follow this project's [Code of Conduct](https://github.com/Tresjs/cientos/blob/main/CODE_OF_CONDUCT.md)\r\n- [X] Read the [Contributing Guidelines](https://github.com/Tresjs/cientos/blob/main/CONTRIBUTING.md).\r\n- [X] Read the [docs](https://cientos.tresjs.org/guide).\r\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.\r\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[2951,2952,2955,2956],{"name":2907,"color":2908},{"name":2953,"color":2954},"v4","EEF2B0",{"name":2871,"color":2872},{"name":2957,"color":2958},"regression","167F7A",435,"Lensflare playground demo is broken","2024-08-28T19:23:52Z","https://github.com/Tresjs/cientos/issues/435",0.80962986,{"description":2965,"labels":2966,"number":2968,"owner":2860,"repository":2889,"state":2898,"title":2969,"updated_at":2970,"url":2971,"score":2972},"**Describe the bug**\r\nThe library still glitches in responsiveness, especially regarding models, they get distorted aspect ratio, probably the canvas.\r\n\r\n**Reproduction**\r\nRe-scale a scene\r\n\r\n\r\n**Steps**\r\nSteps to reproduce the behavior:\r\n1. Go to any scene\r\n2. Resize until very very small\r\n\r\n**Expected behavior**\r\nRe-scaling doesn't affect objects or the camera aspect ratio\r\n\r\n**Screenshots**\r\n\r\n\r\n\r\n**System Info**\r\nOutput of `npx envinfo --system --npmPackages '{vite,@tresjs/*, three, vue}' --binaries --browsers` \r\n\r\n```\r\n System:\r\n OS: macOS 13.2.1\r\n CPU: (8) arm64 Apple M1 Pro\r\n Memory: 74.72 MB / 16.00 GB\r\n Shell: 5.8.1 - /bin/zsh\r\n Binaries:\r\n Node: 18.14.1 - ~/.nvm/versions/node/v18.14.1/bin/node\r\n Yarn: 1.22.19 - /usr/local/bin/yarn\r\n npm: 9.3.1 - ~/.nvm/versions/node/v18.14.1/bin/npm\r\n Browsers:\r\n Brave Browser: 110.1.48.164\r\n Chrome: 110.0.5481.177\r\n Safari: 16.3\r\n npmPackages:\r\n @tresjs/cientos: ^1.7.0 => 1.7.0 \r\n @tresjs/core: ^1.7.0 => 1.7.0 \r\n vite: ^4.1.0 => 4.1.4 \r\n```\r\n\r\n**Additional context**\r\nAdd any other context about the problem here.\r\n",[2967],{"name":2907,"color":2908},127,"Scene doesn't scale properly","2023-02-27T19:56:06Z","https://github.com/Tresjs/tres/issues/127",0.81490946,["Reactive",2974],{},["Set"],["ShallowReactive",2977],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fM80gEITpnLGGfzl30FcHISSYvCrF3iW1lkWPz63Q-bA":-1},"/Tresjs/configs/4"]