zorgick

DOM Performance

• How the browser renders the document
  • Receives the data (bytes) from the server.
  • Parses and converts into tokens (<, TagName, Attribute, AttributeValue, >).
  • Turns tokens into nodes.
  • Turns nodes into the DOM tree.
• Builds CSSOM tree from the css rules.

zorgick

// 通过 typeof 来查看每种数据类型的描述
// [undefined, null, true, '', 0, Symbol(), {}].map(it => typeof it)
// ["undefined", "object", "boolean", "string", "number", "symbol", "object"]


function clone(obj) {
  // 添加一个 WeakMap 来记录已经拷贝过的对象，如果当前对象已经被拷贝过，那么直接从 WeakMap 中取出，否则重新创建一个对象并加入 WeakMap 中
  //  ES6 推出的 WeakMap 对象，该对象是一组键/值对的集合，其中的键是弱引用的。其键必须是对象，而值可以是任意的
  let map = new WeakMap();
  function deep(data) {

zorgick

// A state machine that works from a description including explicit transitions,
// and can generate a transition map and a digraph

const STATES = Symbol("states");
const STARTING_STATE = Symbol("starting-state");
const TRANSITIONS = Symbol("transitions");
const RESERVED = [STARTING_STATE, TRANSITIONS];

const MACHINES_TO_CURRENT_STATE_NAMES = new WeakMap();
const MACHINES_TO_STARTING_STATES = new WeakMap();

zorgick

/**
 * Ultimate version solving circular dependency with weakMap
 * Problems:
 * 1. Symbols not covered
 *
 * @param {Object} sourceObj
 * @param {WeakMap} [hash=new WeakMap()]
 * @returns
 */
var deepCloneUltimate = (sourceObj, hash = new WeakMap()) => {

zorgick

const Ω = new Proxy(new WeakMap, {
  set (weakmap, reference, input) {
    const invocable = eval(reference);
    if (typeof invocable != 'function') return;
    weakmap.set(invocable,
      Array.isArray(input)
        ? invocable(...input)
        : invocable(input)
    );
  },