The function coriolization is used to simplify code and has the following applications

  • Event listeners
var addEvent = (function () {
  if (window.addEventListener) {
    return function(ele, type, fn) { ele.addEventListener(type, fn); }}else if (window.attachEvent) {
    return function (ele, type, fn) {
      ele.attachEvent("on" + type, fn)
    }
  }
})()
Copy the code
  • Anti – shake and function throttling
/ / image stabilization
function debounce(fn, delay) {
  var timer;
  return function () {
    var that = this;
    innerArgs = [].slice.call(arguments);
    clearTimeout(timer);
    timer = setTimeout(function () {
      fn.apply(that, innerArgs);
    },delay)
  }
}

/ / use
window.onscoll = debounce(function () {}, 1000)
Copy the code
  • The throttle
/ / throttling
function throtte (fn, delay) {
  var prevTime = +new Date(a);return function () {
    var curTime = +new Date(a);if (curTime - prevTime > delay) {
      fn.apply(this, argument); prevTime = curTime; }}}/ / use
window.throtteScoll = throtte(function () {}, 500);
Copy the code
  • Cache parameters (to avoid duplicate arguments)
var currying = function (fn, currentArgs) {
  return function () {
    let args = [].slice.call(arguments);
    // console.log(args)
    if (currentArgs) {
      args = args.concat(currentArgs);
    }
    // recursive call
    if (args.length < fn.length) {
      return currying(fn, args);
    } else {
      // console.log(args);
      return fn.apply(null, args); }}}const sum = function (a, b, c) {
  return a + b + c;
}
const fn = currying(sum);
console.log(fn(1) (2) (3))
Copy the code

– The garbage collection

Why is garbage collection needed

We know that when a function is encountered in the V8 engine’s line-by-line execution of JavaScript code, a function execution Context is created and added to the top of the call stack. The handleScope contains all the variables declared in the function. When the function completes execution, the corresponding execution context is popped from the top of the stack, the scope of the function is destroyed, and all variables contained in the function are released and automatically reclaimed. Imagine if the scope was destroyed in the process, the variable is not recycled, namely lasting memory, so will inevitably lead to memory, causing the memory leak cause program performance plummeted even collapse, so use after exists inside should be returned to the operating system to ensure the repeated use of memory.

Memory limits for the V8 engine

By default, the V8 engine can only use a maximum of about 1.4GB of memory on a 64-bit system and a maximum of about 0.7GB on a 32-bit system.

Why is there such a limitation? This goes back to the original design of the V8 engine, and was originally intended as a JavaScript execution environment on the browser side, where we rarely encountered scenarios that used a lot of memory, so there was no need to set the maximum memory too high. But this is only one aspect. There are two other main reasons:

  • JS single thread mechanism

Single-threaded means that the code must be executed sequentially and only one task can be handled at a time. This means that during garbage collection, the logic in the program must wait for the garbage collection to complete before it can continue. Garbage collection blocks the execution of the main process logic.

  • Garbage collection mechanism

Garbage collection itself is a very time-consuming operation, assuming the V8 heap memory is 1.5 G, then the V8 is needed to do a small recycling more than 50 ms, and make a non incremental recovery even need more than 1 s, see its time consuming, and in the 1 s, the browser has been in a state of waiting, will lose response to the user at the same time, If an animation is running, it will also cause the animation to stall and drop frames, which seriously affects the performance of the application. Therefore, if memory usage is too high, the garbage collection process will inevitably be slow, and the longer the main thread waits, the longer the browser will remain unresponsive

Based on these two points, the V8 engine takes a harsh approach to reduce the impact on application performance by directly limiting the size of the heap. After all, you don’t usually have to operate several gigabytes of memory on the browser side. However, on the Node side, the I/O operations involved can be more complex and varied than on the browser side, and therefore memory overflow is more likely. That’s ok, V8 provides configurable items that allow us to manually resize memory, but this needs to be configured at node initialization.

V8’s garbage collection strategy

V8’s garbage collection strategy is mainly based on generational garbage collection mechanism, which divides garbage collection of memory into different generations according to object lifetime, and then adopts different garbage collection algorithms for different generations.

How to avoid memory leaks

  • Create as few global variables as possible

  • Manual clear timer

  • Use less closures

  • Clear DOM references

  • Weak application

    By Xiao Wei FE Link: juejin.cn/post/684490… The copyright belongs to the author. Commercial reprint please contact the author for authorization, non-commercial reprint please indicate the source.