I drew a half transparent blue rect, and then another red rect.

What I'd want is the red rect totally replace the blue rect even in the intersected part.

I had a look at the details of API globalCompositeOperation at https://developer.mozilla.org/zh-CN/docs/Web/API/CanvasRenderingContext2D/globalCompositeOperation

WebGL seems support this just with it's default blending mode.