JavaScript trends that you should pay attention to in 2017

I decided to write this material after I saw Dan Abramov’s tweet, for which I want to thank him so much. Dan asked his subscribers a question about the most interesting events in the world of JavaScript that are worthy of the attention of the general public.


JS lovers responded to the question, under a tweet a whole mountain of answers gathered. Everyone talked about what, in his opinion, is worth paying attention to in 2017. The result was a very entertaining selection, from which I chose the best and added explanations.

Immediately I would like to say this. Judging by the fact that functional programming tools are visible in my material, which is called the naked eye, the time when AF was the destiny of the few running after a changeable mode has passed. Now it looks quite a serious trend.

Here are the technologies noted by the JavaScript community as the most promising. I ranked them in descending order of popularity.

Webassembly

Oh, why start explaining the features of WebAssembly technology? Its abbreviated name, “wasm,” looks almost like “asm,” and this is a hint that we are faced with something of a lower level. In fact - the way it is. This technology is aimed at simplifying development in any language (rejoice, lovers of functional and reactive programming!) And compiling code for the web.

WebAssembly technology has appealed to many. The fact is that a lot of developers are still in a very mixed relationship with JS, giving unconditional preference to other languages, the code written in which can be converted to JavaScript. Below - a lot of evidence of this idea.

In any case, JS moves forward by leaps and bounds, and no one expects this to end soon.

WebAssembly - the development is relatively young. Now it is in the phase of the trial version, the release is still far away. Thus, I am sure that its development is worth observing, since it can very seriously affect the future of JS.

Details on WebAssembly can be found in the material Eric Elliott.

Elm

Many developers literally fell in love with Elm in 2016. This is a functional programming language accessible to all comers.

Here are excerpts from Introduction to Elm that reveal the main features of the language:

• There are no runtime errors, null, messages in the spirit of “undefined is not a function”.
• Convenient error messages that help you expand your program faster.
• Well-designed code that stays that way as the application grows.
• Automatic semantic version control for all Elm packages.

Elm are great tools combined with clean, simple, and compact code.
Of course, Elm is compiled into JS, which attracted the attention of JavaScript developers.

Vue.js

Last year, it was really interesting to watch Vue.js. grow in popularity. This library will undoubtedly be a prominent player in 2017.

By the way, thanks to Evan Yu, the fearless creator of Vue.js and the community leader, I was inspired last year by Open Source ideas.

Vue is a competitor to React, so it’s quite natural that in 2017 we will have endless debates about which is better: React, Vue, or Elm ( here people are already discussing this topic). In the end, it will decide which community will offer the best support for large projects. I believe Evan Yu knows what to do.

Vue 2.0 has recently been released, it has become faster and smaller, which makes this library even more attractive.

By the way, here are a couple of answers to the question of whysome companies have switched to Vue.

Babili (babel-minify)

Babili was released in August 2016. This is a mini-qualifier that can work with ES6 +, based on the Babel infrastructure.

Why another minifier?

Here's a great story by Henry Zhu about the reasons for Babili. I believe it is important to pay attention to the following part: “Babili can accept ES2015 + designs as inputs, while existing minifiers are usually limited to ES5. They require that the code be transcompiled into their supported language version before minification. This becomes useless when you consider that programmers are already creating work projects on ES2015. Babili, moreover, is flexible and has a modular structure (in fact, it is a set of presetsBabel, which means plug-in support), it can be used as a preset or as a command line tool. In addition, Babili will be able to perform code optimizations specific to ES2015 +. ”

OCaml

OCaml itself is not particularly associated with JS, but in order to realize the importance of the following two trends on our list, you will need to know what OCaml is.

If you are witnessing a resurgence in functional programming over the past few years, you might have heard of Haskell. OCaml is quickly becoming more popular than Haskell, mainly due to the fact that there are several excellent compilers from OCaml to JS.
Facebook developers, for example, are big fans of OCaml, as it helped them create Hack , Flow, and Infer .

BuckleScript

BuckleScript is a compiler for OCaml created by the Bloomberg development team (yes, this is the same Bloomberg). Here is what Dwayne Johnson says about this : “ BuckleScript , or, for short, bsc, is a relatively new JavaScript compiler for OCaml. In other words, you can use the functional, typed OCaml language to compile code on it in JavaScript. What is remarkable here is that the code produced by BuckleScript is quite readable (that is, if you are familiar with JS, you can understand this code, it will be easier to debug it), and also that BuckleScript is connected with the npm ecosystem. As a result, you get the best of two worlds: a powerful, functional, typed language, coupled with wonderful modern libraries for web development. ”

