Clever use of canvas

As an interesting new technology, canvas has brought us a new revolution in web graphics and web animation. To give a simple example, If you wanted to insert an icon or image into a web page before, You have to insert it with an img tag, Or put it into the page as a background picture. Now, in addition to the above methods, we can also use canvas technology to draw the required icons or images, which not only saves the design time, but also reduces the number of requests for http and accelerates the loading speed of the web page. Let me briefly introduce what practical functions canvas has.

1. Design various icons and logo

As a programmer, I think there are few people who can program and design. Therefore, as long as 1 encounters design problems, No matter big or small, they have to turn to designers. Although design work is indeed the designer's responsibility, However, if you can make good use of canvas, you can draw a lot of desired icons and logo by yourself, which can not only improve your design level, but also reduce the communication time with designers. Of course, at present, it can only be applied to less complicated graphics, and richer and more gorgeous images still have to rely on professional image software.

2. Write web games

I believe everyone has played games, whether it is end tour or page tour, which is a kind of game. Of course, since this article discusses canvas, the focus is on the application of page tour. As a promising technology in web graphics, canvas has a very rich drawing interface, which can meet the basic front-end needs of web games.

3. Animate

Logically speaking, you can make animation without canvas, but there will be a certain limit, and some animation effects will not be presented. Through canvas, we can make a series of pictures needed by animation with the help of its own drawing ability, so as to obtain richer picture effects.