This close reading article is about the JS performance changes brought about by V8 engine features

1 the introduction

Refresh your view of JS regularly to prevent experience from becoming a pit. (The three views for Internet Explorer and other browsers should remain the same)

2 Content Summary

The impact of try catch on performance is ignored

Try catch is very useful, especially on the Node side. Front-end frameworks are also increasingly using exception catching, combined with async await to organize code more elegantly, as detailed in my blog uniform exception catching. React Mixins also likes the render try method, including version 16 that automatically tries all render and makes try catches ubiquitous.

After Node 8, the performance loss of internal try functions is negligible.

However, the current version still has security issues. Copy this code to the Chrome console and the current page will go into an infinite loop.

This example does a lot of looping around the try catch block, which is officially stuck in an infinite optimization loop under certain code combinations.

Resolve delete performance issues

Js is getting simpler, and there is no longer any hesitation to write undefined for delete, reducing code readability at the expense of performance.

Arguments to array performance is no longer a problem

On Node8.3 and above, the use of extended operators to retrieve parameters has no performance problems and greatly improved readability, as well as type support when combined with TS.

Bind has a negligible impact on performance

However, there are still side effects to watch out for in React. Since UI component reuse is extremely limited in most scenarios, it is highly recommended to use arrow functions to write member functions (more on the confusion caused by This in my other in-depth article), and the arrow functions perform best on Node8.

Function calls have less and less impact on performance

Function calls are getting better and better, and you don’t need to worry too much about comments and whitespace, or the impact of inter-function calls on performance.

32 64-bit digital computing performance

Node8 still performs poorly for very long numbers, about 2/3 as well as 32-bit numbers, so try to handle large numbers with strings.

Traverse object

For in object.keys object.values. On Node8, for in will be slower, but still faster than the other two methods, so eliminate unnecessary optimizations as early as possible.

Create an object

The speed of object creation is greatly improved on Node8, which seems to be a boon for object-oriented programming.

The performance problem of polymorphic functions

When functions or objects have multiple type parameters, performance is not optimized in Node8, but performance of singleton functions is significantly improved. So it’s useful to try to keep properties singly inside objects, such as trying not to push a number on a string array.

3 intensive reading

Try catch problem

Prior to v8 optimization, front-end try catches had significant performance issues, resulting in many older projects rarely using exceptions, and experienced programmers would avoid try catches by wrapping code logic in functions where they must be used. Try functions instead of code blocks to reduce the performance penalty.

Now is the time to overturn these lessons, and proper exception handling can also improve the user experience.

The most error-prone logic of front-end code lies in the processing of back-end data. Once the back-end data fails, the whole front-end data processing link will inevitably report errors or throw exceptions. This scenario is best suited to try the exception, display the prompt text, and avoid too much compatibility with the data format within the code.

Impact of number of statements on performance

Since the number of statements has no impact on performance, the old approach can be said goodbye:

Var I = 1; var j = "hello"; Var arr = [1, 2, 3]; var now = new Date(); Var I = 1, j = "hello", arr = [1,2,3], now = new Date();Copy the code

4 summarizes

This wave of V8 optimization has brought some changes in JS performance, but it has only solved a small part of the problem in JS performance optimization, and JS front-end performance optimization is only the tip of the iceberg, DOM and style optimization is also very important to performance, we should still pay attention to code quality, improve code performance.

The discussion address is:
Close reading of JS Performance Changes caused by V8 engine features · Issue #33 · DT-fe /weekly


If you’d like to participate in the discussion, please
Click here to, with a new theme every week, released every Friday.