knockout with mobile devices

[Francesco Abbruzzese]

I am starting a mobile application and I am considering using
knockout. Doew anyone already verified the compatibility of knockout
with the main mobile browsers, such as the ones shipped with
Blackberry, IPhone, Symbian, Android, and Windows Phone 7?

[mcoolin]

knockout examples don't work on my android phone.

[mcoolin]

just a note, I have the default safari browser.

I have used the dolphin browser as well and sometimes knockout worked.

[Mark Bradley]

most of the examples work on safari on iOS 4.3, however performance is
painful. This made it hard to test more than 4 or 5 of the examples.

On Sat, Jun 11, 2011 at 11:42 PM, mcoolin <mco...@techie.com> wrote:
> just a note, I have the default safari browser.
> I have used the dolphin browser as well and sometimes knockout worked.

--
-barkmadley
sent from an internet enabled device

[Francesco Abbruzzese]

I understand, so as a conclusion at moment there is no hope to use
knockout in an actual mobile application....

On 11 Giu, 16:54, Mark Bradley <barkmad...@gmail.com> wrote:
> most of the examples work on safari on iOS 4.3, however performance is
> painful. This made it hard to test more than 4 or 5 of the examples.
>

[Jan Zimmek]

hello all,

i have found knockout some days ago, have seen the video and thought - "lets try it for one of our upcoming mobile apps".

but as francesco pointed out, performance on iphone/ipad is not acceptable for a good user experience on mobile devices. especially the "animated transitions" is really slow, even on my macbook pro + safari 5 the performance is not really good.

maybe one of the knockout developers could comment on this performance thing - is it a known issue and will it be tackled in one of the next releases ?

i like knockout, it could be really a game-changer for complex javascript-heavy apps and i hope we can use it for mobile-development in the near future.

regards
jan

[Steven Sanderson]

Hi all, and welcome!

I think you're absolutely correct to consider performance very carefully when targeting mobile devices. More and more people use mobiles and tablets to browse the web, so our applications need to treat them as first-class citizens.

I'm aware that the knockoutjs.com site currently gives a bad impression of mobile performance - you are right that the live examples there run very sluggishly (on mobile safari, at least). The good news is that this isn't at all caused by the knockout.js library, but rather is a consequence of the layout and styling of the pages on the examples website. 

To show this is the case, I've done three things:

(1) I've made a one-line CSS tweak to http://knockoutjs.com/examples/grid.html, and it now runs massively faster. On my iPhone 3GS (not exactly a new device), you can now switch between pages in about 0.1 seconds, whereas before the CSS tweak it took about 0.8 seconds to switch pages. Try it out and see if you can see the improvement. (Note: the CSS tweak was just putting a fixed height on the box around the grid, so the browser no longer has to rerender the rest of the document when you change pages).

(2) I've also duplicated the grid example at http://jsfiddle.net/qJavL/ without the rest of the page's styling. Try it on an iPad - you'll find it's massively faster than running the exact same code on knockoutjs.com.

(3) I've also duplicated the animated transitions example at http://jsfiddle.net/4N9N8/. Again, it's massively faster running there than on knockoutjs.com.

So, what makes knockoutjs.com slow? It's a mixture of things, none of which are related to knockout.js itself: the very large background image, the box shadows, and quite significantly the client-side syntax highlighting. These things cause the HTML rendering to be expensive, and on slow devices, that's really noticable. The lesson is to keep your markup fast to render, which means being careful about complex CSS, large background images, etc. I should also point out that when the animated transitions are actually in the process of animating, knockout.js itself is doing *nothing at all* (KO just tells jQuery to start the animations), so certainly can't be influencing the animation speed.

Regarding Android support, it's supposed to work with Android 2.2 and later (see http://knockoutjs.com/documentation/browser-support.html). If you're able to reproduce a case where it doesn't, can you post a bug to https://github.com/SteveSanderson/knockout/issues? 

Thanks!

Steve