It has 2,127 words and takes four minutes to read. I read an interesting article this week called “The 10X Developer Is NOT a Myth”. No matter whether you admit it or NOT, and whether you realize it or NOT, The efficiency of a programmer sometimes varies greatly. The concept of a 10X programmer has been around for a long time. What’s the difference with ordinary programmers? I recommend you to take some time to read it carefully. If you don’t want to read Chinese, you can read my book “The Three Realms of Engineer”. Enjoy this week’s selection below.

Technology of dynamic

Are the reasons for using Node.js still valid?

The vibrancy of the tech community can be seen in the frequency with which various quarrels occur. This article begins by acknowledging that Node.js is very popular and growing in popularity, but the author argues that the reasons listed in earlier years for using Node.js are untenable because other technologies are advancing. They are better than Node.js in every way, what do you think?

Load the ES6 module and log in to Chrome Canary 60

Those of you who don’t know about the ES6 module should check out Ponyfoo or Jake. Chrome Canary V60 already supports the ES6 module, but you need to manually turn on the support. This article is a taste of the new feature, and offers practical advice on how to start using it in your project and how to do the proper fallback.

The article tutorial

Make stateless React Component render 45% faster

Stateless React Component the concept of a stateless React Component is a Component that does nothing but render with no state changes. The authors of this article give tips on how to speed up the rendering of such components: Think of them as functions, not as components. If you doubt it, see how it works first and then do your own experiments.

The migration path from Angular.js to vue.js

Your old system was developed with Angular 1.x, and now you don’t want to use Angular 2.x or 4.x, which change too quickly? See how the author of this article migrated from Angular 1.x to vue.js.

Learn how to React Native

Properly designed interactive animations can surprise and immerse users in your app. A typical example is Slack’s official app. Here, the author explains how to anatomize an animation (transparency, position, size, color) so you can understand the potential of React Native animation. It also shares tips on how to design animations that work across the React Native app.

Use VSCode to configure React

In line with the ultimate configuration for Atom front-end development, this article explains how to configure ESLint, Prettier, and Flow in VSCode for React development.

Use Atom as the ultimate configuration for JS/React development

Although many of you have now moved on to Visual Studio Code, which I recommend, this article is a valuable reference for those of you who are already familiar with Atom as a development tool. What does it take to fully master a code editor? Just use him as a notepad, okay? That’s not the case at all. It takes time to hone and practice. The author of this article has spent months tuning Atom’s configuration, plugins, and keyboard shortcuts to the best of their ability. It may not be perfect for you, but his ideas are certainly worth learning.

The development tools

Vim Awesome: A great site for Vim plug-ins

This is not a typical list of Awesome, but a separate site that lists all the Vim plugins in a different category. On the front page, you can see the most popular Vim plugins.

Keycastr: compact key visualization tool

Keycastr is a Mac tool that visualizes keystrokes and displays errors when it launches. Keycastr is a Mac tool that visualizes keystrokes and displays errors when it launches. Keycastr is a Mac tool that visualizes keystrokes. You need to give him Accessibility/Privacy access as an administrator.

The code framework

Execa: A better Node.js child_process

Created by Sindre Sorhus, who has posted 1000+ packages on NPM, this is much easier to use than the built-in Child_process in Node.js. The main advantages are: Promising, automatic processing of subcommand output endings, output buffers 500 times larger than the built-in Buffer, better Windows support, automatic cleaning of child processes when the parent process exits, etc., all of these can be considered by those who use Node.js frequently to write scripts.

BriteCharts: a graphing library based on D3.js

BriteCharts is a chart drawing library based on D3.js V4 version. Students who have studied D3 may think that D3 is the DOM in the field of drawing. You can use it directly, but the cost of drawing is relatively higher. Libraries like BriteChart help you encapsulate common diagrams and render them in a very intuitive way. The entire repository is written in ES6 and the test coverage is very good, so the source code itself is a great learning resource. Those looking for other d3.js chart libraries should search c3.js and nvd3.js.

Video tutorial

Modern front-end workflow based on Chrome Dev Tools

Umar Hansa’s Render Conf 2017 post on modern front-end workflows for Chrome Dev Tools is a must-see if you want to get to the bottom of Chrome Dev Tools. The content covers 15 topics including FPS Meter, Paint Profiler, Timeline Recorder, Source Code Profiling and so on.

Egghead. IO: Use Webpack in production

Webpack is easily the most popular JS app packaging tool in the front-end community, because there are so many features built in, and its learning curve is so steep that it takes a lot of work to get it up and running, let alone do so much more with it, In this video series, Kent C. Dodds will use examples to help you understand the most common Webpack features and how to optimize Webpack configuration to make it run faster.

Good question and answer

How do I get Git to use my favorite editor?

If you do not specify a commit message, Git will open VI for you to fill in. How do I replace my commit message editor with Vim, Atom, VSCode, which I prefer? Change the global configuration on the line, there are two solutions in the high vote answer, to look carefully.

How to log when developing React Native?

Logging is probably the oldest and most effective method of debugging when it matters most. React Native has a lot of logging methods. Which ones work better? Check out this q&A.

Do you have hot updates enabled for React Native applications?

Some of you may have encountered that Live Reload and Hot Module Reloading options are not included in the debugging options of React Native application on the real computer, which will greatly affect the efficiency of development and debugging. The main cause of the problem lies in the network. But the solution is more than three steps.

One More Thing

The author of this article is Wang Shijun. For commercial reprint, please contact the author for authorization. For non-commercial reprint, please indicate the source. If you found this article helpful, please give it a thumbs up! If you have any questions about the content of this article, please leave a comment. Want to know what I’ll write next? Please subscribe to my nuggets column or Zhihu column: Front End Weekly: Keeping you Up to date on the Front End.

Happy Hacking