WebGL/GLSL-基本噪波显示块/正方形

我试图渲染一个基本的噪波，所以我选择了一个在互联网上找到的噪波函数。它工作得很好，但是当我想通过添加uTime值沿y轴移动噪波时，会出现一些方形/块形状，我找不到原因

所以它是这样开始的：

当我沿着y轴移动它时，它是这样的：

下面是片段着色器代码：

precision mediump float;

uniform float uTime;
 
varying vec2 vUv;


// Helpers

float rand(vec2 coord){
    return fract(sin(dot(coord, vec2(12.9898, 78.233)))* 43758.5453123);
}

float noise(vec2 coord){
    vec2 i = floor(coord);
    vec2 f = fract(coord);

    // 4 corners of a rectangle surrounding our point
    float a = rand(i);
    float b = rand(i + vec2(1.0, 0.0));
    float c = rand(i + vec2(0.0, 1.0));
    float d = rand(i + vec2(1.0, 1.0));

    vec2 cubic = f * f * (3.0 - 2.0 * f);

    return mix(a, b, cubic.x) + (c - a) * cubic.y * (1.0 - cubic.x) + (d - b) * cubic.x * cubic.y;
}


void main() {

    vec4 color = vec4(1.);
    vec2 uv = vUv;
    float speed = uTime * 1e-3;
    vec2 coord = uv * 8.;

    float noise1 = noise(coord * 5e-1 + vec2(speed * .25, speed * 4.));

    color = vec4(
        vec3(noise1),
        1.
    );


    gl_FragColor = color;
}