値を配列に溜める
画面を n × n の格子に区切って、各セルの値を一本の Float32Array に並べる。二次元の絵を一次元の配列で持つので、(x, y) の場所は y * n + x 番目になる。行を横に詰めてから次の行に移る行優先の並び。しきい値もディザも畳み込みも、この配列を読んで書き換える操作になる。
行優先(row-major)。二次元の格子を一次元配列に平らに詰める並べ方。(x, y) のインデックスは y * 幅 + x。隣の列は +1、隣の行は +幅 で届き、近傍を読む処理がインデックスの足し算で書ける。値を書く配列と読む配列を分けると(ダブルバッファ)、全セルが揃ってから一斉に隣を見にいける。同じ配列に書きながら読むと、計算済みの隣が混ざる。
sin を混ぜた場を一度この配列に書き込み、それを読みながら塗る。書き込みと描画のあいだに、値を貯める配列が一枚はさまる。
書き込みと描画を別のループに分けてある。隣のセルを参照する処理は、一度全部の値が揃ってから隣を見にいく。だから全セルぶんを貯める場所がいる。buffer[y * n + x] の v を tint に渡して、0〜1 の値を 8〜238 の輝度に伸ばしている。
向きを返す場でなく明るさを返す場をこの配列に流すと、ノイズの濃淡がそのまま並ぶ。下は勾配ノイズの場を Float32Array に書いて塗ったもので、画素を直に触らず格子のセルを fillRect で打っている。