Shulou(Shulou.com)06/01 Report--

Xiaobian to share with you what you need to pay attention to when using HTML5 Canvas, I believe most people still don't know much, so share this article for everyone's reference, I hope you have a lot of gains after reading this article, let's go and understand it together!

The following is a reflection on the specific environment and situation of Canvas application in our actual development. After HTML5 is accepted by more and more technicians and companies, a large number of applications are developed and designed on Canvas, but we don't think Canvas must be used everywhere to make good results.

Under certain conditions, we strongly recommend that users use css3 and DOM instead of Canvas. Some friends call this technological phenomenon "retro flow."

At present, HTML5 has been more and more applied to the field of mobile application development, and there are also some applications in some traditional websites. While we see these gratifying progress, we can not help but think about it. It is true that Canvas has great advantages in web drawing, and its powerful cross-browser and cross-platform capabilities make Canvas almost unlimited in web pages (except for some backward browsers, such as IE6), but Canvas is not omnipotent. Developing web apps with CSS3 is a great pleasure, but its fast and efficient animation development compared to Canvas, and its ability to run anywhere in the browser without being limited by element range, should also be valued. Many people are developing games, in fact, only CSS3 can also develop very interesting games. We can't make all animated buttons Canvas, and we can't move Canvas around as elements, but CSS3 can.

There are several reasons why we advocate the retro flow of Web development.

(1)From a developer's point of view, not everyone can write JavaScript code, and CSS3 can also make perfect animations.

(2)From the technical requirements point of view, not all applications need to use Canvas, in the architect's mind with CSS3 can choose the technology implementation on demand.

(3)From the perspective of operational efficiency, unlike Canvas combined with JavaScript implementation, CSS3 is implemented autonomously, so the execution efficiency of CSS3 is higher than Canvas to a certain extent. We have experimented with 100 CSS animation elements on a page in a mobile browser, and it works very smoothly. However, after changing to Canvas, writing 100 elements is very slow.

(4)From the perspective of development and maintenance efficiency, CSS3 animation is simple to understand and easy to maintain, while JavaScript maintenance is much more complex.

"It is better to teach people to fish than to teach them to fish." In the process of writing this book, we believe that after mastering basic development skills, readers can develop games and applications by themselves.

Moreover, there are many classic games and works that do not come from very advanced technology. What really makes users love and impress people is the developer's unique creativity and understanding of the work. I believe that readers will be able to develop amazing applications after mastering Canvas. We look forward to it.

As a developer, Canvas should not be used for Canvas in development, and using a certain technology appropriately where it is needed is probably a problem that all technicians should think about. I encourage you all.

The above is "What to pay attention to when using HTML5 Canvas". Thank you for reading this article! I believe that everyone has a certain understanding, hope to share the content to help everyone, if you still want to learn more knowledge, welcome to pay attention to the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.