27 November 2015

Everything a Java Developer should know about the JavaScript landscape

by Geertjan Weilenga
Presentation was based on this article

The industry is ever changing and the latest changes introduced 3 new concepts :

  1. The concept of multiple devices requiring responsive UI design
  2. Browsers are everywhere (and by everywhere I mean everywhere, my watch has one)
  3. Single page applications (SPA)
This caused a few changes to the way we use existing frameworks :
  1. HTML is now an application framework and not just a text markup language
  2. CSS is now all about media
  3. An entire universe of frameworks and tools
  4. JavaScript is taking it's place as the assembly language of the web
Here are the 10 tips that Geertjan gave :

Resist the hype

If it weren't in first place I'd put it there, but it seems that me and him are on the same page. One good pattern is to consider supplementing an existing application instead of changing it, e.g. adding mobile functionality. Another question one might want to ask himself is "do my users actually need this", before embarking on a holy crusade aimed at changing the technology or/and architecture of the application.

Think of HTML as an application framework

Shake up the old prejudice and embrace HTML as a full fledged application framework. Avoid using supplements (such as Adobe Flash), new features need to be based on HTML, CSS and JavaScript. See if there aren't components in the HTML framework you are not aware of (e.g.datalist, shadow root or shadow DOM)

"HTML has become a lot more interesting"

CSS i also different than what it used to be

CSS is now capable of creating media queries and thus creating UIs that are rendered in a different way depending on the size of the display of the devices used. See example here.

Response.js is a framework that fully takes into account responsiveness allowing you to define breakpoints and then executing specific actions when these breakpoints are hit.

Evaluate framework vs. library

If Angular is not for me than perhaps I need to build my own framework? There are a lot of libraries which could be used, in combination, so that specific goals are met, some of them include:
  • Prototype
  • jQuery
  • underscore.js
  • dojo tookit
  • MooTools
  • Grunt (Ant/Maven for JavaScript)
  • Gulp (a better version of Grunt)
  • Brunch (a better version of Gulp)
  • Backbone
  • Ember
  • Knockout (focuses on only one thing - two-way data binding)
  • Meteor
  • AngularJS (focuses on all-in-one-solution)
  • React (the new AngularJS)
Component libraries such as :
  • PrimeFaces
  • yUI
  • KendoUI
  • Bootstrap UI
  • Yeoman - good for scaffolding
  • Node JS - a full fledged JS backend server

Incorporate modularity

EcmaScript 6.0 comes with built in modularity, but in older versions this could be achieved with require.js or Browserfy.

Evaluate the abstractions

Do not worry about volatility

Hard advice for an enterprise developer, but the truth is most of these frameworks will die off in 2-3 years, which is a typical lifespan for a JS framework. This is why most people do not code millions of lines of code on JavaScript. It is typical to rewrite your UI frontend every 1.5 years.

From WORA to WANTA

Write Once Run Everywhere to Write Once, Never Touch Again

Evaluate corporate frameworks

  • DoubleClick by Google
  • SpectIngular by ING (based on Angular)
  • Salesforce Lightning Platform by Salesforce
  • MobileFirst Platform Foundation by IBM
  • Oracle JET by Oracle 
Most of them combine a lot of other frameworks inside them and act as aggregators.

JavaScript is the assembly language of the web

Assembly is created for a particular platform, JavaScript is created for browsers. As such we want to treat it like any other assembly language :
  • Never try to read it
  • Instead transpire to it from other more friendly languages
  • DukeScript - has a view layer in HTML, everything else is in Java, uses maven archetypes

No comments: