How to implement the effect of displaying the image?

Question

JavaScript

How to implement such an effect: the picture is, as it were, in a “haze”, an effect such as blur. The area of ​​the picture under the cursor "appears". This area needs to smoothly animate and follow the cursor, so clip-path solutions won't work.
I understand that this should be done using Canvas or WebGl. The problem is that I do not even understand the principle of such a solution.
Please tell me how such an effect can be implemented (using some technology, PixiJs / ThreeJs, on a pure canvas or something else)
Plus I will be grateful if you tell me literature that will help you understand the essence of working with graphics, pixels, effects etc.

Answer 1

https://codepen.io/MalemScha/pen/NamYYM