ES new features
- Symbol
- The values we create through Symbol are unique
- Objects can have both String and Symbol values as keys
- Symbol avoids the problem of duplicate object attribute names
- The main effect is to add unique attribute names to the object
- for… of
- As a unified way to traverse all data structures
- You can terminate the loop at any time with the break keyword
- The Iterable interface is implemented for… Of the premise
JS performance optimization
Memory management
- Introduction to Memory Management
- Memory: Composed of read and write units, representing a piece of operable space
- Management: the artificial manipulation, use and release of the body of a space
- Memory management: developers actively apply for space, use space, release space
- Management process: apply – use – release
// let obj = {} // use obj.name = 'uu' // release obj = null
Garbage collection and common GC algorithms
- Garbage in JavaScript
- Memory management is automatic in JavaScript
- Objects are garbage when they are no longer referenced
- Objects that cannot be accessed from the root are garbage
- Reachable objects in JavaScript
- Accessible objects are reachable objects (references, scope chains)
- The criterion of reachability is whether it can be found from the root
- Roots in JavaScript can be thought of as global variable objects
- GC definitions and functions
- GC is short for garbage collection mechanism
- The GC finds garbage in memory and frees and reclaims space
- What is the garbage in the GC
- Objects that are no longer needed in a program
- An object in a program that can no longer be accessed
- What is the GC algorithm
- GC is a mechanism where the garbage collector does the specific work
- The content of the work is to find the garbage release space, recycling space
- Algorithms are the rules that are followed when searching and collecting at work
- Common GC algorithms
- Reference counting
- Mark clear
- Tag to sort out
- Generational recycling
- Reference counting algorithm
- Core idea: Set the number of references to determine whether the current number of references is 0
- Reference counter
- Modify the reference number when the reference relationship changes
- Reclaim immediately if the reference number is 0
- advantages
- Recycle rubbish as soon as it is found
- Minimize program pauses
- disadvantages
- Unable to recycle applied objects
- Time consuming
- Mark clearing algorithm
- Core idea: mark and clear two stages to complete
- Walk through all the objects looking for the mark active object
- Iterate over all objects to remove unmarked objects
- Reclaim space
- disadvantages
- Space fragmentation cannot maximize the use of our space
- Principle of tag collation algorithm
- Tag cleanup can be seen as an enhancement to tag cleanup
- The operation of the tag phase is the same as that of tag clearing
- The cleanup phase starts with a cleanup, moving the object
V8 engine garbage collection
- V8 is a mainstream JavaScript execution engine
- V8 uses just-in-time compilation
- V8 memory limit
- V8 garbage collection strategy
- Adopt the idea of generational recycling
- Memory is divided into new generation, old generation
- Different algorithms are used for different objects
- A common GC algorithm in V8
- Generational recycling
- Space to copy
- Mark clear
- Tag to sort out
- Mark the incremental
- V8 Memory Allocation
- V8 memory space is split in two
- Little space to store the new generation object (32 m | 16 m)
- Cenozoic refers to objects that have a short life span
- New generation object recovery implementation
- The recycling process adopts replication algorithm + label finishing
- The new generation of memory is divided into two equal size Spaces
- The used space is divided into From and the free space is To
- Live objects are stored in the From space
- Copy the live object To To after the tag is collated
- The space exchanged between From and To is released
- Old generation objects are stored in the old generation area on the right
- 64-bit OPERATING system 1.4 GB, 32-bit operating system 700 MB
- An old generation object is an object that lives for a long time
- Old generation object collection
- It mainly adopts the algorithm of mark clearing, mark finishing and increment mark
- Garbage space is first collected using a tag sweep
- Spatial optimization was carried out by label finishing
- Incremental marking is used for efficiency optimization
- Contrast of old and new details
- New generation of regional garbage recycling use space for time
- Old-generation area garbage collection is not suitable for replication algorithms
The Performance tools
- Why use Performance
- The purpose of GC is to implement a good row loop in memory space
- The cornerstone of a virtuous cycle is rational use
- Monitor memory time by Performance
- Performance Procedure
- Open your browser and enter the destination url
- Go to the Developer tools panel and select Performance
- Enable the recording function and access the page
- Perform user action and stop recording after a certain period of time
- Analyze the memory information recorded on the page
- External manifestation of memory problems
- Pages load lazily or pause frequently
- The page continues to have poor performance
- Page performance deteriorates over time
- Several ways to monitor memory
- Browser task manager
- Timeline Records the Timeline diagram
- Heap snapshot looks for detached DOM
- Determine if there is frequent garbage collection
JS performance optimization
- How to accurately test JavaScript performance
-
Essentially, a large number of execution samples are collected for mathematical statistics and analysis
-
This is done using jsperf.com/ based on benchmark.js
-
JSBench
-