r2fのexample模写していってる。8月中はthree
というかブログの方でlocalstrageつかってたけど、cokies使えばいいじゃんね
// lusion
やってること：x,y,z に[-10,10]を与えて、それぞれのオブジェクトに position の逆方向への力を加えて原点に移動させる。マウスの位置に透明な球体を配置して、衝突する
// ecctrl
onPointerDown={(e) => e.target.requestPointerLock()} で画面を押すとカーソルがなくなる
Ecctrl ライブラリで 3D 内で簡単にキャラクターを動かせる
// monitors
肝：RenderTexture モデルにテキストのテクスチャを映す
// flyingbananas
・Detailed high,mid,low のジオメトリを使う
(パフォーマンス的には Instances の方が良い)
・イージングの式
<code>easing = (x: number) => Math.sqrt(1 - Math.pow(x - 1, 2)),</code>
（↓ ループの中で）
<code>Math.round(easing(i / count) \* depth)</code>
この式により、遠い位置のバナナが多くなる
・3D 空間内の特定の位置（[0, 0, -z]）から見たビューポートの幅と高さ
<code>const { viewport, camera } = useThree();</code>
<code>const { width, height } = viewport.getCurrentViewport(camera, [0, 0, -z]);</code>
遠い位置ほど視錘台が広がるため、ビューポートが大きくなる
バナナが上へ行くと下に移動するが、ビューポートを利用しているため無駄がない
・useState でオブジェクトを定義して初回レンダリングのみ計算される
・postprocessing の効果を使う場合は、flat を設定しないと効かない
・DepthOfField 公式に乗ってない属性が