A detailed introduction to the development trends from the current status of HTML5 mobile applications

##Discussing the development trend from the current status of HTML5 mobile applications

## Time flies, five years have passed since the birth of HTML5 in 2008. As a new generation of Web standards, it has been affected by all aspects since its inception. has attracted strong attention and has also caused a lot of controversy. Supporters advocate its bright prospects because of its open and powerful characteristics, while skeptics doubt its actual role because it has not been well implemented. Now we start from the current situation and analyze the development trend of HTML5 on mobile platforms by asking questions, so that everyone can have a clearer understanding and understanding of the future of HTML5 from the complicated information.

         

What are the advantages of using HTML5 to develop Web App (or Hybrid App) for mobile platforms?

         

Pages developed using HTML5 have more characteristics of modern web pages: gorgeous interface, excellent human-computer interaction, and powerful functions. Now it is difficult for us to simply use traditional expression methods to satisfy Users have diverse needs, and it is difficult to separate HTML5 from previous versions during implementation. Therefore, we can think that most modern Web Apps (or Hybrid Apps) on mobile platforms will be developed using HTML5. So what are the benefits of doing this?

         

Cross-platform: Develop once and use it everywhere, no need to consider compatibility. This can significantly reduce the number of cross-platform developers and costs. If you think about it the other way around, mobile platforms are changing with each passing day. In addition to Android and iOS, there are also multiple systems such as Windows Phone, Blackberry, and Bada competing, each covering a portion of users. If an application wants to cover so many platforms, Apart from using Web App, it is almost impossible to solve this practical problem.

       

Cloud upgrade: The most painful thing in mobile development is each release. When publishing, you need to involve multiple app stores and channels, and you need to be very cautious. If there are major bugs or quality issues, it is extremely troublesome to fix them through the new version. In this process, the review period of Apple's App Store also gives many developers a headache. The cloud upgrade can cover all users at once, without the need for users to manually upgrade and install; any problems can be fixed at any time, without the need for manual updates from the app store and users, greatly reducing risks and workload.

       

Combined with the cloud computing platform to solve the problem of limited computing power of mobile devices: If the Web App is stored on a cloud server, it can make good use of the powerful server and cloud computing platform Computing resources can be used to complete many complex tasks that are difficult to complete due to the limitations of mobile device hardware capabilities.

# can be better indexed and retrieved by search engines, and form a quantifiable big data: Native form itself is closed, closed and disorderly data is for information flow. An obstacle can easily create information islands; the spirit of the Web itself is openness, and the semantic tags provided by HTML5 can be better identified and organized. If we can obtain more open information and data structures through Web App, we can better meet and embrace the era of big data.

       

Huge talent pool: Traditional Web engineers are all potential HTML5 engineers, and the transformation is relatively easier.

       

Bypassing the strict application store: The application store’s overly strict control over applications is a double-edged sword. For many developers and application developers, the form of Web App is The best way to bypass the traditional mobile app store model.

           

What is the current status of HTML5 development?

    1. HTML5 standard progress

      W3C specifications usually go through 5 stages before becoming a formal standard: working draft, final revision ( Last Call), Candidate Recommendation, Proposed Recommendation and Recommendation.

On December 17, 2012, W3C announced that the HTML5 specification was completed and released the HTML5 candidate recommendation specification. This means that the HTML5 specification has been stable and only loopholes will be corrected in the future. Enterprises and Developers have stable implementation goals and can launch experimental implementations. W3C will begin working on interoperability testing and performance optimization of HTML5 standardization, and is expected to release HTML5 recommended specifications by the end of 2014.

            W3C plans to summarize subsequent technical upgrades into HTML 5.1 released at the end of 2016, such as improved video subtitles, responsive images, and better Form support, new generation iFrame, etc. This approach, similar to iterative development, allows HTML5 to be implemented faster and better without being postponed indefinitely.

          To summarize, the progress of the HTML5 standard is that the specification has been completed and is gradually maturing and implemented.

      2. Mobile browser support

                        is different from the current situation where the share of IE on the desktop side continues to decline and Chrome rises rapidly, the mobile browser support situation Mainstream browsers including Safari, Android Browser, Opera Mobile, and Chrome all support HTML5 well, and their shares are still expanding. The support of mainstream mobile browsers makes the HTML5 platform more popular. At the same time, good support for HTML5 also makes these browsers more popular among users.

## The ability of HTML5 to access system hardware on mobile devices is still being implemented. At the same time, mobile browser support for the basic HTML5 standard is not a big problem, but Performance and speed could be improved. Rapid updates of user mobile devices and mobile platform hardware will solve some of the problems. For example, from 2011 to 2013, I used a single-core 528M frequency G8, a single-core 1G Nexus One, a dual-core 1.2G Galaxy SII, and now 4-core 1.6G NoteII.

          3. Various open source or paid frameworks, tools and platforms are constantly emerging and improving

            In addition to the old Sencha Touch, In addition to jQuery Mobile, PhoneGap, and LungoJS, there are also game development engines or tools such as EaselJS, Construct2, GameMaker, limeJS, Impact, Crafty, Cocos2d-html5, and responsive design frameworks such as GroundworkCSS, Skeleton, Gumby, Wirefy, and Base. and a host of tool platforms. Demand is the catalyst for technological progress, and the emergence of a large number of tools proves that there is a strong demand for HTML5 development.

