Commit b2bbd88

authored

Merge pull request #93 from FunTechInc/v1.1.10

Remove unnecessary useEffect

2 parents d357c31 + 0ca135c commit b2bbd88Copy full SHA for b2bbd88

File tree

+1122

-1094

lines changed

+1122

-1094

lines changed

Lines changed: 2 additions & 2 deletions

Original file line number	Diff line number	Diff line change
`@@ -1,5 +1,5 @@`
`1`	`1`	`import * as THREE from "three";`
`2`		`-import { useEffect, useRef } from "react";`
	`2`	`+import { useMemo, useRef } from "react";`
`3`	`3`	`import { useFrame, useThree, extend } from "@react-three/fiber";`
`4`	`4`	`import {`
`5`	`5`	`useNoise,`
`@@ -115,7 +115,7 @@ export const Playground = ({`
`115`	`115`	`dpr: viewport.dpr,`
`116`	`116`	`});`
`117`	`117`
`118`		`- useEffect(() => {`
	`118`	`+ useMemo(() => {`
`119`	`119`	`CONFIG.random();`
`120`	`120`	`setNoise({`
`121`	`121`	`scale: 1000,`

Lines changed: 3 additions & 3 deletions

Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`"use client";`
`2`	`2`
`3`	`3`	`import * as THREE from "three";`
`4`		`-import { useEffect,useMemo } from "react";`
	`4`	`+import { useMemo } from "react";`
`5`	`5`	`import { useFrame, useThree, extend, useLoader } from "@react-three/fiber";`
`6`	`6`	`import {`
`7`	`7`	`useCreateWobble3D,`
`@@ -139,10 +139,10 @@ export const Playground = () => {`
`139`	`139`	`dpr: viewport.dpr,`
`140`	`140`	`geometry: useMemo(() => new THREE.IcosahedronGeometry(0.8, 10), []),`
`141`	`141`	`});`
`142`		`- useEffect(() => {`
	`142`	`+ useMemo(() => {`
`143`	`143`	`particles.points.material.blending = THREE.NormalBlending;`
`144`	`144`	`camera.position.z = 8;`
`145`		`- }, [noise,updateParticle,particles.points.material, camera]);`
	`145`	`+ }, [particles.points.material, camera]);`
`146`	`146`	`useFrame((props) => {`
`147`	`147`	`updateWobble(props, {`
`148`	`148`	`...setWobbleConfig(),`

Lines changed: 38 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,38 @@`
	`1`	`+import * as THREE from "three";`
	`2`	`+import { shaderMaterial } from "@react-three/drei";`
	`3`	`+`
	`4`	`+declare global {`
	`5`	`+ namespace JSX {`
	`6`	`+ interface IntrinsicElements {`
	`7`	`+ fxMaterial: any;`
	`8`	`+ }`
	`9`	`+ }`
	`10`	`+}`
	`11`	`+`
	`12`	`+export type FxMaterialProps = {`
	`13`	`+ u_fx: THREE.Texture;`
	`14`	`+};`
	`15`	`+`
	`16`	`+export const FxMaterial = shaderMaterial(`
	`17`	`+ {`
	`18`	`+ u_fx: new THREE.Texture(),`
	`19`	`+ },`
	`20`	`+`
	`21`	+ `
	`22`	`+ varying vec2 vUv;`
	`23`	`+ void main() {`
	`24`	`+ vUv = uv;`
	`25`	`+ gl_Position = vec4(position, 1.0);`
	`26`	`+ }`
	`27`	+ `,
	`28`	+ `
	`29`	`+ precision highp float;`
	`30`	`+ varying vec2 vUv;`
	`31`	`+ uniform sampler2D u_fx;`
	`32`	`+`
	`33`	`+ void main() {`
	`34`	`+ gl_FragColor = texture2D(u_fx,vUv);`
	`35`	`+ // gl_FragColor = vec4(1.,1.,0.,1.);`
	`36`	`+ }`
	`37`	+ `
	`38`	`+);`

Lines changed: 26 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,26 @@`
	`1`	`+"use client";`
	`2`	`+`
	`3`	`+import * as THREE from "three";`
	`4`	`+import { useEffect, useMemo } from "react";`
	`5`	`+import { useFrame, useThree, extend, useLoader } from "@react-three/fiber";`
	`6`	`+import { useFluid } from "@/packages/use-shader-fx/src";`
	`7`	`+import { FxMaterial } from "./FxMaterial";`
	`8`	`+`
	`9`	`+extend({ FxMaterial });`
	`10`	`+`
	`11`	`+export const Playground = () => {`
	`12`	`+ const { size, viewport, camera } = useThree();`
	`13`	`+`
	`14`	`+ const [updateFluid, , { output }] = useFluid({ size, dpr: viewport.dpr });`
	`15`	`+`
	`16`	`+ useFrame((props) => {`
	`17`	`+ updateFluid(props);`
	`18`	`+ });`
	`19`	`+`
	`20`	`+ return (`
	`21`	`+ <mesh>`
	`22`	`+ <planeGeometry args={[2, 2]} />`
	`23`	`+ <fxMaterial u_fx={output} key={FxMaterial.key} />`
	`24`	`+ </mesh>`
	`25`	`+ );`
	`26`	`+};`

Lines changed: 18 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,18 @@`
	`1`	`+import { ShaderFx } from "../ShaderFx";`
	`2`	`+import { Playground } from "./Playground";`
	`3`	`+`
	`4`	`+export default function Page() {`
	`5`	`+ return (`
	`6`	`+ <div`
	`7`	`+ style={{`
	`8`	`+ position: "fixed",`
	`9`	`+ width: "100%",`
	`10`	`+ height: "100svh",`
	`11`	`+ pointerEvents: "none",`
	`12`	`+ }}>`
	`13`	`+ <ShaderFx>`
	`14`	`+ <Playground />`
	`15`	`+ </ShaderFx>`
	`16`	`+ </div>`
	`17`	`+ );`
	`18`	`+}`

Comments

(0)