ReasonML

Reason is an OCaml-based language with incredibly friendly syntax, deep editor integration and great build tools. It was created by the same Facebook team that had a hand in React.

Here's a great short story by Sean Grove about Reason.

Purescript

Obviously, you have already guessed that PureScript is another strongly typed efficient programming language that compiles in JavaScript.

It is especially popular with Haskell lovers. You can consider him a competitor to Elm. Here is what PureScript offers us:

• Lack of a heavy code execution environment.
• Applying a strict (rather than lazy) computing strategy similar to that used in JavaScript.
• Support for a literal way to describe JavaScript objects
• A type system, which is perhaps more powerful and convenient than in Haskell.
• Extremely simple interface of external functions, which facilitates interaction with JS-libraries.

TypeScript

TypeScript is a JavaScript add-in that aims to improve the quality and comprehensibility of the code. In addition, TypeScript facilitates the development process by indicating errors right in the process of entering program text. And by the way, the Atom editor supports TypeScript.


Here is Anders Halesberg ’s detailed story about TypeScript.

Webpack-blocks

This is a good way to configure Webpack. Perhaps the main argument in his favor was made by Dan Abramov: “Obviously, Webpack is not going to become a high-level tool. Therefore, its configuration makes sense to give external means. The settings should be presented in the form of well-designed blocks, and not in the form of copying and pasting fragments of texts with parameters. ”

If you use Webpack, you have a good chance of finding a useful use of webpack-blocks .

GraphQL

It seems that GraphQL will replace REST, especially in companies that have to process huge amounts of data. Here is an example to help you understand why this is so. The main idea: GraphQL is effective to the limit. I believe that we will continue to observe the growth of GraphQL in 2017. And we’ll talk about whether it will replace REST in a year.

React storybook

This is the user interface development environment for React / React Native. With its help, you can visualize the various states of the interface components and work on them interactively.

Take a look at this picture and you will immediately understand what is the matter.



React Storybook can be found here .

jQuery 3.0

JQuery's great-grandfather is still with us! The development team released a more compact and faster version in June 2016, but many, keen on something like mastering React, probably did not hear about it.

Pixi.js

If you are developing fantastically beautiful 2D interfaces or games using WebGL, Pixi.js will be a real find for you. Take a look at the gallery of projects made using this library. Even if you are not planning to create anything serious, take a look at it right now.

Preact

Preact.js is a fast alternative to React, just 3 KB in size with the same ES6 API.

Inferno

Inferno is an alternative to Preact. This is a fast library, similar to React, occupying only 8 KB, designed to create high-performance user interfaces both on the client side and on the server. It provides the developer with more built-in additional features than Preact.

Rust

Rust is another fast language that, using emscripten, compiles into JavaScript. Perhaps such a variety of languages ​​clearly indicates how many developers no longer want to write in JS.

Custom Elements v1

Custom Elements technology (along with the Shadow DOM) experienced problems with adaptation (mainly due to the complexity of the perception of its concepts), but it may well continue to develop in 2017.

The main area of ​​improvement will be browser support, which, as you can see here , is growing. I think this is a great way to give more opportunities to developers, while at the same time reducing the amount of code.

Here are materials from Smashing Magazine and Google to help you figure out how to use Custom Elements.

WebRTC

It's hard to believe that WebRTC is already five years old. Facebook, Slack, Snapchat and WhatsApp use it on their systems. The popularity of WebRTC is inevitable, more and more companies that offer users audio and video communications will use it.

Let's hope that the innovations on the part of the WebRTC project team will bring only improvements to it.

Next.js

Next.js is a small framework built on top of React, Webpack and Babel. It simplifies the creation and deployment of React applications that are built on the server side.

The ZEIT development team that is involved in this project is very active in the React community. I believe that Next.js should at least pay attention.

Summary

As you can see, an impressive list of JS projects has already been selected that are worth watching in 2017. I believe this year will bring us something completely new. In any case, it will be interesting.

After this material saw the light, readers suggested several important technologies that allowed it to expand. Maybe you can tell me something?