Question:

I'd like to normalize monochrome image pixels in that way the minimum value is black, the maximum is white and values in between are spread proportionally. Currently I do it in canvas in two steps, but I believe it should be faster in WebGL.

I can imagine manipulating colors via fragment shader, but I couldn't find any efficient way for (1) determining the actual range of the image, nor (2) approach for passing this info to another fragment shader, which could then perform that grey level normalization.

Answer:

Seems like you could generate progressively smaller textures in your fragment shader and in each texture write out min and max. So for example if you have a 16x16 texture then for every 2x2 pixels write out 1 pixels that represent the max.

 vec4 c00 = texture2D(sampler, uv);
 vec4 c10 = texture2D(sampler, uv + vec2(onePixelRight, 0));
 vec4 c01 = texture2D(sampler, uv + vec2(0, onePixelUp));
 vec4 c11 = texture2D(sampler, uv + vec2(onePixelRight, onePixelUp);
 gl_FragColor = max(max(c00, c10), max(c01, c11));

Repeat until you get to 1x1 pixel. Do the same for min. When you're done you'll have 2 1x1 pixel textures. Either read them with readPixels or pass them to another shader as your range.

It might be faster to use larger chunks, instead of 2x2 do 8x8 or 16x16 areas but keep reducing until you get to 1x1 pixels

In pseudo code.

// setup
textures = [];
framebuffers = [];
cellSize = 16
maxDimension = max(width, height)
w = width 
h = height
while w > 1 || h > 1
   w = max(1, w / cellSize)
   h = max(1, h / cellSize)
   textures.push(create Texture of size w, h)
   framebuffers.push(create framebuffer and attach texture)
}

// computation
bind original image as input texture
foreach(framebuffer)
   bind framebuffer
   render to framebuffer with max GLSL shader above
   bind texture of current framebuffer as input to next iteration
}

Now the last framebuffer as a 1x1 pixel texture with the max value in it.

Also if you have WEBGL_draw_buffers support you do both min and max at the same time writing to 2 different framebuffer attachments

Now that you have the answer you can pass it to another shader to "contrastify" your texture

If you read out the values then

uniform vec4 u_minColor;
uniform vec4 u_maxColor;
uniform sampler2D u_texture;

...

  vec4 color = texture2D(u_texture, uv);     
  vec4 range = u_maxColor - u_minColor;
  gl_FragColor = (color - u_minColor) * range;

If you just want to pass in the textures without reading them out then

uniform sampler2D u_minColor;
uniform sampler2D u_maxColor;
uniform sampler2D u_texture;

...
  vec4 minColor = texture2D(u_minColor, vec2(0));
  vec4 maxColor = texture2D(u_maxColor, vec2(0));
  vec4 color = texture2D(u_texture, uv);     
  vec4 range = maxColor - minColor;
  gl_FragColor = vec4(((color - minColor) / range).rgb, 1);

I don't know if one is better than the other. I'd assume reading from a texture is slower than reading from a uniform but for a shader this small the performance difference might be minimal

As for monochrome just change the src textures to gl.LUMINANCE