App Frameworks (Desktop, Mobile, Tablet, etc.) Tools

Front-End App Frameworks: [^1]
Native Hybrid Mobile WebView (i.e., Browser Engine Driven) Frameworks:

These solutions typically use Cordova, crosswalk, or a custom WebView as a bridge to native APIs.

Native Hybrid Mobile Development Webview (i.e., Browser Engine Driven) Environments/Platforms/Tools:

These solutions typically use Cordova, crosswalk, or a custom WebView as a bridge to native APIs.

Native Desktop WebView (i.e., Browser Engine Driven) App Frameworks:
Any Platform App Frameworks:

These solutions take your application and build it across several platforms and devices

Native Mobile App Frameworks (Aka JavaScript Native Apps)

These solutions use a JS engine at runtime to interpret JS and bridge that to native APIs. No browser engine or WebView is used. The UI is constructed from native UI components.

References:
Performance:

NOTES:

Keep an eye on inferno, Svelte, and NX in 2017 for building component based UI applications.


ADVICE:

[^1] If you are new to front-end/JavaScript application development I’d start with Riot or Vue.js. Then I’d work my way to React. Then I’d look at Angular 2, Ember, or Aurelia.

If you are building a simple website that has minimal interactions with data (i.e. mostly a static content web site), you should avoid a front-end framework. A lot of work can be done with a task runner like Gulp and jQuery, while avoiding the unnecessary complexity of learning and use an app framework tool.

Want something smaller than React, consider Preact. Preact is an attempt to recreate the core value proposition of React (or similar libraries like Mithril) using as little code as possible, with first-class support for ES2015. Currently the library is around 3kb (minified & gzipped).

Can’t decide between React or Angluar 2, read, “Angular 2 vs React: The Ultimate Dance Off”


SURVEY RESULTS:

The images below are from the 2016 Frontend Tooling Survey (4715 developers) and 2016 State of JS Survey (9307 developers)

App Frameworks (Desktop, Mobile etc.) Tools - 图1

Image source: https://ashleynolan.co.uk/blog/frontend-tooling-survey-2016-results

App Frameworks (Desktop, Mobile etc.) Tools - 图2

Image source: http://stateofjs.com/

App Frameworks (Desktop, Mobile etc.) Tools - 图3

Image source: http://stateofjs.com/