[Ali Cloud TXD Monthly] – Hot front-end technology bulletin, focusing on the new vision of the industry; The pace of front-end development has never stopped. In this past June, we have prepared for you the front end of the small cooker

Welcome to subscribe & contribute

Edit: Yin Zhi proofread: Zuo Qi

Learning column

Advanced VS Code features you may not know

Here is a list of 35 advanced features VS Code uses to improve development efficiency and experience, including usage and video demonstrations, and some tips that can be very helpful.

Those CSS transitions you used can be replaced

Traditional transitions are just sliding around, fading in and out. Time beckons, technology evolves, and it’s time to try out some new transitions. The author uses some features of CSS3 (clip-path, mask, filter, etc.) to achieve some advanced transition effects, only using native code can be as flexible as in PPT.

Native JS quickly implements drag and drop effects

Drag and drop is a very common interactive effect, most of the time we will rely on third-party controls to achieve, in fact, using native Javascript is also very convenient. The author uses very concise code to achieve the most basic drag-and-drop effect.

Web workers implement multithreaded computation

The JavaScript language uses a single-threaded model, which means that all tasks can only be done on one thread, one thing at a time. The function of Web Worker is to create a multithreaded environment for JavaScript, allowing the main thread to create Worker threads and assign some tasks to the latter. After reading this article you may have an answer on when to use Web workers;

Talk about the running mechanism of small program

Small program and ordinary web development is very different, which is to analyze from its technical architecture bottom. React developers will mock the complexity of creating new pages for small programs. Page must be composed of multiple files, the componentalization support is not perfect, every time you change the data in data you have to setData, there is no convenient watch like Vue to monitor, and DOM cannot be manipulated. Not so good for complex scenarios, previously no NPM support, no Sass, Less precompiled processing language support.

The news quickly burst

Node.js 10 years back, you are still your grandpa

Node.js was born in 2009 and is now 10 years old. In the past 10 years, its growth and maturity are obvious to all. It was noted for simplifying concurrent programming at the back end, popularized as a front-end assist development tool, condemned for asynchronous flow control and callback hell, and admired for NPM for mass-installing modules. The new book “The Greater Node.js” will take you to open the door to the world of Node.js and appreciate the bright stars of the big front-end field.

Five new ES10 features are currently available

In the March front End issue we mentioned that ES10 is just around the corner, and as of today, there are already some features available through tools like Babel.

PixiJS V5 release

Fast lightweight 2D engine library across devices. It allows you to take full advantage of hardware acceleration and create a variety of 2D effects without having to worry about WebGL’s in-depth knowledge. PixiJS has a lot of interesting demos, and you can try writing one yourself.

RoboMaster S1

Dji has released its first educational robot RoboMaster S1, which is designed to teach programmers how to start with a baby.

Tools recommended

grade.js

This JS library can extract two main colors from the image, and then generate a gradient background. It mainly reads the pixels of the picture through canvas, and then makes histogram statistics to get the main color values in the picture.

react-use

Essential React Hooks collection, libreact’s port.

theia

Theia is a very flexible Web IDE that can be easily customized through extensions and plug-ins. It also provides rich built-in extensions (files, editors, terminals, SCM…). If you’re building a Web IDE for your own enterprise, try scaling with Theia.

The meeting to review

GMTC Global Big Front-end Technology Conference

The GMTC Global Big Front-end Technology Conference was successfully held in Beijing from June 20 to June 21. The theme covers engineering, mobile development, quality, small program, architecture, management and other aspects of the front-end. It also summarizes the past of the front-end and looks into the future trend. Those of you who are interested can check out the highlights on the official website.

VueConf 2019

On June 8, 2019, developers from all over the world gathered in Shanghai to witness the successful reporting of VueConf 2019. Author Yuxi You was there and compiled a presentation material (including video) for you.