Three major mobile Web development frameworks

Source: Internet
Author: User

Turn from: http://mobile.51cto.com/web-321296.htm, W.jason Gilmore.

JQuery Mobile

For almost 20 years, dealing with cross-browser HTML and CSS inconsistencies has been a problem for many developers. The advent of Ajax has exacerbated these problems because developers are now dealing with new problems: countless JavaScript-related browser incompatibilities and anomalies. jquery came into being: jquery greatly reduced the pressure to write complex cross-browser code because of the powerful abstraction of basic JavaScript tasks. No wonder jquery suddenly got a fire.

Mobile app developers now face a potentially more daunting challenge, not only because of the variety of mobile browser incompatibilities, but also because of the need to design a reasonable layout to fit the various appearance dimensions and limited resources inherent in mobile devices. At this time, jquery Mobile came into being, claiming to be "a touch-optimized web framework for smartphones and tablets," to give full play to jquery and jquery UIs (51CTO Note: View jquery UI instances/HTTP/ jqueryui.com/) advantages.

Although jquery Mobile is still beta (the second beta was announced last August 3), it has supported a staggering number of mobile platforms, including Android, BlackBerry, iOS, and other platforms such as Windows Mobile. Equally well, it supports a multitude of window components: Because of the importance that jquery mobile attaches to progressive enhancement (progressive enhancement), developers can use these widgets to easily create a unified, cross-mobile interface. Be sure to load the demo program (51CTO Note: View demo address http://jquerymobile.com/demos/1.0b2/#/demos/1.0b2/) onto a number of different devices (including your desktop browser), Take a look at how the interface changes to fit the target device.

Also, be sure to view the source code of the demo program from the desktop browser, and even the newly-started jquery user will notice that the program's code is focused on fully isolating the page layout and JavaScript-driven functionality. You will see that the entire application is within a document, and each "page" and its components are defined using the div associated with the custom attribute. For example:

    <div id= "Home" target= "_blank" >        

Key features of JQuery Mobile:

Although there are several reasons for using jquery Mobile, the following three reasons are particularly prominent:

    • jquery developers feel comfortable using jquery mobile because they use a shared code base.
    • If the target user base is not limited to using one device, it is desirable to focus on cross-platform compatibility.
    • The wide participation of communities and businesses has led to the popular development products like Dreamweaver CS 5.5 and the many noteworthy plugins like the very good photo swipe that have built-in support for jquery Mobile.

Jqtouch

Over there, JQuery Mobile strives to provide features that are compatible on many mobile devices, and the Jqtouch project instead puts most of its effort into devices that support WebKit-based browsers (Chrome and Safari). As a result, Jqtouch should be used in conjunction with Web applications designed to be deployed on iphone and Android devices. Supports animations optimized for WebKit and multiple themes designed to integrate with the design of a mobile device.

The easiest way to familiarize yourself with Jqtouch's functionality is to study the demo site (51CTO Note: Demo website address http://jqtouch.com/preview/demos/main/#home) through your mobile device or WebKit browser. I particularly recommend viewing the source code of the demo program; As you can see, like jquery Mobile, the JQTouch "page" is also assembled using a series of DIV elements and related properties that designers should be familiar with.

Key features of the Jqtouch:

Although there are several reasons to use Jqtouch, the following two reasons are particularly prominent:

    • Although Jqtouch is also based on jquery, it focuses primarily on providing optimized support for WebKit-based browsers. So if you're going to be locked in on a user with iOS or Android-based devices, Jqtouch might be appropriate.
    • Like jquery Mobile, Jqtouch also uses HTML and CSS-centric methods to develop pages, using JavaScript dedicated to adding events, animations, and other features. This approach is fascinating if you're working with designers, or if developers are not particularly proficient in JavaScript and are looking for ways to become familiar with mobile web development.

Sencha Touch

The difficulty is relatively complex compared to jquery mobile and jqtouch,sencha touch, but it is also advantageous: although more complex, it brings powerful functions. As a dual-license (commercial and Gpl/floss) product of Sencha, Sencha Touch uses a completely different approach to several of the mobile development frameworks described above, because the layout and Interface window components are built using an excellent JavaScript library, which JavaScript libraries happen to have a wealth of practical features, such as offline support, unique layouts, and the ability to easily create themes.

In addition, Sencha touch has taken an extremely holistic approach to the challenges inherent in application development because it supports applications that can be fully directly developed with MVC drivers. To visually illustrate how the contrast between developing a Sencha touch application and developing a jquery Mobile/jqtouch application is clear, you might want to add jquery mobile/ The source code inside the Jqtouch demo program is compared to the following Sencha touch code for creating and starting the viewport only:

    Ext.regapplication ({       name: ' App ',       defaulturl: ' Index/index ',       launch:function ()       {         This.viewport = new App.views.Viewport ();       },     

While this approach may be difficult for beginners who are relatively unfamiliar with JavaScript, I recommend taking the time to try Sencha Touch, because intuitive syntax, well-written documentation, and a multitude of matching examples will help you get started as quickly as possible.

Key features of Sencha touch:

Although there are several reasons to use Sencha touch, the following three reasons are particularly prominent:

    • The native MVC architecture is dedicated to eliminating tensions for framework-oriented developers, who may be distressed by how to properly organize and manage JavaScript code.
    • Sencha developers have made great efforts to publish numerous tutorials and demo applications on the Sencha website (51CTO Note: Sencha website address http://www.sencha.com/).
    • For developers who were previously familiar with the Window Component Toolkit (think about swing and GTK +), the layout and organization aspects of the window component are naturally familiar with JavaScript-driven methods.

Conclusion

Finally, the reader always asks me which frame I should choose. The answer is always the same: it depends on the situation. There is no doubt that Sencha touch is the most versatile of the development framework, but it is sometimes difficult to learn. That being said, if your goal is simply to provide a user-friendly mobile interface for existing applications, JQuery Mobile or jqtouch may provide a path with the least resistance. If you set a high target for your mobile app, Sencha Touch is likely to be worth your time. No matter what kind of solution you choose, I would like to hear your feelings after use! Welcome message.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.