Skip to content

refactor(N8AONode): replace blue-noise texture with canonical scalar … #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
tonyblu331 wants to merge 3 commits into
base: main
Choose a base branch
from
Open

refactor(N8AONode): replace blue-noise texture with canonical scalar … #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
d21eb01
refactor(N8AONode): replace blue-noise texture with canonical scalar …
tonyblu331 Apr 24, 2026
009e76e
fix(N8AONode): use canonical pixel-scrolled scalar IGN
tonyblu331 Apr 24, 2026
af1a083
chore(N8AONode): reset IGN frame with accumulation reset
tonyblu331 Apr 24, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 0 additions & 17 deletions src/BlueNoise.js
View file
Open in desktop

This file was deleted.

99 changes: 51 additions & 48 deletions src/N8AONode.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,6 @@ import {
getViewPosition,
int,
ivec2,
mat2,
max,
min,
mix,
Expand All @@ -63,7 +62,6 @@ import {
vec3,
vec4,
} from "three/tsl";
import bluenoiseBits from "./BlueNoise.js";
import {
applyQualityMode,
createDefaultN8AOConfiguration,
Expand Down Expand Up @@ -149,6 +147,32 @@ const getNormalFromDepthWithResolution = /* @__PURE__ */ Fn(
},
);

const TAU = Math.PI * 2;

const IGN_MULTIPLIER = 52.9829189;
const IGN_TIME_SCROLL = 5.588238;
const IGN_DOT_SCALE = vec2(0.06711056, 0.00583715);

const IGN_OFFSET_1 = vec2(19.19, 47.77);

const ign1 = /* @__PURE__ */ Fn(([pixelPosition, frameWrapped]: any[]) => {
const scroll = vec2(float(IGN_TIME_SCROLL).mul(frameWrapped));
const p = pixelPosition.add(scroll);

return float(IGN_MULTIPLIER)
.mul(p.dot(IGN_DOT_SCALE).fract())
.fract();
});

const ign2 = /* @__PURE__ */ Fn(
([pixelPosition, frameWrapped]: any[]) => {
return vec2(
ign1(pixelPosition, frameWrapped),
ign1(pixelPosition.add(IGN_OFFSET_1), frameWrapped),
);
},
);

type TextureNodeLike = any;

export type N8AOWebGPURenderer = {
Expand Down Expand Up @@ -284,8 +308,6 @@ export class N8AONode extends TempNode {

private readonly quadMesh = new QuadMesh();

private readonly blueNoiseTexture = new DataTexture(bluenoiseBits, 128, 128);

private readonly outputTarget = new RenderTarget(1, 1, {
depthBuffer: false,
format: RGBAFormat,
Expand Down Expand Up @@ -416,10 +438,6 @@ export class N8AONode extends TempNode {

private readonly halfResNode = uniform(false);

private readonly blueNoiseNode = texture(
this.blueNoiseTexture,
) as TextureNodeLike;

private readonly aoSourceTextureNode = texture(
this.aoTargetA.texture,
) as TextureNodeLike;
Expand Down Expand Up @@ -480,6 +498,8 @@ export class N8AONode extends TempNode {

private frame = 0;

private ignFrame = 0;

private width = 1;

private height = 1;
Expand All @@ -505,12 +525,6 @@ export class N8AONode extends TempNode {
this.scenePassNode = input.scenePassNode ?? null;
this.scene = input.scene;

this.blueNoiseTexture.colorSpace = NoColorSpace;
this.blueNoiseTexture.wrapS = RepeatWrapping;
this.blueNoiseTexture.wrapT = RepeatWrapping;
this.blueNoiseTexture.minFilter = NearestFilter;
this.blueNoiseTexture.magFilter = NearestFilter;
this.blueNoiseTexture.needsUpdate = true;
this.depthCopySourceTextureNode = texture(
this.depthTexture,
) as TextureNodeLike;
Expand Down Expand Up @@ -599,7 +613,6 @@ export class N8AONode extends TempNode {
this.depthDownsampleTarget?.dispose();
this.transparencyTargetDepthWriteFalse?.dispose();
this.transparencyTargetDepthWriteTrue?.dispose();
this.blueNoiseTexture.dispose();
this.placeholderDepthTexture.dispose();
this.placeholderNormalTexture.dispose();
this.placeholderTransparentTexture.dispose();
Expand Down Expand Up @@ -690,7 +703,6 @@ export class N8AONode extends TempNode {

this.camera.updateMatrixWorld();
this.detectTransparency();
this.syncConfigurationUniforms();

if (
this.configuration.accumulate &&
Expand All @@ -699,12 +711,18 @@ export class N8AONode extends TempNode {
this.lastProjectionMatrix.equals(this.camera.projectionMatrix)
) {
this.frame += 1;
this.ignFrame = (this.ignFrame + 1) & 63;
this.frameNode.value = this.ignFrame;
} else {
this.frame = 0;
this.ignFrame = 0;
this.frameNode.value = 0;
this.needsFrame = false;
this.clearAccumulationTargets(renderer);
}

this.syncConfigurationUniforms();

this.lastViewMatrix.copy(this.camera.matrixWorldInverse);
this.lastProjectionMatrix.copy(this.camera.projectionMatrix);

Expand Down Expand Up @@ -1055,7 +1073,6 @@ export class N8AONode extends TempNode {
const biasAdjustment = this.biasAdjustmentNode;
const aoDepthNode = this.getAoDepthNode();
const aoDepthTexture = this.getAoDepthTexture();
const blueNoiseNode = this.blueNoiseNode;
const downsampledNormalTextureNode = this.downsampledNormalTextureNode;
const orthoNode = this.orthoNode;
const screenSpaceRadiusNode = this.screenSpaceRadiusNode;
Expand Down Expand Up @@ -1086,19 +1103,13 @@ export class N8AONode extends TempNode {
resolution,
).toVar();

const noiseUv = vec2(uvNode.x, uvNode.y.oneMinus())
const pixelPosition = vec2(uvNode.x, uvNode.y.oneMinus())
.mul(resolution)
.div(128)
.toVar();
const noise = blueNoiseNode.sample(noiseUv).toVar();
const noiseX = noise.x
.add(frame.mul(1.618033988749895))
.fract()
.toVar();
const noiseY = noise.y
.add(frame.mul(1.324717957244746))
.fract()
.floor()
.toVar();
const noise = ign2(pixelPosition, frame).toVar();
const noiseX = noise.x.toVar();
const noiseY = noise.y.toVar();

const helper = vec3(0, 1, 0).toVar();
If(dot(helper, normal).greaterThan(0.99), () => {
Expand All @@ -1107,7 +1118,7 @@ export class N8AONode extends TempNode {

const tangent = helper.cross(normal).normalize().toVar();
const bitangent = normal.cross(tangent).toVar();
const rotationAngle = noiseX.mul(Math.PI * 2).toVar();
const rotationAngle = noiseX.mul(TAU).toVar();
const rotationSin = rotationAngle.sin().toVar();
const rotationCos = rotationAngle.cos().toVar();

Expand Down Expand Up @@ -1260,7 +1271,6 @@ export class N8AONode extends TempNode {
const projectionMatrixInverse = this.projectionMatrixInverseNode;
const aoDepthNode = this.getAoDepthNode();
const aoSourceTextureNode = this.aoSourceTextureNode;
const blueNoiseNode = this.blueNoiseNode;
const blurIndexNode = this.blurIndexNode;
const screenSpaceRadiusNode = this.screenSpaceRadiusNode;
const blurWorldRadiusNode = this.blurWorldRadiusNode;
Expand All @@ -1286,26 +1296,20 @@ export class N8AONode extends TempNode {
projectionMatrixInverse,
).toVar();
const texelSize = vec2(1).div(resolution).toVar();
const blueNoiseUv = vec2(uvNode.x, uvNode.y.oneMinus())
const pixelPosition = vec2(uvNode.x, uvNode.y.oneMinus())
.mul(resolution)
.div(128)
.floor()
.toVar();
const noise = blueNoiseNode.sample(blueNoiseUv).toVar();

const angle = blurIndexNode
.equal(0)
.select(
noise.w.mul(Math.PI * 2),
blurIndexNode
.equal(1)
.select(
noise.z.mul(Math.PI * 2),
blurIndexNode
.equal(2)
.select(noise.y.mul(Math.PI * 2), noise.x.mul(Math.PI * 2)),
),
)
.toVar();
const blurPixelPosition = pixelPosition.add(
vec2(
blurIndexNode.mul(17.0),
blurIndexNode.mul(43.0),
),
).toVar();

const noise = ign1(blurPixelPosition, float(0)).toVar();
const angle = noise.mul(TAU).toVar();
const rotationSin = angle.sin().toVar();
const rotationCos = angle.cos().toVar();

Expand Down Expand Up @@ -1755,7 +1759,6 @@ export class N8AONode extends TempNode {
? this.configuration.aoRadius * 0.5
: this.configuration.aoRadius;
this.distanceFalloffNode.value = this.configuration.distanceFalloff;
this.frameNode.value = this.frame;
this.screenSpaceRadiusNode.value = this.configuration.screenSpaceRadius;
this.blurRadiusNode.value =
this.configuration.denoiseRadius * (this.configuration.halfRes ? 0.5 : 1);
Expand Down