Shulou(Shulou.com)06/02 Report--

Today, I would like to talk to you about several WEB technologies that are worth paying attention to. Many people may not know much about them. In order to make you understand better, the editor has summarized the following contents for you. I hope you can get something from this article.

HTTP2 borrows a lot of features from google's SPDY, focusing on improving the performance of the previous HTTP protocol in the current network environment. Simply put, HTTP2 is faster. Why, there are several major changes:

First of all, HTTP requests from the same domain can share the same TCP connection, which can largely solve the performance problems caused by network latency. For example, if you have a lot of pictures, you don't have to spriteize them now, because they will use the same connection anyway. With the advent of HTTP2, many of the previous web front-end optimization techniques may no longer be needed.

HTTP2 is no longer plain text, but a binary protocol, so that the parsing of the protocol is simpler and the transmission is faster. The disadvantage is that it takes some effort to debug.

HTTP2 also has some other features, such as header compression, you can come here to focus on learning. Or look at this FAQ.

Firefox has begun to support HTTP2, and many browsers, including chrome, have supported SPDY before, and it is estimated that support for HTTP2 will start soon, while nginx already supports SPDY, depending on when major web servers start to support HTTP2.

A bad situation is that developers may have to face the co-existence of HTTP2 and HTTP 1.1. If you enjoy the benefits of HTTP2 while being backward compatible with HTTP1.1, it may be a long-term problem for developers in the future.

ECMAScript6

The standard behind the javascript we use now (note that it is the javascript language itself, not including DOM, etc.) is ECMA-262, also known as ECMAScript 5. Its next version, ECMAScript 6 (es6 for short), is basically nearing finalization. This version adds a lot of features needed in the development process, such as:

Class definition syntax, including super, inheritance

Lambda-style function definition, = > lexical scope's this, default parameters, rest parameters in the block level function definition, etc.

Destructuring, similar to [a, b, c] = [1, 2, 3] in ruby, also applies to map and set, as well as function parameters

Symbol

Iterator iterator and generator, as well as the new for of loop syntax

Template string, from which you can use multiline strings as in ruby and shell

Module syntax, which supports modules at the language level

In addition, there are a series of new things such as promise,proxy,unicode support.

At present, chrome and firefox have gradually begun to support es6. However, you don't have to wait until all browsers start to support es6, because there are many tools to compile es6 code into es5 code, such as babel and traceur. Many js libraries have begun to use the various features of es6, including angular 2.0.

Many people should use many functions of coffeescript,es6 to make up for the shortcomings of the previous es5 and absorb a lot of the functions of coffeescript. Maybe we can use coffeescript in the future, unless you don't like curly braces and braces, but like the syntax of python. However, if coffeescript is not upgraded, it is estimated that it will not be able to enjoy the benefits of es6 in the future, and it will be difficult to meet the needs of various numerical calculations in the HTML5 era.

* to give you a relatively good es6 learning resources, this book is very detailed, and now it is still free online.

React is no stranger to you, it is a front-end view framework of facebook open source, and it is mentioned here because of some technologies driven by the ideas behind it. Although React itself is only a view framework, the virtual dom behind it and the performance advantages it brings are attractive, and the concept of encapsulation similar to web component is also used. Here is a test to compare the performance of the js front-end framework, which is not very accurate, but it can be used as a reference.

React's virtual dom and its method of managing front-end control data can be easily combined with immutable data structures (immuatble js,remutable) and functional programming. Clojurescript's om framework is an example. Imagine that all states are immutable, and unified data storage (flux schema such as marty), each update of the data can easily only pass diff (event source schema), the whole data flow in the front end is one-way, not only become a model becomes simple, and because all the historical data has not been actually modified, so the implementation of undo and redo will also become very easy.

React implements UI programming in immediate mode through virtual dom, low-cost and fast UI refresh also brings people more inspiration, and the encapsulation of React is not limited to dom view. For example, the flipboard team encapsulates a layer of UI on canvas based on the React encapsulation style, which can achieve fine animation effects and ensure a consistent experience between the web version and the mobile version. Facebook's React team recently released a framework for native mobile development using js and React API at the React conference.

React may be just another web view framework, but I like the new ideas it brings to me that may make it easier for us to develop on the front end.

Nowadays, the real-time requirement of web is getting higher and higher, not only because the current technology can better support real-time, but also because of the driver of user experience. Real-time is not only reflected in the need for chat; our operations on mobile phones can be reflected in real time on web browsers. Even if we do not refresh the page, the page should be able to be updated in real time.

The front end has better technical support for real-time requirements due to the emergence of HTML5, such as new WebSocket, WebRTC,long polling and server push technologies. Async IO programming technology has long appeared in the back end, which can support a large number of long connections at the same time. But the progress of these technologies has never stopped. Here are a few of them.

Pushpin

Pushpin is a high-performance real-time web back-end technology recently opened up by fanout. Unlike other technologies, it is a proxy that does not provide an API programming framework itself, but combines with existing web API to turn them into API that supports a large number of persistent connections. From the design concept, it separates the function of maintaining a large number of persistent connections from the actual API business functions, so that the former function is realized in the form of proxy, so there is no requirement for the framework and language of the actual API. If you want to support more long connections, you can also scale out this proxy without necessarily changing the back-end API.

Sockjs

Sockjs, a simulation of websocket, uses native websocket on browsers that support websocket, while alternative technologies are available on older browsers. But it is not just a front-end js library, it also provides a back-end programming framework, currently supporting a lot of languages and frameworks.

Websocketd is an interesting thing. It can program any program that conforms to the interface to a websocket backend. You can even write API in shell.

Many web frameworks support asynchronous programming mode, so they can support a large number of concurrent long connections. There are also people like meteor who provide overall solutions, and there are a lot of recent firebase that you can find out for yourself if you are interested.

After reading the above, do you have any further understanding of several WEB technologies worth paying attention to? If you want to know more knowledge or related content, please follow the industry information channel, thank you for your support.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.