How does bitmap work and what canvas really is?

@brandy 

Bitmap is a type of image file format that represents a graphic by dividing it into a grid of pixels. Each pixel on the grid corresponds to a specific location on the image and has its own color value. Bitmap images are resolution-dependent, which means that the quality of the image is determined by the number of pixels per inch (dpi) or dots per inch (dpi) in the image.

When a bitmap image is created or displayed, each pixel is individually manipulated to form the desired image. This makes bitmap images suitable for representing complex or detailed graphics, but they can be memory-intensive and may lose quality if scaled to larger sizes.

On the other hand, a canvas is an area that serves as a drawing surface in computer graphics or graphical user interfaces. It provides a way to dynamically create and manipulate visual elements such as images, shapes, and text. A canvas is typically used in programming or web development to create interactive graphics or animations.

In the context of web development, HTML5 introduced the element which allows for dynamically rendering graphics via JavaScript. The canvas element acts as an empty container that can be accessed and manipulated using JavaScript methods. Developers can draw on the canvas using various API calls, such as drawing shapes, applying colors or gradients, and even creating animations. By controlling the pixels on the canvas, developers can create dynamic and interactive visual content on the web.