Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Reply
BlackBerry Development Advisor
oros
Posts: 1,557
Registered: ‎04-12-2010
My Device: BlackBerry Z10
My Carrier: Bell

DISCUSSION: WebWorks + jQuery Feedback

Hello all,

 

This is a bit of a follow-up to the survey conducted here:

http://supportforums.blackberry.com/t5/Web-and-WebWorks-Development/SURVEY-What-Javascript-framework...

 

First, a little background for full disclosure. My name is Erik and I am a Development Advisor here at Research In Motion. As most people in this forum will know, HTML5 has really taken off as a platform beyond just the desktop. At RIM we’re striving to stay ahead of the game when it comes to giving our HTML5 developers what they need to be successful.

 

With that in mind, I was hoping to get feedback from the community regarding your experiences implementing jQuery within your WebWorks applications. For the time being, I’d like to focus on core jQuery but would also like to explore the extensions (mobile, UI, etc.) down the line.

 

There are three main camps that I'm hoping to hear from:

  1. You’ve successfully released a WebWorks application that uses jQuery.
  2. You’re currently developing or thinking of developing a WebWorks application that uses jQuery.
  3. You've considered but ultimately chose not to develop a WebWorks application that uses jQuery.

Some general topics I'd be interested in hearing about include:

  1. What sort of application were you developing? Was it a new application or a conversion of an existing jQuery solution?
  2. What problem was jQuery intended to solve?
  3. What challenges did you face, what worked, what didn't?
  4. What would you have wanted from RIM to make the transition easier?
  5. How was your perception of WebWorks + jQuery affected as a result?

The above are just general starting points. If you have any additional feedback beyond these points, by all means feel free to provide it. If it's WebWorks + jQuery related, I want to hear your story!

 

In that spirit, please note that this thread is aimed more towards the discussion about the development cycle as it relates to WebWorks and jQuery. If you have specific development issues, I will ask that you please also post your issue in the main forum section. This will help keep our discussion here on track while giving you an avenue for proper support as well.

 

I appreciate your time in reading this and look forward to reading what you have to say!

 

Erik Oros

BlackBerry Development Advisor


Erik Oros | @WaterlooErik | eoros@blackberry.com | Developer Issue Tracker

If a reply has answered your question, please click Accept as Solution to help other visitors in the future.
Please use plain text.
Developer
bnolan001
Posts: 127
Registered: ‎02-19-2011
My Device: Bold 9930 and PlayBook

Re: DISCUSSION: WebWorks + jQuery Feedback

With my application I originally developed it in Java but switched gears when the announcement came out that you could get a free PlayBook if you released a WebWorks app.  I then switched to all custom HTML, JavaScript, and CSS code.  With the first release accepted and getting used on both BlackBerry phones and tablets I decided to simplify my code and shorten the devlopment cycle by using JQuery and JQuery UI. 

 

My app does the following:

  • Dynamically adds/removes HTML elements based on user input
  • Create dialogs
  • Queries RESTful services
  • Calls native BlackBerry Apps (Browser and Maps)

Given that JQuery greatly simplifies all but the last bullet it made sense to incorporate standard JQuery and JQuery UI.  It took a few weeks to learn JQuery and replace my code but after doing so my JavaScript was greatly simplified.  Since then any updates I've made, including the one I'm about to release, have been relatively simple to implement. Additionally, the UI package gave my app a more professional look with little effort on my side.

 

One downside with using JQuery has been a slight performance hit but it isn't that big of a deal. I also didn't go with JQuery Mobile because I didn't like the look and feel that came with it.  I didn't want my app to feel like a phone app, I wanted it to feel like a full application if that makes sense.

 

Something that would be really nice is if there was a CSS module that developers could include to have the look and feel of the native device environment.  In another forum a developer had been working on one such capability for the PlayBook.  I've also seen that WebWorks now has Dialog support so it seems like RIM is moving in this direction. 

"Not to know what happened before you were born is to be forever a child." Marcus Tullius Cicero
Please use plain text.
Developer
interfaSys
Posts: 817
Registered: ‎11-19-2009
My Device: Z10, Q10, 9900, 9790, PlayBook,
My Carrier: T-Mobile UK, Three, O2, Orange, Sunrise, Swisscom

