threejs checkerboard canvas texture

checkerboard.ts

import { CanvasTexture, NearestFilter } from 'three/webgpu'

const size = 4;

const canvas = new OffscreenCanvas(size, size);

const context = canvas.getContext('2d');
if (context === null) throw new Error('context is null');

context.fillStyle = 'white';
for (let j = 0; j < size; j += 1) {
	for (let i = 0; i < size; i += 1) {
		if ((i + j) % 2 === 0) {
			context.fillRect(i, j, 1, 1);
		}
	}
}

const map = new CanvasTexture(canvas);
map.magFilter = map.minFilter = NearestFilter;
// map.generateMipmaps = false;