I am about to start working on my first mobile HTML5 app. It is NOT a graphically challenging app like a game, but a typical mobile app that interacts with a REST server.
I already know Backbone, and zepto is pretty much same as jQuery so I was thinking about using this combination (and packaging it with Phonegap). But then I saw this video from Sencha https://plus.google.com/+Scobleizer/posts/ZtnZNrCfWv6 and am now amazed.
I used to think I have to pay for a Sencha license but as the video says, the license is free (Although I don't know how they make money if everything is free). Also, they have all the implementations of technically-challenging browsing modules, like carousel and infinite scrolls.
Although I've been using Backbone a lot, I have never done a mobile version (I've never really worried much about re-using cells, etc.), so I am wondering how difficult this part is if I wanted to go with Backbone+zepto option. I can imagine implementing cell recycle myself and feeling unhappy about how unoptimized it is. But then again, it could be easier than I think. I have no idea what it's like.
So please, could you share your experience using Backbone + zepto? Also pros and cons of using either option vs. the other. Thank you!
Related
As we are now a days fond of bootstrap css which helps in compatiblity. My question is how exactly it deals with the loading as we have more load to the desktop apps and less to mobile. So according to me the css is handling through #media-screen object stylings with toggling of display and alignment. But even if we control the display from client side css or js. Server side will do its task of loading, So whether both desktop website and mobile website are taking the same amount of dataload.
Why am i asking this is if there is same amount of dataload, ill rather choose Android app instead of bootstrap for the fast performance.
Its important to remember that Bootstrap is a client side framework for helping to create responsive websites. You're right in that the same amount of stuff will be sent down the pipe regardless of the device that is used. This is true for any website that just uses client side frameworks to render for mobiles, such as jQuery Mobile.
If your application is big and complex then you may be better off serving up a different page for those mobile devices using Server side technologies. We use the Microsoft .Net stack which can render different views/scripts/css depending on a number of parameters to do with device. You can still use the Bootstrap framework, but maybe render less in the DOM, or have a smaller version of Bootstrap. You could even try a different framework such as the super tiny Pure framework.
Another alternative like you said is to build a native app. This will generally (if you make it right) be faster that what you can achieve in the browser, but you need to be careful that it is actually providing something useful to the user to encourage them to install it. If you are just using it to make it easier to make your website then you're doing it wrong, but if you are building a highly complex app that can leverage some of the extra functionality you can use in a native app then it may be a good way round it.
Without a real question there isn't a huge amount more than my own experience to draw on here, and there is no real right answer to how you go about it, but in answer to the question of how it deals with loading, client side frameworks can't really change what is being loaded without serious customisation or using some server side technology to deliver different pages altogether.
We have an upcoming [big] project, involving a series of mobile apps. Unfortunately we're still new to this market. Our biggest problem is not learning something new, but rather having to develop the same app twice which means approx ~ twice the cost and Hence we're trying to find a cross platform solution.
Since our expertise is in C# and .NET we are very interested in MonoDroid/Touch, and from what I've read that it is a mature framework.
However it is not exactly cross-platform (or am I wrong ?) and so we turned to Phonegap, which lets you build mobile apps with js, css and html which are technologies which we feel comfortable using.
Our apps are going to be very data intensive and might also require to be "invoked" by the server, i.e. there might be 2-way communication between the server and the app.
and so my question, given these kind of apps would you suggest phonegap or monoTouch/Droid?
Thanks in advance.
Monotouch is NOT cross platform. It allows you to create reusable elements, but you can't build once and deploy to all platforms, especially if your project is really as complex as you are making it sound.
I don't know much about phonegap. I've always steered clear of it. It might have changed since I looked at it last, but as I gather its not very robust and doesn't create very good apps, especially (again) for a complex app.
There is another cross platform framework called Titanium, but similarly to the both above its not great. There is more support for it every day, but it is missing some key components and you tend to get so far into a project and realise that you're not able to get any further.
My answer, which you're not going to want to hear, is that you should do it for each platform separately, and charge your client as such.
Creating a mobile app cross platform is like creating a t-shirt that will fit everyone. Ok, so you can make it stretchy, and you can design it in a way that will "suit" everyone, but what you'll end up with is something that is going to be too big or too small, and no-one will enjoy.
iPhone, android, iPad, blackberry, windows phone 7, bada etc etc they're all VERY different platforms. Just because they're both mobile phones doesn't make them similar at all. The way that the UI is designed and displayed is varyingly different, and the way you interact with the hardware (and ultimately the user) is also different. Case and point - iPhone as you go down views you create a navigation stack which you navigate using a back button in the title bar (which has the title of the current view in it). Android you navigate with the back button on the device and the action bar is used for the app title and other "action buttons".
To this end I would suggest, if you REALLY don't want to do everything natively (which is definitely the best option) then I would suggest looking at Monotouch and creating two apps with reusable components.
With PhoneGap you will create a web application. It can look like a native app, but it's really a web app running inside a browser object.
You'll be programming the client HTML and javascript, just like any other client side web app. You can create ajax calls to the server to get your data and do all your usual C#/.Net stuff there.
With Mono, you will create a clients side application, and you can program that client in C#/.Net.
PhoneGap will be more or less free and can be used for other platforms than Windows, iOS and Android as well, though you'll have to setup environments for each version. You can compile for all platforms in the cloud, but that'll cost you money.
MonoTouch/Droid will set you back a few hundred dollars.
For each platform, you will have to do some extra tweaking. Probably giving it a native look and feel, call different API's, etc.
I would personally advise the Mono route, since you know C#/.Net already. It'll give you results faster. Make use of the free trial for MonoTouch and see if it's something for you and if it's worth buying ($698 for both 'touch and 'droid).
It depends.
I agree that going native gives you the best possible performance and user experience. It's certainly the only feasible option if the app has a demanding UI. But if the app is more informational (perhaps displays news feeds for example) then a hybrid HTML5 app could be the go. The support of HTML5 within a UIWebView on iOS has some quirks in the older iOS versions so tread with caution. And on Android and other platforms, HTML5 isn't quite there yet. Certainly not on older hardware that doesn't have the grunt or browsers with suboptimal javascript engines.
With your .NET background, I suggest you have a look at http://www.vsnomad.com and evaluate it for yourself. Throw a quick demo together and see how it holds up. Otherwise, yeah, go the native route.
I'm planning to create a TV Guide app. The app has to interact with a server to get the data and display it in a timetable. The speed and UX are really important. Nothing flashy, I just want the page and state transitions to be very smooth and the assets/icons to look very good. Is it viable to use Phonegap for this app? I'm more proficient in HTML+CSS+javascript than Java/Obj-C but won't mind going native if it's the best way provide awesome UX.
You can totally do it with phonegap. I'd recommend using a javascript framework as well such as backbone.js for transitions and such.
PhoneGap just wrapps a native-app hull around a browser-application. This means: the phonegap-app must simulate a webbrowser and its javascript-engine. It does not convert your application into a real native app. This makes phonegap-apps slower than native apps.
I made bad experiences with an app that is scrolling through a long table of more than 1000 items, each of them holding five text-strings and two icons. Scrolling through the first 10 or 20 items was reasonable, but at item #50 it became really slow, and beyond item #100 scrolling was almost imposible.
So I wrote a native iPhone-App, and it scrolls at the end of the list as fast as at the beginning.
conclusio:
PhoneGap is fine for simple apps that need little resources. But when dealing with long lists or pages that are made of many different items, phonegap is considerable slower than a native app.
Really the decision to use phonegap comes down to abilities, resources and performance needs. Phonegap will be slower than native just by it's very nature that it's another layer on top of native whereas native is optimized to be as fast as possible. Then the second question is your resources. If you only plan on releasing to one platform and have the ability to build native, that could make the most sense. On the other hand if you don't have the resources and want to build to multiple platforms quicker, phonegap will definitely fill that need.
For frameworks, there is sencha, jquery mobile, Dojo Mobile (I find that framework to be the most difficult to use) and Kendo UI (newest of the bunch but not really free either).
And another great template start is to use Mobile Boilerplate to understand the best practices for an hmtl5 starting page.
http://html5boilerplate.com/mobile
if you use phonegap, it will be more easy to create the app for the other platformes(android WP7 ...)
but improving it will take you much more time.
because to have nice transitions and effects with phonegap , you wil need some libs and frameworks like (jquery mobile ,sencha touch ,dojo framwork)
1
Which one method is faster to open and use HTML5/jQuery Mobile page in android device?
Use Phonegap or just make normal activity with WebView? Page is in assets folder and App doesn't need to use any hardware component. It's just list of different web page links. And Every link should open second activity and open the link in WebView.
2
Someone says that Sencha Touch is faster than jQuery Mobile and someone else says that jQuery is as fast but much more stronger because there is more abilities to do. So which one is more recommended. Or is it only what you like is better? (Like it really doesn't matter which one you use)
jQuery is much more easier to start if you don't have experience about web coding. Am I right?
Which one method is faster to open and use HTML5/jQuery Mobile page in android device?
Use Phonegap or just make normal activity with WebView? Page is in assets folder and App doesn't need to use any hardware component. It's just list of different web page links. And Every link should open second activity and open the link in WebView.
Normal Activity with Webview will be faster then using phonegap because phonegap takes more time to get the document to be ready as compared to Native thing.
Someone says that Sencha Touch is faster than jQuery Mobile and someone else says that jQuery is as fast but much more stronger because there is more abilities to do. So which one is more recommended. Or is it only what you like is better? (Like it really doesn't matter which one you use)
jQuery is much more easier to start if you don't have experience about web coding. Am I right?
Yes you are right Jquery is much more easir then sencha touch. I use jquery mobile and its awesome. Although Sencha is little bit faster but i will recommend you to use Jquery mobile. :)
In general yes JQM is a lot easier to learn. I've spent about a week now looking through Sencha and if you don't know EXT.js it seems pretty complex. Even the demos are confusing and it seems to be way more programmer oriented in the way things are constructed versus design oriented.
I'm also looking at netbiscuits tactile - but I haven't spent enough time looking at that yet.
I am about to decide which way to push our smartphone development.
I have read numerous articles about these technologies. I have also created test apps, but wanted to be 100% sure that I get this right.
I am not able to create EXACTLY the same look and feel like native app in PhoneGap because it runs in WebView Controler. And the webish look and feel is as far as I will get with this tech. correct?
(In the example app I have created with PG, the look might be similar, but there is a delay when i click on buttons and the animation is not so fluent as in native apps)
Latest Titanium seems to have changed its approach to WebView, to remedy that lack of look and feel of native apps. My question is (I havent tested this myself). Can I create EXACTLY the same look and feel of an native app with Titanium?
EXACTLY is the key word. I mean can a person tell a difference if app was created with Titanium? because I can definitely tell that app was created with PG.
Final goal is the UX, ppl sense this things, and on smartphones anything that is webish and is suppose to be appish is a bad UX i believe.
Thanks
Compared to PG Titanium is more Native like UI experience but it's kinda problematic for Android.Since it's originally intended for IOS.
Titanium for Android is pretty buggy and can mess you up and the thing that you have to come up with workarounds and if you cant find any then you are stuck.
But if you are okay with that and i can easily advise that Titanium is way to go though it's nearly native (not exactly) which close to exactly.I dont think an average user would understand Titanium .
2) yes, since titanium uses the original UI. your javascript code is wrapped to native Objective c code that creates native elements. only constraint is that your are not as flexible as with real native code written by yourself. but you can write native modules and add them to your projekt. so you're able to expand your project with custom UI too.