HTML5-building mobile Web applications

HTML5-Build mobile web App by Gzterrytan is licensed under a Creative Commons Attribution 2.5 Mainland China License.

About HTML5

HTML5 has semantics , local storage , device access , connectivity , multimedia , planar and three-dimensional effects , performance and integration , and CSS3 Eight major technical characteristics. Get web apps into the plug-in ERA and approach desktop applications on functionality and performance. Enable the application to be web-based and achieve cross-platform.

The draft HTML5 specification will be published in 2012 as a candidate , and in 2022, the recommended version of the plan. The implementation of the specification seems to be in the distant future, not actually! Currently, many browsers have partially supported html5,caniuse.com to provide detailed browser support. The HTML5 specification itself is not many, many of the relevant specifications are independent, by the browser to implement each.

　　　　　　

Mobile web App Orientation

Mobile internet has become one of the most important ways to surf the internet, mobile phone users have reached 300 million. The era of mobile internet has been opened, the rapid development of the Internet industry has become a new battlefield.

　　　　

The rise of Android and iOS phones has accelerated the popularity of HTML5 in mobile devices. Unlike desktop browsers, mobile operating systems and browsers are constantly escalating as mobile phones are updated. The continuous upgrading of mobile browsers provides HTML5 with a steady stream of momentum in the direction of mobile web development. As the performance of the device continues to improve, the ability of mobile Web applications is gradually approaching the client application.

　　　　

Mobile Web Apps Compare the benefits of client apps:

1. More developers have extensive web development experience and tools to build a mature development community
2. More agile iterations for continuous updates
3. Cross-platform, lower development costs than clients

Web App host Selection

The web has a host, and the host is the environment that is required to run the program. The web's common hosts are browsers such as IE, FF, and Chrome. JavaScript also runs on server-side hosts, such as node. js. On mobile devices, the mobile web can run on a mobile browser , or it can run on a framework host such as PhoneGap or titanium. Of course we can also write our own framework host based on cross-platform needs.

　　　　　　　　　　　　　　

　　Framework hosting Benefits:

1. A mature community has been formed to facilitate problem solving
2. such as PhoneGap, and more than the browser has higher permissions. Access to contacts, files, cameras, recordings, and other devices
3. Can be tested with simulators to reduce cross-browser testing costs

　　 Framework Host disadvantage :

1. Publish as a client, version update difficult, dynamic release requires additional code support
2. The system may only support a single process
3. Cannot jump between products, not easy to connect

　　　　　　　　　　　

　　　　　　　　　　　　　　　　　　　　　　　　PhoneGap compatibility

Mobile browsers are included with the system and do not need to be published and updated as the system is upgraded. In the absence of permission requirements and high-end target devices, the browser host is more appropriate as a mobile Web application host.

Android Browser Mobile Safari

　　Browser Hosting benefits:

1. No need to publish, browsers generally also support desktop shortcuts
2. Product update maintenance is convenient, can achieve continuous update
3. High portability (some custom interfaces relative to the framework host )

　　Browser host disadvantage:

1. Browser compatibility is not high, there are differences in HTML5 support
2. Differences in performance are important, and the difference in processing power between devices must be considered
3. High testing costs (especially for Android devices), unable to cover all models

Mobile JavaScript Framework

With the support of HTML5, Interactive integration replaces JavaScript browser compatibility as the development direction of the mobile JavaScript framework. jquery Mobile and Sencha touch are among the most sought after.

They mainly address:

1. Interaction (including UI design, control interaction, page transitions, etc.) integration
2. Touch gestures

　　　　　　　　　　　　　　　　　　

　　Interactive Integration Framework benefits:

1. Interactions are compatible with device interaction features and design specifications (Android and iOS)
2. Low development threshold for rapid development
3. The development community already has rich cross-platform experience and comprehensive test results

　　The disadvantage of the Interactive Integration Framework :

1. Large file size, often less efficient than native HTML5
2. Interactive mode fixed, difficult to get rid of
3. Without a sound business framework, you also need to implement the underlying business framework (code updates, business module reuse, etc.)

　　　　　　

　　　　　　　　　　　　　　　　　　　　　　　　　　　　JQuery Mobile Compatibility

In addition to the Interactive Integration Framework , we can also consider developing our own mobile JavaScript framework using native HTML5 . Self-developed more targeted and purposeful, suitable for business expansion and performance optimization, can compensate for the shortcomings of the integration framework.

　　native HTML5 Framework benefits:

1. Best for long-term business expansion
2. Increased flexibility in development
3. Performance optimization for Target devices

　　native HTML5 frame disadvantage:

1. Can only be compatible with high-end devices temporarily (android2.0+, ios3.2+ performance is better)
2. High cross-platform testing costs
3. Framework development threshold is relatively high, need a period of time to develop

HTML5-Build a mobile web App