# and large companies have also launched various HTML5 tools and platforms. The application porting tool App Porter, Nintendo's application development framework NintendoWeb Framework and so on. While Adobe gave up on mobile Flash, it quickly released a series of HTML5 development tools, including the HTML5 animation production tool Adobe Edge Animate and the visual HTML5 responsive design tool Adobe Edge Reflow similar to the Flash editor.

        Overall, HTML5 tools and frameworks are gradually maturing and improving after going through the exploratory stage, and are expected to be further popularized.

        3. Developers continue to maintain a high level of development willingness

        According to a survey by the HTML5 development framework Kendo UI, 73% of the respondents are still confident in HTML5, and more than 94% of the respondents are or will use HTML5 for application development, Appcelerator Related surveys have also reached similar conclusions. At the same time, the domestic HTML5 community still maintains high popularity and attention, and community activities are also very active.

        4. Application Development

            Unknowingly, HTML5 is entering our real life in large numbers. One of the application methods is the mobilization of traditional desktop websites. For example, Baidu Maps WAP version uses geolocation API and a large number of new HTML5 features. Other representative applications include YouTube, Sina Weibo, Ctrip, Taobao, etc.

        The second application scenario is pure mobile Web App, such as accounting application DailyCost, weather application Sun, reading application Meiyue, etc. They are very similar to Native App, in terms of performance Very good performance and experience.

Another way is to use HTML5 technology in Hybrid App. Now many applications display content through built-in WebView, for example, as mentioned below LinkedIniPad version.

          What are the actual obstacles to the implementation of HTML5 on mobile platforms?

        1. Performance

        The performance of HTML5 is already a commonplace issue. There are multiple factors involved in the problem, including hardware, browser, and implementation. Hardware will improve with the rapid updates of mobile devices, and even at the hardware level, the device may have special support for HTML5. The performance of browsers is constantly improving, and the implementation of applications depends on the developer's programming model and skills. This part can be improved as tools, frameworks advance, and development levels improve.

        2. Fragmentation of mobile devices and fragmentation of browsers

            Different devices and different browsers have inconsistent support for HTML5 , In addition, different mobile phone resolutions also bring challenges to the development of WebApp.

        The industry’s solution to the first problem is graceful degradation, while the second problem requires the use of responsive design. Responsive design gives us a more flexible way to deal with device fragmentation, and it not only includes the application of CSS3 Media Queries technology, but also includes responsive images (ResponsiveImages), responsive video and other technologies. We should also use It is regarded as a complete set of modern web design methods.

          3. Lack of unified implementation standards  

                                                       

3. Lack of unified implementation standards                          

                                                                                                                                                     The main problem is not that there are few technical implementation methods and methods, nor that performance is poor, but that it is too fragmented and lacks unified implementation standards.

    ###For example, Sench Touch, jQuery Mobile, limeJS, Kendo UI, Impact, as well as easeljs, GameMaker, Construct2, you can figure out their characteristics, different applicable scenarios and What are the pros and cons of each? ###

    Google and Apple have provided a set of standard development tools and frameworks for Android and iOS platforms respectively, helping developers to only focus on implementation and develop final products quickly and efficiently. . The result of HTML5 being too open is that there is no unified implementation method and standard. On the one hand, this causes developers to go through the pain of selection, and on the other hand, the correctness and efficiency of its implementation cannot be guaranteed.

        W3C only focuses more on standards, but they are also testing the performance and performance of HTML5, and the distance from standards to technology to applications is a real problem. This process It will take some time to refine and improve.

# 4, user habits

users are used to meet the needs through a single app on mobile devices most of the time, so the standard web app recognizes users to users Not as well known as Native App. However, user habits are gradually developed. When the performance, performance and ease of use of Web App are close to or equivalent to Native App, users will gradually recognize and migrate to Web App.

            What are the best development practices for the HTML5 mobile platform?

              1. Developers should be aware that on the mobile side, HTML5 applications have special expression methods suitable for them, and should not focus on being exactly the same as native applications. Only in this way can you take advantage of HTML5 and avoid endless pain. In fact, if you want to develop HTML5 applications with performance comparable to native applications, the effort, testing, and resources invested will far exceed that of native applications.

