Here are some tips for optimizing client JS performance:
1. Regarding JS loops, loops are a commonly used process control. JS provides three types of loops: for(;;), while(), and for(in). Among these three loops, for(in) has the worst efficiency because it requires querying the Hash key. Therefore, the for(in) loop should be used as little as possible, and the performance of the for(;;) and while() loops are basically the same. Of course, it is recommended to use a for loop. If the loop variable is incremented or decremented, do not assign values to the loop variables alone, but should use nested ++ or -- operators.
2. If you need to traverse the array, you should first cache the array length var len=; for(i=0;i<len;i++), put the array length into a local variable, and avoid querying the array length multiple times.
3. The access speed of local variables is faster than that of global variables, because global variables are actually members of window objects, while local variables are placed in the function stack.
4. Try to use eval as little as possible. Each time you use eval, you need to consume a lot of time, especially in the loop, json[i][variable]=1; such statements can not use eval.
5. Try to avoid nested queries of objects. For the obj1.obj2.obj3.obj4 statement, at least 3 query operations are required. First check whether obj2 is included in obj1, then check whether obj3 is included in obj2, and then check whether obj3 is included in obj3... This is not a good strategy. We should try to use local variables and save obj4 as local variables to avoid nested queries.
6. When making operators, try to use operator symbols such as +=, -=, *=, and \= instead of directly performing assignment operations.
7. When it is necessary to convert numbers into characters, use the following method: "" + 1. From a performance perspective, when converting numbers into characters, there is the following formula: ("" +) > String() > .toString() > new String(). String() is an internal function, so it is very fast. .toString() needs to query functions in the prototype, so the speed is lower. New String() needs to recreate a string object, which is the slowest.
8. When you need to convert floating point numbers into integers, you should use () or (). Instead of using parseInt(), this method is used to convert strings to numbers. Moreover, Math is an internal object, so () actually does not have much query method and call time, so the speed is the fastest.
9. Try to use the JSON format to create objects, rather than the var obj=new Object() method. Because the former is a direct copy, while the latter requires the constructor to be called, the former has better performance.
10. When you need to use arrays, try to use JSON format syntax, that is, directly use the following syntax to define the array: [parrm,param,param...], instead of using the syntax of new Array(parrm,param,param...). Because the syntax using JSON format is directly interpreted by the engine. The latter requires calling Array's constructor.
11. Use regular expressions when performing loop operations on strings, such as replacing and searching. Because JS's loop speed is relatively slow, the operation of regular expressions is an API written in C, which has better performance.
Finally, there is a basic principle. For large JS objects, because the time and space overhead are relatively large when creating, caching should be considered.
1. Regarding JS loops, loops are a commonly used process control. JS provides three types of loops: for(;;), while(), and for(in). Among these three loops, for(in) has the worst efficiency because it requires querying the Hash key. Therefore, the for(in) loop should be used as little as possible, and the performance of the for(;;) and while() loops are basically the same. Of course, it is recommended to use a for loop. If the loop variable is incremented or decremented, do not assign values to the loop variables alone, but should use nested ++ or -- operators.
2. If you need to traverse the array, you should first cache the array length var len=; for(i=0;i<len;i++), put the array length into a local variable, and avoid querying the array length multiple times.
3. The access speed of local variables is faster than that of global variables, because global variables are actually members of window objects, while local variables are placed in the function stack.
4. Try to use eval as little as possible. Each time you use eval, you need to consume a lot of time, especially in the loop, json[i][variable]=1; such statements can not use eval.
5. Try to avoid nested queries of objects. For the obj1.obj2.obj3.obj4 statement, at least 3 query operations are required. First check whether obj2 is included in obj1, then check whether obj3 is included in obj2, and then check whether obj3 is included in obj3... This is not a good strategy. We should try to use local variables and save obj4 as local variables to avoid nested queries.
6. When making operators, try to use operator symbols such as +=, -=, *=, and \= instead of directly performing assignment operations.
7. When it is necessary to convert numbers into characters, use the following method: "" + 1. From a performance perspective, when converting numbers into characters, there is the following formula: ("" +) > String() > .toString() > new String(). String() is an internal function, so it is very fast. .toString() needs to query functions in the prototype, so the speed is lower. New String() needs to recreate a string object, which is the slowest.
8. When you need to convert floating point numbers into integers, you should use () or (). Instead of using parseInt(), this method is used to convert strings to numbers. Moreover, Math is an internal object, so () actually does not have much query method and call time, so the speed is the fastest.
9. Try to use the JSON format to create objects, rather than the var obj=new Object() method. Because the former is a direct copy, while the latter requires the constructor to be called, the former has better performance.
10. When you need to use arrays, try to use JSON format syntax, that is, directly use the following syntax to define the array: [parrm,param,param...], instead of using the syntax of new Array(parrm,param,param...). Because the syntax using JSON format is directly interpreted by the engine. The latter requires calling Array's constructor.
11. Use regular expressions when performing loop operations on strings, such as replacing and searching. Because JS's loop speed is relatively slow, the operation of regular expressions is an API written in C, which has better performance.
Finally, there is a basic principle. For large JS objects, because the time and space overhead are relatively large when creating, caching should be considered.