Re: DISCUSSION: WebWorks + jQuery Feedback

[ Edited ]

I'm in camp #3 and we decided not to use JQuery for PlayBook development.

 

1. The apps we worked on and we're interested in are aggregators and need to be able to connect to multiple APIs and present various media elements fetched from various locations. They were built from scratch.

2. We considered JQuery (and similar frameworks) in order to accelerate the time to market and to prevent us from rewriting the wheel. UI elements should be plugins for JQuery and Sencha, we shouldn't have to rewrite everything ourselves for each new platform.

3. We droped JQuery Mobile in favour of Sencha, because the UI elements of JQuery Mobile were simply horrible. Everything was too flimsy and didn't look professional.

4. RIM should have released a theme for Sencha and something similar for JQuery. There is no point in telling us that we're doing it wrong because the PlayBook has some special hardware acceleration mode that the frameworks don't use. YOU go ahead and build a UI we can use right away and we'll take care of the apps idea, solution design, logic, etc.

5. We're on our own. We have to pick what works for us and fix the tons of bugs on our own because neither the framework developers, nor RIM cares. 

 

In the end, we picked a different framework, simply because it had better building blocks and because we thought RIM was supporting it since it announced a release that was compaitble with Blackberry devices on its blog. Things could have been different if RIM had worked closely with the JQuery team and had delivered something we could use 9-12 months ago.

 

And regarding Sencha, V2 is going to be released soon and there is still no sign of PlayBook support. The market is too small for them to make the effort of making it work better. Again, it's up to RIM to provide us with better tools.

--
Olivier - interfaSys ltd
Developing for BlackBerry 10 devices using the Sencha Touch framework.
Please use plain text.
BlackBerry Development Advisor
oros
Posts: 1,557
Registered: ‎04-12-2010
My Device: BlackBerry Z10
My Carrier: Bell

Re: DISCUSSION: WebWorks + jQuery Feedback

[ Edited ]

Hello bnolan001 and interfaSys,

 

Thank you for jumping right in to this conversation! I appreciate the detail you both went into. Certainly two different experiences which (as much as I wish they were both positive) provide a greater overall picture.

 

From your posts, we seem to have a commonality that jQuery was primarily sought to simplify the JavaScript implementation. However the visual aspects leave something to be desired. Specifically, jQuery Mobile seemed somewhat lacking, and the look and feel of core jQuery / jQuery UI gives too much of a "non-native" feel, both on Smartphones and the PlayBook, requiring additional investment to get the look you want.

 

