Reduce Noise in Photos Online Reduce noise and grain in images using median filtering.

The tool uses React to manage state and handle user interactions, with the `useState` hook storing the uploaded image, denoised result, and filter radius. When an image is uploaded, it creates a URL object using `URL.createObjectURL` and stores it in the component's state. The `useEffect` hook ensures that this object URL is revoked when the component unmounts or the image changes. The `canvasRef` is used to access the canvas element, where the image processing takes place.

The median filtering algorithm is applied using a nested loop structure, iterating over each pixel in the image and sorting the neighboring pixel values within the specified filter radius. This is done by creating arrays to store the red, green, and blue color channel values of the neighboring pixels, sorting these arrays, and then selecting the middle value as the new pixel value. The `getImageData` method of the canvas context is used to access the image data, and the `putImageData` method is used to update the canvas with the denoised image data.

The tool utilizes the HTML5 canvas element to render the uploaded image and apply the median filter. The `drawImage` method of the canvas context is used to draw the uploaded image onto the canvas, and the `toDataURL` method is used to convert the denoised canvas image to a PNG file format, which can then be downloaded by the user. The adjustable filter radius is implemented using an HTML range input element, allowing users to control the level of noise reduction applied to the image.

The image processing algorithm uses a Uint8ClampedArray to store the image data, which is a typed array that represents an array of 8-bit unsigned integers with clamping to the range [0,255]. This ensures that the pixel values are accurately represented and processed during the median filtering operation. The use of React's `useCallback` hook helps optimize performance by memoizing the event handler functions and preventing unnecessary re-renders.