Top JavaScript Frameworks for Enterprise Mobility (Part 1/3)

WebWorks

offset_115016_BB

In the ever-evolving world that is mobile (web) development, it can feel as if it’s impossible to decide on a framework to use in building your app. Having spent the last 7 years or so in app development, trust me, I feel your pain.

Recently I tested out several frameworks. Some were open source, some closed. They all solved similar problems and were generally easy to use. What I took away from this was that there’s a lot of great work being done, but nobody has an all encompassing solution that works for every scenario, and that’s okay.

Frameworks are tools for us developers to utilize. They’re not magical cauldrons that you dump code into to spawn a killer app that works on every device, form factor, and screen size. That said, there are a handful of frameworks that make the development process much easier and more intuitive.

Over the next three weeks we’ll take you on a high-level tour of the frameworks my team tested out, and how we found their overall performance on device.

Let’s take a look at a couple of my favourites, which are both powered by Angular.js.

ionic

Ionic Framework is an “open source front-end SDK for developing amazing mobile apps with web technologies” running on AngularJS. It’s my favourite to use, and has an enormous community of developers.

Cost

  • FREE
  • MIT Licensed

Cross Platform Support

  • BlackBerry 10
  • iOS 7+
  • Android 4.1+
  • Windows Phone

Note: While Ionic does not list BlackBerry 10 as an officially supported platform, it does indeed run quite well on our device(s).

Popularity
Arguably one of the most popular (modern) frameworks available. It’s very well funded, and actively maintained.

  • ~2.5M in funding
  • 18,000+ Stars on GitHub
  • 2,800+ Forks on GitHub

Age / Maturity

  • 2+ Years old
  • Lengthy history on GitHub
  • Extends AngularJS which is very well established

Ability to Theme

  • Yes, via CSS, SASS, LESS, etc.
  • Various out-of-the-box colour schemes for components to choose from

Ability to Scale

  • Scales well on phones, and tablets.
    • Lots of potential white-space on wider-screens (Desktop)
  • Flex based layouts

File Size

  • ~120K for the core
  • ~400K bundled with Icons

Over-all Performance

  • Page transitions
    • Good
  • Performance
    • Good
  • List View Scrolling
    • Good (when native scrolling enabled)
  • Touch Responsiveness
    • Good

Support

WYSIWYG

Cordova Compatibility

Diversity of modules / components / widgets

  • Countless modules
  • All the standard web components out-of-the-box
    • Lists, Cards, Headers, Buttons, Inputs, etc.
  • AngularJS based. Can make use of nearly any third-party directives, and modules.

Larger Screen Support (Desktop / Tablet)

  • Yes
  • Meant for mobile, but does work on desktop

Localization

  • i18n (Internationalization)
  • l10n (Localization)

angular

Angular Material is an “implementation of Material Design in AngularJS”. It provides a set of reusable UI components based on the Material Design system.

Cost

  • FREE
  • MIT Licensed

Cross Platform Support

  • BlackBerry 10
  • iOS
  • Android
  • Windows Phone

Note: While Angular Material does not list BlackBerry 10 as an officially supported platform, it does indeed run quite well on our device(s).

Popularity
Angular Material is a newer framework, but is quickly gaining steam.

  • Google Product
  • 9,400+ Stars on GitHub
  • 1500+ Forks on GitHub

Age / Maturity

  • 1 Years old
  • Very actively developed
  • Extends AngularJS which is very well established

Ability to Theme

  • Yes, via CSS, SASS, LESS, etc.
  • Can be themed, but you should respect the Material Design pattern

Ability to Scale

  • Scales well on phones, and tablets, and desktop
  • Flex based layouts

File Size

  • ~500K

Over-all Performance

  • Page transitions
    • Not included. Must implement yourself for now.
    • Performance left more to be desired when added
  • Performance
    • Good
  • List View Scrolling
    • Great
    • Best list-view performance I’ve seen to date. Period.
  • Touch Responsiveness
    • Great

Support

WYSIWYG

  • No “creator” utility
  • What you see in the browser while building, is what you get on device

Cordova Compatibility

Diversity of modules / components / widgets

  • Countless modules
  • All the standard web components out-of-the-box
    • Lists, Cards, Headers, Buttons, Inputs, etc.
  • AngularJS based. Can make use of nearly any third-party directives, and modules.
  • Many third-party directives/modules don’t follow “Material Design” principals, so may be harder to find what you’re looking for in that regard.

 Larger Screen Support (Desktop / Tablet)

  • Works well on all form factors
  • Content layouts re-adjust very intelligently

Localization

  • i18n (Internationalization)
  • l10n (Localization)

As you can see, both Ionic and Angular Material are both rated (by me) quite well. I had a hard time choosing between the two. In the end, for me, it came down to maturity of the framework which is why I prefer to use Ionic for the time being.

Are you using Ionic, or Angular Material? Agree/disagree with me? Let me know what you think (@chadtatro), on Twitter!

Lastly, stay tuned for next weeks post by Naveenan who will be covering Sencha Touch, and jQuery Mobile.

About Chad Tetreault

A developer at heart, I’ve been coding in some shape or form since the age of 13. Nowadays I focus on building awesome cross-platform (Android, iOS, BlackBerry) mobile web applications powered by Cordova, JavaScript, and AngularJS.

Join the conversation

Show comments Hide comments
+ -
blog comments powered by Disqus