Martin Laxenaire martinlaxenaire

Front-end developer. Javascript, WebGL, WebGPU and other fun stuff.

martinlaxenaire / mixing-textures-based-on-alpha.glsl

Created May 3, 2021 09:53

Mixing two vec4 textures based on alpha in GLSL

	// mix foreground and background based on foreground alpha value
	vec4 finalColor;
	finalColor.rgb = foreground.rgb + (background.rgb * (1.0 - foreground.a));
	finalColor.a = foreground.a + (background.a * (1.0 - foreground.a));

martinlaxenaire / checkPerf.js

Last active February 7, 2024 10:37

A little function that performs a CPU performance check, based on a similar piece of code orriginally made by Baptise Briel

	checkPerf() {
	// performance test based on cpu performance
	// higher score means worse performance
	// based on Baptiste Briel's work: http://awams.bbriel.me/27
	let perf = 0;

	const start = (performance \|\| Date).now();
	let array = [];
	for(let i = 0; i < 20000; i++) {
	array = Math.pow(Math.sin(Math.random()), 2);

martinlaxenaire / WebGLLayer.js

Last active May 1, 2021 15:51

Overall concept to on how to use the TextTexture class and to render chosen planes onto a specific render target with curtains.js

	/***
	Really basic example of how I'm rendering the WebGL elements of my portfolio: https://www.martin-laxenaire.fr/
	***/
	import {
	Curtains,
	Plane,
	Vec2,
	PingPongPlane,
	RenderTarget,
	ShaderPass

martinlaxenaire / TextTexture.js

Last active May 14, 2024 08:48

A class to create multiline text textures easily with curtains.js

	/***
	Helper class to create text textures easily with curtains.js
	Supports:
	- vertical and horizontal text alignements
	- lowercase and uppercase
	- filled or stroked text

	Does not support:
	- right to left text (TODO)
	- custom letter spacing