Top 10 technologies to learn in 2018

As you know, in our modern world, Web technologies are developing at high-speed.
Various innovations and new development trends appear every day.
What was popular yesterday isn’t necessarily just as popular tomorrow…

In this article, I’ll dive deep into the Top 10 of most popular Web frameworks, that should emerge in 2018.
First, let’s agree on the vocabulary…

What is a top tech?

In the IT development sector, a top technology must have the following characteristics:

01

Should be something trendy: quite obvious at first sight, but keep in mind some people in the IT world maintainrather old projects, and so they have a different understanding of what trendy means. Let’s agree that a “trendy” tech should have reached an important milestone or embraced a change that triggered an increase of popularity, in the recent past 3 years at most.

02

Must match the IT Web development sector: in this article, I’ll not talk about fancy Machine Learning algorithm or the latest AR/VR engine I’ll focus on what I’ve been doing the past decade: Web development;

03

Must bring ROI: most of us are not in the R&D area, and so what we invest in must somehow bring a return in time/money.

Ok, now that we’re on the same page, let’s start the countdown…

10. Google AMP

Logo AMP

Google AMP (Accelerated Mobile Page) is an open source publishing website technology, powered by google and launched in 2016. It is designed to improve performance and visibility of web content for mobile clients.

Google AMP content can be easily identified in google search results, thanks to a dedicated top stories section and a special ‘lightning’ icon.

From a performance perspective, thanks to Google’s caching mechanism, Google AMP content is rendered 10 times faster than standard HTML pages.

Since June 2017, major websites, such as Twitter, are using this distribution format for mobile clients.

  • For any public Web Content
  • Link canonical content with AMP content
AMP

9. Openstack

Logo OpenStack

Openstack is a free and open-source software platform for cloud computing, primarily deployed as infrastructure-as-a-service (IaaS). It was initially created in 2010 by Rackspace and NASA, but since 2016, it’s powered by RedHat.

One of Openstack’s strengths, compared to similar products, is that it does not rely on any proprietary hardware or software requirements, and it’s designed to operate within both fully virtual and bare metal systems.

