Home Blog HTML5 Frameworks – Kendo UI from jQuery Mobile perspective

HTML5 Frameworks – Kendo UI from jQuery Mobile perspective

     
    4
    It is about time for me to write something about Kendo UI. At first I was very skeptical about this framework. I am not trying to tell Kendo UI is not good, truth is far from it. It was a fear that people don’t want to read a review of commercially available framework when there are numerous free of charge. If this is a deterrent in any way then skip this article. Kendo UI may be the best HTML5 framework in existence, but it will not be useful unless there is a willingness to pay few hundred dollars (per developer … per server-side technology).
     

    Introduction


     
     
    Kendo UI consists of few components. First one is web component which provides you with a simple and consistent programming interface, polished and innovative UI widgets for the web, powered by  jQuery ,  HTML5  &  CSS3 , a  MVVM framework , themes and template support. This is also an only open source part of framework.
     
    Second component is a mobile app development framework which will be used for this article examples, mainly because good mobile performance separates good HTML5 frameworks from average ones.
     
    Third one is a data visualizations component powered by HTML5. It can be used to create charts and dashboards which is usually only possible in desktop environment. Last but not least component is server side wrappers. With the server-side Kendo UI wrappers,  .NET ,  PHP  and  JSP  developers can build HTML5 apps without hand-coding JavaScript. Which is neat but it will not be part of this review, I am more interested in a client side.
     

    Why Kendo UI


     
     
    This was the first HTML5 framework that came up to my mind when I was discussing with my friends about an idea to start an article series about currently top available HTML frameworks. In my spare time, I work with jQuery Mobile and because Kendo UI uses jQuery as its application framework it was a natural next step. While I also work with Sencha Touch, I think jQuery based frameworks are more appropriate for less skilled javascript developers.
     
    I am not trying to say this is a framework for dummies, it simply has a much better learning curve than pure javascript base frameworks like Sencha Touch and its ExtJS application framework. While using jQuery, Kendo UI doesn’t have anything to do with jQuery UI or jQuery Mobile. But this is to be expected, it is created as an alternative to other jQuery group products.
     

    Platform support


     
     
    Kendo UI supports every major desktop and mobile browser including IE7 which is pretty impressive. From a mobile perspective, WinPhone8, iOS, Android and Blackberry platforms are supported. Unlike jQuery Mobile Kendo UI widgets match the theming and functionality behavior of native controls available for  iOS ,  Android ,  BlackBerry  and  WinPhone8  development, including buttons, navigation, and lists. There’s another great thing, if you want to create a hybrid mobile app you only need to do it once, Phonegap is here to wrap our app into a native package, just like with jQuery Mobile.
     
    Good
     
    • Support for major desktop and mobile browsers, not just web-kit browsers. Not to mention support for major mobile platforms
    • Code is optimized for major mobile platforms. Android app will use optimizations made from android platform, same thing goes for iOS and rest of them.
     
    Bad
     
    • Nothing particular
     

    UI and visual impression


     
     
    UI looks stunning, it is not the best looking HTML5 framework I ever so but it pretty close. High CSS3 usage is pretty obvious, box-shadows and gradients are used everywhere. For some reason, overall app performance doesn’t suffer because of it. This is relatively important because jQuery Mobile 1.4 abandon a lot of its CSS in hope it will improve overall app performance, not to mention CSS3 background gradient is known performance killer (on mobile devices).
     
     
    There’s one more thing that left a great impression on me, unlike jQuery Mobile, Kendo UI mobile app will behave / look differently depending on a platform. This is a big step over a jQuery Mobile UI, whose theme feels like iOS UI, which is relatively OK on iOS, but, at least for me, fails on Android. It can go even further if different layouts are used on different platforms which can be easily turned on through simple HTML usage (example can be found in an example below).
     
    Widgets in both jQuery UI and Kendo UI support themes and styling via CSS. Both frameworks also provide a number of themes out-of-the-box along with a means of creating custom themes. Widgets and themes are customizable, it can be done manually or through provided visual tools.
     
    Link to the jsFiddle example: http://jsfiddle.net/Gajotres/LGwM7/
     
    Android example
    iOS example
     
    As you can see in an example below mobile UI renders by default as an iOS on desktop browsers, if you view it from an Android browser it will have android look and feel.
     
     
    Unfortunately jsFiddle and Kendo UI don’t work together correctly when viewed from mobile devices so take a look here: http://example.gajotres.net/kendoui/index.html. You will see 2 completely different applications depending on iOS or Android device.
     



    Good
     
    • Native look depending on platform and platform version. For example, app will look different when watched on different iOS versions.
    • App performance don’t suffer from heavy CSS3 usage.
     
    Bad
     
    • Again nothing particular
     

    Availability, ease of use


     
     
    Just like jQuery Mobile this framework is extremely easy to use. It will be even easier if you have a good background with jQuery Mobile, mostly through similar HTML layout usage. Unlike jQuery Mobile, javascript usage is a little bit different. Where jQuery Mobile is heavily influenced with jQuery, Kendo UI uses more vanilla looking javascript syntax. Which is strange if you consider jQuery is used in both cases as an application framework. Not to mention MVVM architecture which is missing in jQuery Mobile.
     
    Good
     
    • Page layout system similar to jQuery Mobile
    • MVVM usage
     
    Bad
     
    • Javascript usage is different than with a pure jQuery so don’t expect quick transition. Then again, transition is much quicker the with Sencha Touch.
     

    Documentation


     
     
    Link: http://docs.kendoui.com/getting-started/introduction
     
    This is the first point in this article where I am obligated to criticize Kendo UI framework. Official documentation is, simply put it, bad, especially compared to jQuery Mobile or Sencha Touch. There are plenty of written examples but too few working examples or images. My biggest concern is who ever wrote this documentation didn’t think to use friking framework described to show how everything looks like.
     
    A lot of small things are missing or described in sections where they shouldn’t be. What makes a good documentation is time spent reading official documentation over searching Google and I need to confess I spent too much time googling for a help.
     
    Good
     
    • Excellent demos, you will probably learn more from them than from an official documentation.
    • Easy framework even with a bad documentation
    • Online community is supportive
     
    Bad
     
    • Bad documentation
    • Missing descriptions
    • Kendo UI was not used to show how examples look like.
    • Too few images, I want to see what some part of code can do. They don’t even need to use images.
     

    Reading material


     
    Building Mobile Applications Using Kendo UI Mobile and ASP.NET Web API Do not be discouraged by the title of this book, only one chapter (Chapter 3) is really dedicated to ASP.NET, rest of the book is dedicated to Kendo UI alone, making it also usable to JAVA and PHP developers. It is intended for beguines and expert developers alike. Book covers everything from API, widgets up to working example in a form of Movie Ticket Application.
     
    Instant Kendo UI Mobile Unlike the previous one, this book is dedicated only to Kendo UI Mobile library and its various components for building mobile applications effectively. It is rather short (compared to the previous one). Still it will cover everything you need to know about Kendo UI widgets and page building. One other thing, its price (6.29$) makes it also a bargain.
     

    Final verdict


     
    I can’t believe something like this was built on a jQuery foundation. But this should not surprise you or me, this is a commercial product and as such it must be faster and better than its open source brethren. It is fast and beautiful and I simply cant be objective here. This is everything I ever want from jQuery Mobile but couldn’t have with its simplicity and elegance and without its performance problems. I can go even further and place it back to beck with Sencha Touch.
     
    Of course nothing is that perfect, while it is much faster and fluid then jQuery Mobile it is still lacking something jQuery Mobile does the best and it is documentation. You will probably find yourself wondering through Google searching for something that rightfully should be mentioned in their official documentation. On the other hand community and developer support is great, and that is to be expected from not that cheap product.
     
    In the end, I urge jQuery Mobile developers to aspire to this framework.
     
     

    4 COMMENTS

    1. Thank you for great articles. They gave a lot of useful info.

      Currently I’m looking for framework to build complex hybrid application. After several days of investigation, my choice is going to be Sencha Touch or Kendo UI. As for me – they are very simular.

      - in price
      – i my expirience with both jquery/extjs
      – in their functionaity
      – I both like and used MVVM and MVC

      But I don’t understand – which one would be faster? What do you think?

    2. I think Kendo UI is very bad to be of cost. I think Ionic framework is better, free and no have too many bugs like Kendo UI

      • I wouldn’t agree, at least not with your comment regarding bugs, if anything Ionic suffers more from bug related problems, after all it’s still in beta, while Kendo UI is active last few years. On the other hand don’t get me wrong, Ionic is still a great framework.

    Leave a Reply


    nine + eight =