mirror of
https://github.com/FMS-Cat/condition.git
synced 2025-08-24 06:03:12 +02:00
performance: Blit instead of return
This commit is contained in:
@@ -1,6 +1,5 @@
|
|||||||
import { BufferRenderTarget } from '../heck/BufferRenderTarget';
|
import { BufferRenderTarget } from '../heck/BufferRenderTarget';
|
||||||
import { Entity } from '../heck/Entity';
|
import { Entity } from '../heck/Entity';
|
||||||
import { GLCatTexture } from '@fms-cat/glcat-ts';
|
|
||||||
import { Material } from '../heck/Material';
|
import { Material } from '../heck/Material';
|
||||||
import { Quad } from '../heck/components/Quad';
|
import { Quad } from '../heck/components/Quad';
|
||||||
import { RenderTarget } from '../heck/RenderTarget';
|
import { RenderTarget } from '../heck/RenderTarget';
|
||||||
@@ -12,7 +11,7 @@ import bloomBlurFrag from '../shaders/bloom-blur.frag';
|
|||||||
import bloomPostFrag from '../shaders/bloom-post.frag';
|
import bloomPostFrag from '../shaders/bloom-post.frag';
|
||||||
|
|
||||||
export interface BloomOptions {
|
export interface BloomOptions {
|
||||||
input: GLCatTexture<WebGL2RenderingContext>;
|
input: BufferRenderTarget;
|
||||||
target: RenderTarget;
|
target: RenderTarget;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -40,7 +39,7 @@ export class Bloom {
|
|||||||
quadVert,
|
quadVert,
|
||||||
bloomPreFrag
|
bloomPreFrag
|
||||||
);
|
);
|
||||||
materialBloomPre.addUniformTexture( 'sampler0', options.input );
|
materialBloomPre.addUniformTexture( 'sampler0', options.input.texture );
|
||||||
|
|
||||||
this.entity.components.push( new Quad( {
|
this.entity.components.push( new Quad( {
|
||||||
target: swap.o,
|
target: swap.o,
|
||||||
@@ -92,7 +91,7 @@ export class Bloom {
|
|||||||
quadVert,
|
quadVert,
|
||||||
bloomPostFrag
|
bloomPostFrag
|
||||||
);
|
);
|
||||||
materialBloomPost.addUniformTexture( 'samplerDry', options.input );
|
materialBloomPost.addUniformTexture( 'samplerDry', options.input.texture );
|
||||||
materialBloomPost.addUniformTexture( 'samplerWet', swap.i.texture );
|
materialBloomPost.addUniformTexture( 'samplerWet', swap.i.texture );
|
||||||
|
|
||||||
this.entity.components.push( new Quad( {
|
this.entity.components.push( new Quad( {
|
||||||
|
@@ -1,14 +1,16 @@
|
|||||||
import { Entity } from '../heck/Entity';
|
import { Entity } from '../heck/Entity';
|
||||||
import { GLCatTexture } from '@fms-cat/glcat-ts';
|
|
||||||
import { Material } from '../heck/Material';
|
import { Material } from '../heck/Material';
|
||||||
import { Quad } from '../heck/components/Quad';
|
import { Quad } from '../heck/components/Quad';
|
||||||
import { RenderTarget } from '../heck/RenderTarget';
|
import { RenderTarget } from '../heck/RenderTarget';
|
||||||
import quadVert from '../shaders/quad.vert';
|
import quadVert from '../shaders/quad.vert';
|
||||||
import glitchFrag from '../shaders/glitch.frag';
|
import glitchFrag from '../shaders/glitch.frag';
|
||||||
import { Automaton } from '@fms-cat/automaton';
|
import { Automaton } from '@fms-cat/automaton';
|
||||||
|
import returnFrag from '../shaders/return.frag';
|
||||||
|
import { BufferRenderTarget } from '../heck/BufferRenderTarget';
|
||||||
|
import { Blit } from '../heck/components/Blit';
|
||||||
|
|
||||||
export interface GlitchOptions {
|
export interface GlitchOptions {
|
||||||
input: GLCatTexture<WebGL2RenderingContext>;
|
input: BufferRenderTarget;
|
||||||
target: RenderTarget;
|
target: RenderTarget;
|
||||||
automaton: Automaton;
|
automaton: Automaton;
|
||||||
}
|
}
|
||||||
@@ -22,9 +24,34 @@ export class Glitch {
|
|||||||
public constructor( options: GlitchOptions ) {
|
public constructor( options: GlitchOptions ) {
|
||||||
this.entity = new Entity();
|
this.entity = new Entity();
|
||||||
|
|
||||||
|
const entityBypass = new Entity();
|
||||||
|
entityBypass.visible = false;
|
||||||
|
this.entity.children.push( entityBypass );
|
||||||
|
|
||||||
|
const entityMain = new Entity();
|
||||||
|
entityMain.active = false;
|
||||||
|
entityMain.visible = false;
|
||||||
|
this.entity.children.push( entityMain );
|
||||||
|
|
||||||
|
// -- bypass -----------------------------------------------------------------------------------
|
||||||
|
const materialReturn = new Material(
|
||||||
|
quadVert,
|
||||||
|
returnFrag,
|
||||||
|
);
|
||||||
|
materialReturn.addUniformTexture(
|
||||||
|
'sampler0',
|
||||||
|
options.input.texture,
|
||||||
|
);
|
||||||
|
|
||||||
|
entityBypass.components.push( new Blit( {
|
||||||
|
src: options.input,
|
||||||
|
dst: options.target,
|
||||||
|
name: 'Glitch/blitBypass',
|
||||||
|
} ) );
|
||||||
|
|
||||||
// -- quad -------------------------------------------------------------------------------------
|
// -- quad -------------------------------------------------------------------------------------
|
||||||
this.material = new Material( quadVert, glitchFrag );
|
this.material = new Material( quadVert, glitchFrag );
|
||||||
this.material.addUniformTexture( 'sampler0', options.input );
|
this.material.addUniformTexture( 'sampler0', options.input.texture );
|
||||||
|
|
||||||
if ( module.hot ) {
|
if ( module.hot ) {
|
||||||
module.hot.accept( '../shaders/glitch.frag', () => {
|
module.hot.accept( '../shaders/glitch.frag', () => {
|
||||||
@@ -37,11 +64,14 @@ export class Glitch {
|
|||||||
material: this.material,
|
material: this.material,
|
||||||
name: process.env.DEV && 'Glitch/quad',
|
name: process.env.DEV && 'Glitch/quad',
|
||||||
} );
|
} );
|
||||||
this.entity.components.push( quad );
|
entityMain.components.push( quad );
|
||||||
|
|
||||||
// -- update uniform ---------------------------------------------------------------------------
|
// -- update uniform ---------------------------------------------------------------------------
|
||||||
options.automaton.auto( 'Glitch/amp', ( { value } ) => {
|
options.automaton.auto( 'Glitch/amp', ( { value } ) => {
|
||||||
this.material.addUniform( 'amp', '1f', value );
|
this.material.addUniform( 'amp', '1f', value );
|
||||||
|
|
||||||
|
entityMain.active = 0.0 < value;
|
||||||
|
entityBypass.active = !entityMain.active;
|
||||||
} );
|
} );
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@@ -1,5 +1,4 @@
|
|||||||
import { Entity } from '../heck/Entity';
|
import { Entity } from '../heck/Entity';
|
||||||
import { GLCatTexture } from '@fms-cat/glcat-ts';
|
|
||||||
import { Material } from '../heck/Material';
|
import { Material } from '../heck/Material';
|
||||||
import { Quad } from '../heck/components/Quad';
|
import { Quad } from '../heck/components/Quad';
|
||||||
import { RenderTarget } from '../heck/RenderTarget';
|
import { RenderTarget } from '../heck/RenderTarget';
|
||||||
@@ -10,10 +9,10 @@ import quadVert from '../shaders/quad.vert';
|
|||||||
import { BufferRenderTarget } from '../heck/BufferRenderTarget';
|
import { BufferRenderTarget } from '../heck/BufferRenderTarget';
|
||||||
import { Swap } from '@fms-cat/experimental';
|
import { Swap } from '@fms-cat/experimental';
|
||||||
import { Automaton } from '@fms-cat/automaton';
|
import { Automaton } from '@fms-cat/automaton';
|
||||||
import { gl } from '../heck/canvas';
|
import { Blit } from '../heck/components/Blit';
|
||||||
|
|
||||||
export interface PixelSorterOptions {
|
export interface PixelSorterOptions {
|
||||||
input: GLCatTexture<WebGL2RenderingContext>;
|
input: BufferRenderTarget;
|
||||||
target: RenderTarget;
|
target: RenderTarget;
|
||||||
automaton: Automaton;
|
automaton: Automaton;
|
||||||
}
|
}
|
||||||
@@ -61,12 +60,13 @@ export class PixelSorter {
|
|||||||
);
|
);
|
||||||
materialReturn.addUniformTexture(
|
materialReturn.addUniformTexture(
|
||||||
'sampler0',
|
'sampler0',
|
||||||
options.input,
|
options.input.texture,
|
||||||
);
|
);
|
||||||
|
|
||||||
entityBypass.components.push( new Quad( {
|
entityBypass.components.push( new Blit( {
|
||||||
target: options.target,
|
src: options.input,
|
||||||
material: materialReturn,
|
dst: options.target,
|
||||||
|
name: 'PixelSorter/blitBypass',
|
||||||
} ) );
|
} ) );
|
||||||
|
|
||||||
// -- calc index -------------------------------------------------------------------------------
|
// -- calc index -------------------------------------------------------------------------------
|
||||||
@@ -83,7 +83,7 @@ export class PixelSorter {
|
|||||||
material.addUniform( 'mul', '1f', mul );
|
material.addUniform( 'mul', '1f', mul );
|
||||||
material.addUniformTexture(
|
material.addUniformTexture(
|
||||||
'sampler0',
|
'sampler0',
|
||||||
options.input,
|
options.input.texture,
|
||||||
);
|
);
|
||||||
material.addUniformTexture(
|
material.addUniformTexture(
|
||||||
'sampler1',
|
'sampler1',
|
||||||
@@ -118,7 +118,7 @@ export class PixelSorter {
|
|||||||
material.addUniform( 'comp', '1f', comp );
|
material.addUniform( 'comp', '1f', comp );
|
||||||
material.addUniformTexture(
|
material.addUniformTexture(
|
||||||
'sampler0',
|
'sampler0',
|
||||||
isFirst ? options.input : this.swapBuffer.o.texture,
|
( isFirst ? options.input : this.swapBuffer.o ).texture,
|
||||||
);
|
);
|
||||||
material.addUniformTexture(
|
material.addUniformTexture(
|
||||||
'sampler1',
|
'sampler1',
|
||||||
|
@@ -1,13 +1,13 @@
|
|||||||
import { Entity } from '../heck/Entity';
|
import { Entity } from '../heck/Entity';
|
||||||
import { GLCatTexture } from '@fms-cat/glcat-ts';
|
|
||||||
import { Material } from '../heck/Material';
|
import { Material } from '../heck/Material';
|
||||||
import { Quad } from '../heck/components/Quad';
|
import { Quad } from '../heck/components/Quad';
|
||||||
import { RenderTarget } from '../heck/RenderTarget';
|
import { RenderTarget } from '../heck/RenderTarget';
|
||||||
import postFrag from '../shaders/post.frag';
|
import postFrag from '../shaders/post.frag';
|
||||||
import quadVert from '../shaders/quad.vert';
|
import quadVert from '../shaders/quad.vert';
|
||||||
|
import { BufferRenderTarget } from '../heck/BufferRenderTarget';
|
||||||
|
|
||||||
export interface PostOptions {
|
export interface PostOptions {
|
||||||
input: GLCatTexture<WebGL2RenderingContext>;
|
input: BufferRenderTarget;
|
||||||
target: RenderTarget;
|
target: RenderTarget;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -23,7 +23,7 @@ export class Post {
|
|||||||
quadVert,
|
quadVert,
|
||||||
postFrag,
|
postFrag,
|
||||||
);
|
);
|
||||||
material.addUniformTexture( 'sampler0', options.input );
|
material.addUniformTexture( 'sampler0', options.input.texture );
|
||||||
|
|
||||||
if ( process.env.DEV ) {
|
if ( process.env.DEV ) {
|
||||||
if ( module.hot ) {
|
if ( module.hot ) {
|
||||||
|
@@ -1,13 +1,13 @@
|
|||||||
import { Entity } from '../heck/Entity';
|
import { Entity } from '../heck/Entity';
|
||||||
import { GLCatTexture } from '@fms-cat/glcat-ts';
|
|
||||||
import { Material } from '../heck/Material';
|
import { Material } from '../heck/Material';
|
||||||
import { Quad } from '../heck/components/Quad';
|
import { Quad } from '../heck/components/Quad';
|
||||||
import { RenderTarget } from '../heck/RenderTarget';
|
import { RenderTarget } from '../heck/RenderTarget';
|
||||||
import returnFrag from '../shaders/return.frag';
|
import returnFrag from '../shaders/return.frag';
|
||||||
import quadVert from '../shaders/quad.vert';
|
import quadVert from '../shaders/quad.vert';
|
||||||
|
import { BufferRenderTarget } from '../heck/BufferRenderTarget';
|
||||||
|
|
||||||
export interface PostOptions {
|
export interface PostOptions {
|
||||||
input: GLCatTexture<WebGL2RenderingContext>;
|
input: BufferRenderTarget;
|
||||||
target: RenderTarget;
|
target: RenderTarget;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -22,7 +22,7 @@ export class Return {
|
|||||||
quadVert,
|
quadVert,
|
||||||
returnFrag,
|
returnFrag,
|
||||||
);
|
);
|
||||||
material.addUniformTexture( 'sampler0', options.input );
|
material.addUniformTexture( 'sampler0', options.input.texture );
|
||||||
|
|
||||||
this.entity.components.push( new Quad( {
|
this.entity.components.push( new Quad( {
|
||||||
target: options.target,
|
target: options.target,
|
||||||
|
54
src/heck/components/Blit.ts
Normal file
54
src/heck/components/Blit.ts
Normal file
@@ -0,0 +1,54 @@
|
|||||||
|
import { Component, ComponentOptions, ComponentUpdateEvent } from './Component';
|
||||||
|
import { RenderTarget } from '../RenderTarget';
|
||||||
|
import { gl } from '../canvas';
|
||||||
|
import { BufferRenderTarget } from '../BufferRenderTarget';
|
||||||
|
|
||||||
|
export interface BlitOptions extends ComponentOptions {
|
||||||
|
src: BufferRenderTarget;
|
||||||
|
dst: RenderTarget;
|
||||||
|
srcRect?: [ number, number, number, number ];
|
||||||
|
dstRect?: [ number, number, number, number ];
|
||||||
|
mask?: GLenum;
|
||||||
|
filter?: GLenum;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Blit.
|
||||||
|
*/
|
||||||
|
export class Blit extends Component {
|
||||||
|
public src: BufferRenderTarget;
|
||||||
|
public dst: RenderTarget;
|
||||||
|
public srcRect: [ number, number, number, number ];
|
||||||
|
public dstRect: [ number, number, number, number ];
|
||||||
|
public mask: GLenum;
|
||||||
|
public filter: GLenum;
|
||||||
|
|
||||||
|
public constructor( options: BlitOptions ) {
|
||||||
|
super( options );
|
||||||
|
|
||||||
|
this.visible = false;
|
||||||
|
|
||||||
|
this.src = options.src;
|
||||||
|
this.dst = options.dst;
|
||||||
|
this.srcRect = options.srcRect ?? [ 0, 0, this.src.width, this.src.height ];
|
||||||
|
this.dstRect = options.dstRect ?? [ 0, 0, this.dst.width, this.dst.height ];
|
||||||
|
this.mask = options.mask ?? gl.COLOR_BUFFER_BIT;
|
||||||
|
this.filter = options.filter ?? gl.NEAREST;
|
||||||
|
}
|
||||||
|
|
||||||
|
protected __updateImpl(): void {
|
||||||
|
gl.bindFramebuffer( gl.READ_FRAMEBUFFER, this.src.framebuffer.raw );
|
||||||
|
if ( this.dst instanceof BufferRenderTarget ) {
|
||||||
|
gl.bindFramebuffer( gl.DRAW_FRAMEBUFFER, this.dst.framebuffer.raw );
|
||||||
|
} else {
|
||||||
|
gl.bindFramebuffer( gl.DRAW_FRAMEBUFFER, null );
|
||||||
|
}
|
||||||
|
|
||||||
|
gl.blitFramebuffer(
|
||||||
|
...this.srcRect,
|
||||||
|
...this.dstRect,
|
||||||
|
this.mask,
|
||||||
|
this.filter,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
@@ -312,14 +312,14 @@ dog.root.children.push( camera.entity );
|
|||||||
|
|
||||||
swap.swap();
|
swap.swap();
|
||||||
const bloom = new Bloom( {
|
const bloom = new Bloom( {
|
||||||
input: swap.i.texture,
|
input: swap.i,
|
||||||
target: swap.o
|
target: swap.o
|
||||||
} );
|
} );
|
||||||
dog.root.children.push( bloom.entity );
|
dog.root.children.push( bloom.entity );
|
||||||
|
|
||||||
swap.swap();
|
swap.swap();
|
||||||
const glitch = new Glitch( {
|
const glitch = new Glitch( {
|
||||||
input: swap.i.texture,
|
input: swap.i,
|
||||||
target: swap.o,
|
target: swap.o,
|
||||||
automaton,
|
automaton,
|
||||||
} );
|
} );
|
||||||
@@ -327,7 +327,7 @@ dog.root.children.push( glitch.entity );
|
|||||||
|
|
||||||
swap.swap();
|
swap.swap();
|
||||||
const pixelSorter = new PixelSorter( {
|
const pixelSorter = new PixelSorter( {
|
||||||
input: swap.i.texture,
|
input: swap.i,
|
||||||
target: swap.o,
|
target: swap.o,
|
||||||
automaton,
|
automaton,
|
||||||
} );
|
} );
|
||||||
@@ -335,7 +335,7 @@ dog.root.children.push( pixelSorter.entity );
|
|||||||
|
|
||||||
swap.swap();
|
swap.swap();
|
||||||
const post = new Post( {
|
const post = new Post( {
|
||||||
input: swap.i.texture,
|
input: swap.i,
|
||||||
target: canvasRenderTarget
|
target: canvasRenderTarget
|
||||||
} );
|
} );
|
||||||
dog.root.children.push( post.entity );
|
dog.root.children.push( post.entity );
|
||||||
|
Reference in New Issue
Block a user