Merge pull request #94 from FunTechInc/v1.1.13

V1.1.13

Author: takuma-hmng8

README.md

@@ -68,7 +68,7 @@ From each `fxHooks`, you can receive [`updateFx`, `setParams`, `fxObject`] in ar
 const [updateFx, setParams, fxObject] = useSomeFx(config);
 ```
 
-Execute `updateFx` in `useFrame`. The first argument receives the RootState from `useFrame`, and the second one takes `HookPrams`. Each fx has its `HookPrams`, and each type is exported.
+invoke `updateFx` in `useFrame`. The first argument receives the RootState from `useFrame`, and the second one takes `HookPrams`. Each fx has its `HookPrams`, and each type is exported.
 
 ```js
 useFrame((props) => {
@@ -288,6 +288,29 @@ usePerformanceMonitor({
 });
 ```
 
+When using some expensive FX (such as `useFluid`), lowering the `dpr` of the FBO of that FX can improve performance.
+
+```js
+const [updateFx, setParams, fxObject] = useSomeFx({ size, dpr: 0.01 });
+```
+
+Also, you can make more detailed adjustments by passing an object to `dpr` instead of `number`.
+
+```ts
+type Dpr =
+   | number
+   | {
+        dpr: number;
+        /** you can set whether `dpr` affects `shader` and `fbo`. default is `true` for both */
+        effect?: {
+           /** default : `true` */
+           shader?: boolean;
+           /** default : `true` */
+           fbo?: boolean;
+        };
+     };
+```
+
 # Misc
 
 ## useDomSyncer

app/ShaderFx.tsx

@@ -53,7 +53,6 @@ export const ShaderFx = ({
                   setDpr(Math.round((1.0 + 1.0 * factor) * 10) / 10);
                }}>
                {children}
-               {/* <Suspense fallback={null}>{children}</Suspense> */}
                {/* <Perf position={"bottom-left"} minimal={false} /> */}
             </PerformanceMonitor>
          </Canvas>