Openstack is often associated with Docker and Kubernetes to build a full SaaS platform
(see https://www.openshift.org and https://www.openshift.com).

  • For clients refusing to go for Public clouds : bank & insurance MS
  • To avoid vendor lock-in
  • For multi or hybrid cloud solutions

8. Couchbase

Logo CoucheBase

Couchbase is an open-source distributed NoSQL document-oriented database distributed under Apache license. It embraces a Memcached compatible protocol, but it also has built-in support for disk persistence, data replication, live cluster reconfiguration and much more.

Next to its Memcached capabilities, Couchbase includes RESTful APIs for data replication, cluster management and data querying, and a SQL like query language (N1QL) is included as well.

  • For large scale and distributed systems
  • Support for Publisher – Subscriber pattern
  • Best solution for no SQL data storage

Thanks to a Couchbase-compatible database called PouchDB (https://pouchdb.com), that lives in the browser, Couchbase clusters may be composed of client-side nodes, offering an offline first implementation pattern at low cost.

Couchbase can also be combined with Sync Gateway (https://www.couchbase.com/products/sync-gateway): a web based application that enables the publisher – subscriber pattern, allowing publishers to notify subscribers via events (using Webhooks or Websockets), in case of data change.

Couche Base

7. GraphQL

GraphQL logo

GraphQL is a consumer driven data query language developed internally by Facebook in 2012 before being publicly released in 2015. When combined with gRPC GraphQLprovides an alternative to REST and ad-hoc webservice architectures.

GraphQL allows clients to define the structure of the data required from the server (to avoid over and under fetching), resulting in optimized network traffic between client and server.

The recent AWS re:Invent 2017, announced GraphQL’s availability as a managed service, thanks to AWS AppSync (https://aws.amazon.com/fr/appsync/). This milestone could help GraphQL finally gain popularity over REST, which is still the standard API pattern for most Web developments.

  • For large scale systems, with micro-service architecture
  • When HTTP caching is not required
  • Keep an eye on restQL (http://restql.b2w.io)

6. Spring Webflux

React Native Logo

Webflux is a Spring module, recently introduced in version 5 of the framework. It has been created to add support for Reactive Programming in the Web layer, and to allow developers to migrate smoothly from standard Spring MVC to Webflux Web framework, leveraging similar annotations and principles.

Spring even allows developers to build Web applications in which both the MVC and the Webflux frameworks can coexist.

React Native visual

When combined with Reactive client applications (http://reactivex.io/rxjs/ for the Web, or https://mobx.js.org/ for mobile), Webflux enables systems to benefit from a fully reactive architecture, with backpressure and functional APIs.

  • For any Web application
  • Can live together with WebMVC
  • Webflux should be a driver for change

Since Spring Boot 2.0, Webflux is fully supported, as reactive web programming framework.

5. Web Workers

React Native Logo

As defined by W3C, Web Workers are JavaScript scripts that are executed from an HTML page, running in the background, independently from any other UI scripts, that could have been executed from the same HTML page.

When Web Workers are being executed, they don’t have access to the DOM, and they can only communicate to the original document via message passing.

Such scripts allow multi-threading for JavaScript programs. Actually, Web Workers enable browsers to benefit from a multi-core CPU when processing JavaScript.

React Native visual

Web Workers are not very new in the Web world, but they are often misused, or even sometimes not used at all. Developers should really put the focus on designing services via Web Workers, since this pattern decouples the business logic from the presentation layer (DOM), by design.

  • For any JS application
  • Decouple JS processing from main UI thread
  • Enforce clear design in JS services

4. React

React Native Logo

Deployed for the first time in 2011, React is a JavaScript library open sourced in March 2013 under the MIT license. It’s maintained by Facebook, Instagram and a community of individual developers and corporations.

React is mainly used to build user interfaces, but it can also be used on the server side for any node.js application, or more generally, for any JavaScript application, since it’s not bound to the Web. This is one of the main characteristics thatboost React over other JavaScript frameworks, such as Angular (https://angular.io/) or Vue (https://vuejs.org).

  • React for the Web
  • React for mobile
  • React for loT
  • React for AR/VR

Since March 2015, React has been extended to enable cross platform mobile development for iOS and Android: the ReactNative framework (http://www.reactnative.com/). As similar principles are shared between React and ReactNative, using both frameworks to build your Website and your mobile application enables knowledge sharing and flexibility in your development teams.

Finally, developer’s adoption and satisfaction rates are above concurrent frameworks, as depicted in the following figure 1:

React visual

https://stateofjs.com/2017/front-end/results/

Last year, React has become the dominant choice of front-end development. It is currently the 4th most starred repository on GitHub, making it the most popular JavaScript framework repository of all time.

1 https://medium.com/front-end-hacking/the-results-of-the-survey-on-the-use-of-javascript-technologies-the-state-of-javascript-2017-a9aa0732a6b5

3. ECMAScript

ECMAScript logo

ECMAScript (or ES) is a scripting-language specification standardized by ECMA International (https://www.ecma-international.org). It was created to standardize JavaScript, to foster multiple independent implementations. JavaScript has remained the best-known implementation of ES since the standard was first published.

Coders commonly use ES for client-side scripting on the World Wide Web, and it is increasingly being used for writing server applications and services using Node.js.

The following figure 2 shows that ES (versions 5 and 6) is still the most popular client-side language, far ahead of TypeScript (https://www.typescriptlang.org) or Flow (https://flow.org):

The latest versions of ES have closed − or at least dramatically reduced −the gap with most popular client frameworks. ES now supports many fancy features that a modern language must have.

So, before adding a dependency to a third-party library in your JS application, ask yourself: “”oh wait, is it supported in ES?”.

  • For/of loops
  • Arrow function
  • Typed arrays
  • Collections
  • Promises
  • Multi-threading
  • Reflexion
  • await/async
  • Observables
  • Value types
  • Traits
  • DOM selectors

2. Kotlin

Kotlin logo

Announced for the first time in 2011 by JetBrains, Kotlin was first publicly available in an official and stable release in 2016. Kotlin is a statically-typed programming language that runs on the Java virtual machine it can also be compiled to JavaScript source code and it can use the LLVM compiler infrastructure. Kotlin uses aggressive type inference to determine the type of values and expressions for which type has been left unstated. This reduces language verbosity relative to Java, which often demands entirely redundant type specifications.

As of Spring Boot 2.0, developers now have the choice of using Kotlin as default programming language when building new Spring applications. Such support is key to making Kotlin a success with developers.

Another main success factor for Kotlin is that you can combine pieces of Java 8 code with Kotlin which should make its adoption easier, and the transition from Java app rather smooth.

  • For native Android applications
  • For any JVM based applications
  • Can live together with Java, which makes adoption much easier and lower-risk

With regard to mobile: as of Android Studio 3.0, Kotlin is a fully supported programming language on Android and letting the user choose between targeting Java 6- or Java 8-compatible bytecode. In their Q4 2017 report 3 , the Realm (https://realm.io) mobile platform predicts that Kotlin applications will overtake Java applications by December 2018.

1. Progressive Web Applications

The term Progressive Web Applications, (PWA), was first introduced by Alex Russel, a Google Chrome engineer, in 2015. PWA is a strategy, a concept, or philosophy, used to develop web applications taking advantage of new features supported by modern browsers, such as service workers, web app manifests or device capability integrations (camera, handling gestures, access to contacts…).

One of the main characteristics of PWA design is to enable users to install web site on their native operating systems, allowing offline browsing by caching web assets in the background.

Recently, many major companies such as Twitter (https://mobile.twitter.com, using https://github.com/necolas/react-native-web), Forbes or Alibaba… have applied their PWA guidelines to their mobile applications.

PWA gathers together the best of the Web world, plus the best of native applications.

Web app

Compared to native applications, PWA also improves the customer retention rate. Indeed, with native apps, you first have to go to the store, search for the app, download it, and only then can you use it.

According to Gabor Cselle, each step that stand between the customers and the app costs 20% of users4 . PWA reduces those steps, as depicted in the following figure:

React visual

As a result, PWA offers a better customer retention rate: 60% for PWA, versus 20% for native apps.

4 http://blog.gaborcselle.com/2012/10/every-step-costs-you-20-of-users.html

Conclusion

In this white paper, I have cover most of the interesting Web framework for the year to come. In fact, it’s necessary to choose appropriate frameworks for your business, as it’ll drive the quality of your applications. Moreover, investing in the best suitable framework at a given point in time could help to save time and money when building your apps.

If you still have questions regarding those frameworks, don’t hesitate to drop me a mail at francois.gengler@spikseed.com, or message me on Twitter (@genglefr) or Github (https://github.com/genglefr).


Software development Business intelligence Infrastructure Digital trust Mobile developent