Do you know what the development trend of the big front-end will be in 2021 (detailed explanation)

The rapid development of front-end development brings new keywords to developers every year. What will be the keywords for front-end development in 2021? What will be the direction of development? Referring to the development of the big front-end in 2019, it is no surprise that the front-end will still focus on several aspects such as small programs, super APPs, cross-end development, front-end engineering and the application of new technologies (you can refer to the depth of big front-end technology trends in 2019 interpretation).

小program

In the development of small programs, this year is still a year of rapid development for small programs. All major mainstream apps have launched small program functions, and various front-end The team also has a dedicated mini program development team to adapt to faster mini program development needs. At the same time, many key functions in Apps have been replaced by mini programs. Some apps have even become Native mini program shells, and the upper layers should all be mini programs.

Before the emergence of WeChat mini programs, everyone was talking about Hybird and ReactNative, but in the end it was just a carnival on the technical level, and there was never the injection of business attributes. The emergence of mini programs not only tells the industry that Webview on current devices is not that bad, but also tells the industry how to enable capable merchants to conduct private domain operations on super APPs.

On the other hand, from a technical perspective, under the strict restrictions of the upper-layer DSL, super APP can define Web standards that meet its own demands, make up for the shortcomings of current Web standards, and finally cooperate with the client and combine offline , preloading, and customizing Webview can produce various cool technical models similar to NSR, allowing the Web to achieve the Native version experience at low cost on the end, without being a little awkward like Weex outside the end.

However, due to the need to rely on super APPs (WeChat, Alipay, Baidu, Meituan, Toutiao, etc.), due to differences in the specific plans adopted by each platform, the current implementation plans of mini programs are also different. Sometimes Multiple sets of code need to be developed.

Cross-end development

Cross-end development, the RN state is very mature, or there is not much development prospect, because it is still stuck in version 0.61, it seems Version 1.0 is still far away. Therefore, many teams have switched to Flutter this year, especially the Release of Flutter for Web, which has rekindled hope and made the Web front-end eager to try.

At the same time, Apple has also released a new UI system-SwiftUI. At the same time, SwiftUI for Web is already on the road in the open source community. Can SwiftUI for Android be far behind?

Cross-end development, Flutter will still develop rapidly, and there will be more developers. Flutter on JS, SwiftUI for Web&Android will also be open source and worth looking forward to. After all, there is still no perfect solution for cross-end Plan.

Front-end engineering

In front-end engineering, the most important basic quality for developers is to improve efficiency through tools, and front-end developers will continue to do this. Iterate and optimize.

We used to talk about Yoman and a series of construction tools such as CLI, but after the team grew, we always felt that something was missing. On the other hand, Java students have never heard of Spring Boot configuration engineers.

This year many teams are building complete front-end DevOps process tools, and these teams have also begun to collaborate and build, whether it is Web or small programs, from new projects, development, joint debugging (tiao), deployment , testing, publishing, operation and maintenance to monitoring statistics, there are complete tools to ensure and improve efficiency. In the future, front-end projects will become more and more standardized.

Looking forward to the development of the front-end in 2020, the front-end engineering system will definitely be more closed-loop. It is no longer as simple as a scaffolding, but will be combined with IDE to open up business attributes, from project initialization, to writing code, to CI, To grayscale and to release form a complete closed loop.

Serverless

The popularity of Serverless can almost be attributed to the front end. Because Serverless can perfectly support Node.js, Serverless helps front-end developers solve many problems in the process of using Node.js.

Most of the current front-end engineers have a professional background. Although they cannot be compared with authentic server-side development students, they can also write a lot of business logic at the server-side layer. Currently, many companies are building BFF layers to meet these demands, but they still cannot get rid of the obstacles of operation and maintenance and machine allocation.

With the gradual implementation of Serverless, the code at the BFF layer will get rid of complex problems such as operation and maintenance, machine allocation, etc. At the same time, there is a high probability that front-end students will write this part of the code, and server-side students will focus on the middle-end system. accomplish. From a business perspective, the trial and error costs of business will also be significantly reduced.

As Node.js becomes an essential skill for front-end developers, the continued popularity of cloud computing will make Serverless within reach. When more and more developers taste the benefits of R&D, Serverless will definitely change the front-end R&D model.

At the same time, students who use Serverless will definitely use TS. This also means that if you don’t write TS in 2020, you may really be out.

WebAssembly

WebAssembly is a new bytecode format, and currently all mainstream browsers support WebAssembly. Unlike JS, which requires interpretation and execution, WebAssembly bytecode is very similar to the underlying machine code and can be quickly loaded and run. Therefore, the performance is greatly improved compared to JS interpretation and execution.

In other words, WebAssembly is not a programming language, but a bytecode standard. It requires a high-level programming language to compile the bytecode and put it into the WebAssembly virtual machine to run. What browser manufacturers need to do It is to implement a virtual machine according to the WebAssembly specification.

With WebAssembly, any language can be run on the browser. From Coffee to TypeScript to Babel, these all need to be translated into js before they can be executed, while WebAssembly embeds a vm in the browser and executes it directly without the need for translation, so the execution efficiency is naturally much higher.

For example, AutoCAD software is an automatic computer-aided design software produced by the American Autodesk Co., Ltd. (Autodesk), which can be used for two-dimensional drawing and basic three-dimensional design. When using it, you don't need to know programming to automatically draw. Therefore, it is widely used in many fields such as civil construction, decoration, industrial drawing, engineering drawing, electronic industry, and clothing processing around the world.

AutoCAD is a software written with a large amount of C code and has experienced many technological changes, from desktop to mobile to web. Previously, there was a speech at InfoQ titled "AutoCAD & WebAssembly: Moving a 30 Year Code Base to the Web". Through WebAssembly, many old C codes can be run on the Web and execution efficiency is guaranteed.

WebAssembly’s core JavaScript engine V8 now includes Liftoff, a new WebAssembly baseline compiler. Liftoff's simple and fast code generator greatly speeds up the launch of WebAssembly applications. In 2019, many companies began to invest manpower in learning and transforming WebAssembly. I believe that WebAssembly will experience an explosive period in 2020.

5G

An unavoidable topic in 2019 is 5G. First of all, the substantial increase in 5G bandwidth has brought about a further increase in the complexity of the traditional Web, just like the change from the plain text hyperlink era of WAP to the 4G full-image video era during the change from 2G to 4G. 5G will be a huge change, but it will certainly not happen overnight. Because the corresponding supporting facilities also need to be gradually improved, such as hardware performance and browser processing speed.

Server-side rendering (SSR) is definitely a shortcut, focusing on front-end and back-end. 5G is a bridge. Putting rendering in the back-end is not as simple as isomorphism. It requires attention and optimization of rendering performance. WebAssembly may develop rapidly under this opportunity, because it can seamlessly connect multiple background languages, and the optimization of background rendering will also bring about changes in the front-end R&D model and technical architecture.

Secondly, the interconnection of everything brought by 5G will bring diversified application scenarios that are different from smartphones and ordinary PCs, such as VR, wearable devices, car systems, smart projection, smart interaction, etc. They will bring the Web into various vertical fields, which also means that there will be more open space on the front end. I believe that with the large-scale commercialization of 5G, a number of new Internet giants will be born.

Thank you everyone for reading, I hope you will benefit a lot

This article is reproduced from: https://xiangzhihong.blog.csdn.net/article/details/103233487

More related For knowledge, please visit PHP中文网! !

The above is the detailed content of Do you know what the development trend of the big front-end will be in 2021 (detailed explanation). For more information, please follow other related articles on the PHP Chinese website!