ThreeJS ProtoTyping

Setup

git clone --depth=1 https://github.com/sketchpunklabs/threejs_proto.git
cd threejs_proto
pnpm install -g browser-sync
pnpm run dev

Purpose

Repo is for long term prototyping & organization of code. ThreeJS tends to have code breaking changes over time, this leads to an importantance of having multiple versions of the library. Even modified version to the library will be needed from time to time to access core api features that the library doesn't support. The point is to keep old prototypes working by pointing to older version of the library while still being able to use newer versions.

For now the use of import-map is used to help define the enviroment for each prototype. This is important because of how WebGL & WebGPU is created to use "three" as the import path that actually points to 2 different files. WebGPU also requires more imports because of the dependence on TSL.

Current enviroments this repo will be supporting:

• Run WebGL2 with WebGLRenderer
• Run WebGPU with WebGPURenderer
• Run WebGL2 with TSL with WebGPURenderer with forceWebGL turned on
• Modified Threejs to use TransformFeedback in WebGL2

Visual Debug Features:

• Dynamic points with various shape renders
• Dynamic lines along with extra methods to render line cubes / circles
• Dynamic text using GLSL pixel font renderering
• Colored Faced Cube

UI Features:

• Tweakpane with essentials plugin