bnolan001, you mentioned a slight performance hit, I have seen this on occassion myself. I haven't looked at this too deeply yet, but jQ.Mobi has released some recent press with claims to be an optimized framework. You can read about it here if you're interested. I haven't used it myself yet (and the BlackBerry name is missing from their touted platforms), but given the standard of HTML5 at the root I would expect a fair level of success. I don't mean to sway in one direction or another here (I don't have the exposure to jQ.Mobi to do so anyways), it's just some information that came up recently and thought I'd share.

 

With respect to the QNX UI look and feel project, I am a big fan of it as well; the progress they've made is just fantastic. Something similar for Smartphones would be welcome for those that prefer the native presentation. Personally, some of the things that developers have done with their own customization I much prefer, but having that native option out-of-the-box would be neat. As noted in the thread, in theory the QNX UI would likely function on a Smartphone, though my guess would be that pre-6.0 would run into issues (i.e. pre-WebKit) as some more advanced HTML5 features just weren't supported then.

 

interfaSys, your comments about the theme seem to be in the same boat here as the CSS. It seems that if CSS or a specific jQuery theme were provided that leveraged the native look and feel, the experience would have been better, is this right? I was also hoping you could expand a little on the "doing it wrong" sentence in point (4), I'm not sure I fully follow; was there an occassion when this came up?

 

Also, for point (5), do you meant that you regularly come across jQuery APIs that simply do not function on BlackBerry as advertised? Or does this refer more to the picking and choosing of UI elements?

 

My goal with this feedback is to help drive an article for WebWorks/jQuery developers who are looking to leverage jQuery in their application. A place where most of the fundamentals can be covered to make that transition easier.

 

At the same time, I am in contact with the greater HTML5 team and jQuery specialists, so any feedback I get will be relayed as far as I can take it. If you're a developer who has browsed this post and is unsure whether you should post your experiences/questions, I implore you to do so. The more feedback we have, the greater the discussion we can have.

 

Erik Oros

BlackBerry Development Advisor


Erik Oros | @WaterlooErik | eoros@blackberry.com | Developer Issue Tracker

If a reply has answered your question, please click Accept as Solution to help other visitors in the future.
Please use plain text.
Developer
shnuffy
Posts: 268
Registered: ‎08-19-2009
My Device: Bold 9700

Re: DISCUSSION: WebWorks + jQuery Feedback

There are three main camps that I'm hoping to hear from:

  1. You’ve successfully released a WebWorks application that uses jQuery.
  2. You’re currently developing or thinking of developing a WebWorks application that uses jQuery.
  3. You've considered but ultimately chose not to develop a WebWorks application that uses jQuery.

Camp 3, reporting in.

 

Some general topics I'd be interested in hearing about include:

  1. What sort of application were you developing? Was it a new application or a conversion of an existing jQuery solution?
    1. New application. Login-based system that lists various tasks assigned to or available to be taken by a user. Tasks can be "available to be taken," "accepted," or "completed" status'. Accepts pushs from server for new tasks, can also pull these tasks from servers. Allows user to see task details and update status via requests to server. Uses native notifications (from the community API) and ties into PayPal. Works in conjunction with a server backend, iOS app and soon Android. 
  2. What problem was jQuery intended to solve?
    1. Extensive DOM manipulation. Due to the extensive memory issues with WebWorks apps, the application is a single HTML page that hides or shows screens (special DIVs) based on state or user action. JQuery allows this with a beautiful syntax and sexy animations. Show or hide new tasks easily with fades, very easy access to elements, chaining, event handling, etc. It's reliable and allows for fast development of this type of UI manipulation.
    2. AJAX (XHR) requests to server. The app relies heavily on reliable communication with the server via AJAX requests -- JQuery simplifies the oh-so-painful cross-domain issue.
  3. What challenges did you face, what worked, what didn't?
    1. Since 50% of active users still use OS 5, and my app is a smartphone app, I had to support OS 5. OS 5's limited Javascript engine does not fully support JQuery, rendering it unusable. Had to completely drop the JQuery pipe dream in order to support OS 5.
  4. What would you have wanted from RIM to make the transition easier?
    1. OS 6 Javascript engine in OS 5. Make it part of the WebWorks SDK! 
  5. How was your perception of WebWorks + jQuery affected as a result?
    1. If I were able to simply support OS 6+, it'd be great. However, I don't understand how anybody can use JQuery if they are making a smartphone app and not a PlayBook app, since OS 5 pretty much has to be supported due to market share. 
    2. Further, the amount of development effort that went into supporting OS 5 was huge. To make my app work somewhat reliably on OS 5 I had to jump to through hoops (especially with DB stuff (!)) and develop workaround after workaround. 
    3. Conclusion: Until JQuery is somehow supported by OS 5, it's useless for developing WebWorks phone apps for the next few years while OS 5 market share remains significant. 
Please use plain text.
Developer
interfaSys
Posts: 817
Registered: ‎11-19-2009
My Device: Z10, Q10, 9900, 9790, PlayBook,
My Carrier: T-Mobile UK, Three, O2, Orange, Sunrise, Swisscom

Re: DISCUSSION: WebWorks + jQuery Feedback

Hello Erik,

 

You are correct about the CSS. Of course, some larger teams may want to come up with their own graphics design, but for smaller teams, it helps greatly to be able to "just" select the native theme and to focus on building the logic.

 

Regarding my point #4, yes, it came up in a discussion on here where we were talking about transitions. They are totally unusable when using Sencha (even though scrolling is smooth) and they're just as bad in JQuery mobile. I did try to fix them on my own, using CSS 3D, but didn't succeed as I'm not an expert on JS/CSS3 animations. Someone from RIM (I need to find that thread) said that the problem came from the fact that the framework was doing it wrong (rough summary). It was calculating the movements in JS and that it was slowing everyting down. I believe him, but why should each individual developer try to fix the framework when RIM could simply offer some help to the developers that build them. I'm also aware of the ALICE project, but that's one more library to master and which may not be compatible with other platforms.

 

As for point #5, I was referring to picking the framework and libraries that we feel will give an acceptable level of performance and that we have the skills to "fix", knowing that we're on our own. Lots of bugs in Sencha have nothing to do with the PlayBook, but for the ones that do, it would be nice to feel that RIM is providing solutions.

And it's not just a problem with frameworks, it's the same thing with APIs like Google Maps. Besides from being broken on the PlayBook (breaks JS events), the performance of Google Maps is sub par and even though, RIM has an agreement with Microsoft to use Bing Maps, their API is simply not as good as the one for Google Maps. Google won't listen to us (PlayBook developer), but they may include some fixes if RIM provides them, or maybe some overrides could be included in the OS.

My last paragraph was a bit off topic as it doesn't focus on JQuery per se, but it illustrates my point. If I were to switch to JQuery because it offers better functionnality and performance, I would still feel "on my own" unless RIM proves to me that they're supporting the platform by providing patches, themes and ice cream :smileywink:.

 

--
Olivier - interfaSys ltd
Developing for BlackBerry 10 devices using the Sencha Touch framework.
Please use plain text.
BlackBerry Development Advisor
oros
Posts: 1,557
Registered: ‎04-12-2010
My Device: BlackBerry Z10
My Carrier: Bell

Re: DISCUSSION: WebWorks + jQuery Feedback

Hello again all. Thank you for the additional details interfaSys and welcome to the discussion shnuffy!


Apologies for the delayed reply. My browser decided to eat, as opposed to post, my previous attempt.


I certainly understand the sentiment for full-on OS5 support, at the same time it is a tricky situation. The functionality-gap between the proprietary BlackBerry browser (pre-6.0) and the WebKit implementation (6.0+) is quite large. With the JavaScript engine baked right into the browser, it's tough to simply update WebWorks in a way that it would do something useful with unsupported functionality..


The Gears/HTML5 transition comes to mind as an example of success, but that functionality would be just a drop in the bucket in comparison to what the WebKit browser can do today.


It's as if web technologies are rocketing ahead of their former selves, but end-consumers are still catching up. We have all these great features ready to show off, but only a slice of the mobile pie with the hardware to show off to. Unfortunately, when frameworks start leveraging this new functionality, it creates cut-off points. And when that functionality is a requirement like in your case shnuffy, you get the case where the framework simply isn't a viable choice for you.


This is an issue that extends (in time) to virtually any framework, not just jQuery.


Also, this isn't to discount jQuery on OS5 completely. For many uses, I would still see it as a viable option, but it would be incorrect to say that limitations don't exist.


In the past, jQuery and WebWorks have been two separate entities. They shared a common root in HTML/5, but neither was ever specifically tailored for the other. This is something we're hoping to improve upon as jQuery is one of the more common frameworks out there. Not just for WebWorks developers, but for web developers in general.


I can not promise any drastic changes (or ice cream) overnight; we're still near the starting line. But this is why feedback is so important right now. By the community sharing what's important to them, it gives us focus in our efforts too. So keep it coming! (It would be great to hear from the PlayBook side of things too.)


Erik Oros

BlackBerry Development Advisor


Erik Oros | @WaterlooErik | eoros@blackberry.com | Developer Issue Tracker

If a reply has answered your question, please click Accept as Solution to help other visitors in the future.
Please use plain text.
Developer
interfaSys
Posts: 817
Registered: ‎11-19-2009
My Device: Z10, Q10, 9900, 9790, PlayBook,
My Carrier: T-Mobile UK, Three, O2, Orange, Sunrise, Swisscom

Re: DISCUSSION: WebWorks + jQuery Feedback

Awwww, no ice cream :No:

Thanks for listening and hopefully, it will get easier to bring great looking and performing apps to the PlayBook without having to use AIR.

 

I'm guessing that since Sencha doesn't care about WebWorks (their hands are full with iOS and Android) and since RIM seems to want to focus on JQuery Mobile, your advice to people using other frameworks would be to start looking at how they can do the same things with JQuery?

 

Would it be possible to share some of your milestones? Do you see a usable PlayBook theme coming to market this quarter?

 

 

--
Olivier - interfaSys ltd
Developing for BlackBerry 10 devices using the Sencha Touch framework.
Please use plain text.
BlackBerry Development Advisor
oros
Posts: 1,557
Registered: ‎04-12-2010
My Device: BlackBerry Z10
My Carrier: Bell

Re: DISCUSSION: WebWorks + jQuery Feedback

[ Edited ]

Hello again,

 

Just a note about this whole discussion. jQuery isn't the only framework we're looking at, and certainly isn't the only viable choice. We're looking to help the transition for people that are using a number of frameworks, but as jQuery was the framework that I've had the most exposure to, it's where I wanted to start my discussion.

 

I did also want to make a note of this, as it was just brought to my attention just now. It seems we do have a project started for a more native UI feel on BlackBerry Smartphones:

https://github.com/tneil/bbUI.js

 

As noted in the project, the current focus is OS6 and OS7, with the intention of a back-port to OS5. That, combined with the community-driven QNX UI project gives a good starting point for that native UI feel.

https://github.com/TheMarco/WebWorksQNXWidgets

 

As far as milestones go, it's difficult to say. My main goal here is to compile a "fundamentals" guide for jQuery developers (or WebWorks developers considering jQuery) to give them a lay of the land. This will include all of the topics that have been brought up here, along with some more general WebWorks guides.

 

I've reached out to the team leading the overall jQuery experience charge to see whether they can chime in with any specifics beyond what I've covered.

 

EDIT: If anyone in the community has used tneil's or TheMarco's implementation for UI, it would be great to hear your experiences (doesn't have to be related to jQuery, but bonus points if so.) :smileyhappy: I have a few projects coming up myself that I'll be leveraging these for; might as well walk the walk too, no?

 

Erik Oros

BlackBerry Development Advisor


Erik Oros | @WaterlooErik | eoros@blackberry.com | Developer Issue Tracker

If a reply has answered your question, please click Accept as Solution to help other visitors in the future.
Please use plain text.
BlackBerry Development Advisor
oros
Posts: 1,557
Registered: ‎04-12-2010
My Device: BlackBerry Z10
My Carrier: Bell

Re: DISCUSSION: WebWorks + jQuery Feedback

[ Edited ]

Hello all,

 

A little more information from my side has come to light. The team I was referring to is actually focused on jQuery Mobile at the present and will be actively contributing to that project. Currently the primary goal is to provide assistance with existing JQM bugs that have been reported by the community

 

So if you do come across an issue with JQM, please do be sure to report it through Github's Issue Tracker for that project. While we're on the topic of JQM, I did also want to make a note of the following site that can be used as Browser-support reference:

http://jquerymobile.com/gbs

 

As we've discussed, 5.0-support is limited when compared to 6.0+, but that page gives a quick breakdown of what a developer should expect. If you do find an issue outside of those expectations, the noted issue tracker would be the best way to escalate JQM-specific issues.

 

Back on the core jQuery front, I'm aiming to have a fundamentals guide out to the community soon. I aim to touch on as many topics that we've covered here as I can (along with samples), but I am also hoping to get more of your feedback (what's missing, other topics, etc.) to really make it a definitive guide. I'll touch base here again once it's ready for public consumption.

 

UPDATE (Jan. 29): jQuery + WebWorks fundamentals guide (first draft) is currently under review and will be posted soon. If you have any more feedback, advice for developers, etc. please let me know here and I'll do my best to cover the topics within the first draft.

 

Erik Oros

BlackBerry Development Advisor


Erik Oros | @WaterlooErik | eoros@blackberry.com | Developer Issue Tracker

If a reply has answered your question, please click Accept as Solution to help other visitors in the future.
Please use plain text.