## This aspect is more representative. We intentionally removed many unnecessary design elements, such as all gradient backgrounds and rounded corners, as these would slow down rendering performance.

          2. Design the application in a targeted manner based on the characteristics of HTML5. HTML5 has its applicable scenarios, and it is not one-size-fits-all, although this scenario is becoming more and more broad and rich. Web App will not completely replace Native App, and Native App will not defeat Web App. Symbiotic and win-win, each is good at winning. They have their own suitable scenarios and uses, and will gradually coexist. So what we need to do is not to use Native App thinking to design Web App, but should focus on leveraging the strengths of HTML5 and making it unique.

          Take the Baidu Photo Album iPad version as an example. In addition to ensuring good fluency and interaction, we have also tried many interesting and cool innovative features through HTML5. These include:

                1) Use the sensor to display the movement and gradient effect of the picture: when the iPad is tilted horizontally, the cover picture will slowly move to the same angle, showing the effect through parallax A beautiful effect.

                        2) Support gesture operation of pictures: Friends who have used iPad are full of praise for the convenient and fast gesture operation of photo albums. Since HTML5's support for gestures has been relatively complete, this time we tried to add support for most gestures in the iPad version of Baidu Photo Album to adapt to user habits and facilitate user operations, such as expanding the album, closing a single picture, Rotate pictures and more.

​ 3. The best practice for developers to cover all platforms is OnePlatform+ HTML5, which is adopted by key platforms (can be Android or iOS) Native App, while all remaining platforms use HTML5 Web App to adapt. This approach will become increasingly common due to cost and efficiency concerns.

                      The trend of mobile app industrialization is becoming more and more obvious, so what are the development trends of HTML5 and the opportunities it brings?

            1. Desktop IE is gradually declining, and it is obvious that modern browsers that support HTML5 are gradually occupying the market. The mobile platform is even more optimistic. It is estimated that more than 50% of users will upgrade their smart terminals in 2013. Rapid device updates will allow modern browsers that support HTML5 to easily capture more than 80% of the market share.

          2. HTML5 has been officially released in 2012, and the standard has become stable. In 2013, the standard will be more mature and easier to popularize and apply. HTML5 specifications will gradually be implemented. As WebGL and Device API mature, the interface effects and functions that HTML5 can achieve will be broader. When the performance and performance of mobile apps based on HTML5 are very close to Native Apps, and there are mature development standards, there will be a wave of large-scale migration of apps to HTML5. As a result, a large number of users will also migrate to HTML5 applications.

      At the same time, the penetration rate of smart terminals in the United States and China is above 50%. As they gradually become more popular, there will be a wave of application migration from desktop to mobile. In this process, HTML5 will become the technology choice for a large number of applications.

        The emergence of a large number of HTML5 applications will lead to the possibility of the birth of HTML5 application showcases on the mobile terminal, and it is very likely to produce successful game applications similar to South Korea's Anipang.

            3. Mobile web games and information and news applications based on HTML5 will flourish.

Now, desktop HTML5 games have appeared such as Disney's Oz game "Find Your Way to OZ", EA's "Command and Conquer", Rocket Pack's "Warimals: Cats vs. Dogs" and other excellent works, but what about on mobile platforms?

        South Korea’s Kakao Talk and Japan’s Line platforms have achieved initial success in mobile games. The development trend of China’s mobile games will be very similar to that of South Korea, and there will be a rapid growth trend. The development process of games on the desktop side is from stand-alone desktop clients, networked desktop clients to web games, because web games cater to today's users' time fragmentation and pursuit of simple and easy-to-use needs, while mobile platforms are fragmented anytime and anywhere. The time coincides with the characteristics of web games, so HTML5 mobile web games are likely to experience explosive growth, especially on the WeChat platform. We can currently see that many large companies and startups are making efforts in this area.

              Another type of representative information news application focuses on content, and processing content is the specialty of the Web, and freer distribution forms, more convenient search engine retrieval, Wider cross-end requirements are the biggest demand for this type of application. Now foreign traditional media such as the Financial Times and the New York Times have tried to use HTML5 to distribute mobile applications.

          4. The lack of relevant platforms and tools in the HTML5 ecological chain is a potential opportunity, such as security, testing, development, system and other aspects.

        The necessities in the HTML5 mobile application industry chain include two categories: platform products, such as statistical platforms, payment platforms, advertising platforms, game engines, etc.; and basically open source and free products Tool products. In this regard, large companies, startups, and individual developers are beginning to try.

5. The direction of enterprise mobility also has great potential for HTML5. For enterprise-level applications, the user experience and user interface requirements are not as high as those of consumer applications, such as colorful product interfaces, fast and smooth sliding experience, and ever-changing gesture operations. Therefore, it is more suitable to take advantage of the advantages of HTML5 and avoid its disadvantages. Disadvantages.

                                                                                                                                                                           Real Racing is as smooth and supports multi-touch. On the desktop side, traditional OA can already meet the needs of enterprises very well, while on the mobile side, enterprises are more concerned about the stability of services and the convenience of working anytime and anywhere.

The above is the detailed content of A detailed introduction to the development trends from the current status of HTML5 mobile applications. For more information, please follow other related articles on the PHP Chinese website!