Performance 主进程这两段渲染流程怎么理解？如何理解 Performance 主进程这两段渲染流程？Evalu

示例代码如下

<html>
<head>
    <title>Main</title>
    <style>
        .wrap,.wrap2 {
            border: 2px solid pink;
            width: 100px;
            height: 100px;
        }
        .box,.box2 {
            background-color: rgba(106, 24, 238, 0.26);
            height: 5em;
            margin: 1em;
            width: 5em;
        }
    </style>


</head>
<body>
    <div class="wrap">
        <div class="box"></div>
    </div>
    <br>
    <script>
      function addNode() {
          let el = document.createElement('div')
          el.setAttribute('class', 'wrap2')
          el.innerHTML = '<div class="box2"></div>'
          document.body.append(el)
      }
      addNode()   
    </script>
</body>
</html>

问题1：这里的 Evaluate Script 下面有个 Compile Script 和 Compile Code，但是后面又出现了一个Compile Code。 Evaluate Script、Compile Script 和 Compile Code 各自对应v8执行的哪个阶段呢？为什么 Compile Code 会出现两次？

问题2：如上示例代码，函数只调用了一次，为什么主进程会显示两次？

有没有大佬指点迷津