jQuery

If you want to use jQuery or jQuery Mobile in your BlackBerry WebWorks app, you might find the information in this section helpful.

What is jQuery?

jQuery is a JavaScript library that simplifies many complex actions, such as DOM manipulation and web service calls, using JSON or AJAX. When you use jQuery, you can minimize the amount of code you write, reduce development cycles, and simplify the maintenance of your application.

To find out more about jQuery, visit the official jQuery website.

It's important to remember that since jQuery is built on top of JavaScript, the functionality of your code on a given platform depends on the platform's support of JavaScript. If you already have a desktop web application that uses jQuery, there is a very good chance that currently existing as well as future desktop and mobile platforms will simply run your code.

You can use jQuery for commercial application development. To use jQuery in commercial projects, view the jQuery license.

What is jQuery Mobile?

jQuery Mobile is a UI framework based on jQuery Core APIs. jQuery Mobile includes a number of widgets (also called components or controls). For more information, visit the jQuery Mobile website.

jQuery Mobile works in the following way:
  • You define jQuery Mobile components in your DOM by specifying the appropriate jQuery Mobile markup.
  • Once your app loads, the jQuery Mobile framework replaces the components you identified with the appropriate controls.
For example, let's say you define a layout grid by specifying the ui-grid-a class on a <div> tag. jQuery Mobile uses the class information only as a reference and attaches any additional CSS, and when applicable, HTML and JavaScript, that are necessary for the component to function.

Things to consider when you're using jQuery

Cross-browser compatibility

jQuery is a JavaScript framework, so its functionality is subject to the features that the underlying browser specifically supports. If you already have a web application that uses jQuery, you likely tested a variety of scenarios on the more popular browsers, such as Windows Internet Explorer, Mozilla Firefox, Google Chrome, Opera, or Safari.

jQuery itself supports the most popular browsers. For information about jQuery support for each browser, visit the Browser Compatibility page on the jQuery site.

Device hardware capability

Most desktop computers now have multiple cores, at least 2.0 GHz of processing power, and enough RAM to accommodate the most inefficiently built applications. Mobile devices like smartphones and tablets have come a long way, but fall short of many computer benchmarks. The differences in hardware among different models of BlackBerry devices can significantly affect application performance. Devices with similar hardware but that run different OS versions also affect application performance.

If you're porting a jQuery-based desktop application to the BlackBerry platform, and even if all jQuery features are supported on your target BlackBerry platform, you may still need to optimize your app to address the resource limitations of the platform. jQuery is not designed to be a light framework, such as jqlite, zepto.js, jq.Mobi, or others, so you might notice a slight overhead in performance in your app, even with the minified form of jQuery. On the latest BlackBerry devices, limited hardware capability or resouce limitations is much less of an issue.

UI considerations

BlackBerry WebWorks uses all aspects of HTML5, including JavaScript and CSS, and provides you with standard UI components that you can use in your application. This gives you the opportunity to be as creative with your application design as you want.

However, there are times when you simply want to focus on development, and not spend too much time laying out, skinning, and tweaking various UI components.

You can use the jQuery UI library to simplify the process. This library provides you with many powerful components. However, this flexbility comes with the same considerations previously noted for using the jQuery framework in general. Specifically, there will be additional performance overhead. There are options available that can help you minimize this overhead. For example, jQuery Mobile is better suited for developing on the mobile platform as it addresses a lot of the performance concerns. Using jQuery Mobile tends to result in leaner, performance-conscious components. But since jQuery Mobile relies on the core jQuery framework, there is still some overhead.

Getting that native feeling

You can use any number of UI libraries and extensions to meet the needs for performance and style. A common concern, however, is that many of these libraries lack the look and feel of native BlackBerry applications. This includes the jQuery Mobile framework. The jQuery Mobile framework does not provide any BlackBerry specific look and feel either. There are two options to address this.

One option is from an open-source project that is integrated with jQuery Mobile to provide a BlackBerry 10 look and feel to your BlackBerry WebWorks apps. For more information, visit the GitHub repository for the jQuery Mobile BlackBerry 10 theme.

The other option is to use the bbUI.js framework. It is a UI framework that is designed specifically for the BlackBerry platform with a focus on BlackBerry 10 . This framework makes a number of optimizations to increase performance and reduce the memory footprint. Similar to using the jQuery Mobile framework, to use the bbUI.js framework you set <div> attributes to identify components that the bbUI.js framework then replaces to turn the components into compelling controls. For more information, visit the GitHub repository for the bbUI.js framework.

.

Debugging

Eventually, you're bound to run into issues. With some luck, the problem is simply a missing semicolon. Other times, you might come across something that's really broken. Here are some ways to more easily solve your problem.

JavaScript validation

Before you run your code, you should be fairly confident that it will run. JSLint is a great tool for validating code. Depending on which HTML or text editor you're using, there is likely a JSLint plug-in that you can leverage as well. Running JSLint will pick out the most common errors for you, including syntax or formatting.

Web Inspector

If you have developed a web application for desktop computers, chances are you've come across some form of Web Inspector tool to let you examine the source code as it runs. This functionality is also available for BlackBerry WebWorks applications. See Debugging using Web Inspector for details on using Web Inspector.

Reporting bugs

If you find a bug, you can report it at the appropriate site below:

If you have feedback regarding your experience with BlackBerry WebWorks and jQuery, visit the Web and WebWorks Development forums to share your insight or see what others are saying.

Resources

Here are some resources that can help you with your jQuery application:

GitHub repositories

Other resources

Last modified: 2014-05-14



Got questions about leaving a comment? Get answers from our Disqus FAQ.

comments powered by Disqus