test: add example test for scheduler

example/App.js

@@ -1,5 +1,6 @@
 import { h, ref, reactive } from "../lib/mini-vue.esm.js";
-import PatchChildren from "./components/PatchChildren.js"
+import PatchChildren from "./components/PatchChildren.js";
+import NextTicker from "./components/NextTicker.js";
 // import HelloWorld from "./components/HelloWorld.js";
 // import { h, ref } from "../../lib/mini-vue.esm.js";
 
@@ -35,17 +36,15 @@ import PatchChildren from "./components/PatchChildren.js"
 //   },
 // };
 
-
-
-
 export default {
   name: "App",
   setup() {},
 
   render() {
     return h("div", { tId: 1 }, [
       h("p", {}, "主页"),
-      h(PatchChildren),
+      // h(PatchChildren),
+      h(NextTicker),
     ]);
   },
 };

example/components/NextTicker.js

@@ -0,0 +1,40 @@
+// 测试 nextTick 逻辑
+import { h, ref } from "../../lib/mini-vue.esm.js";
+
+// 如果 for 循环改变 count 的值 100 次的话
+// 会同时触发 100 次的 update 页面逻辑
+// 这里可以把 update 页面的逻辑放到微任务中执行
+// 避免更改了响应式对象就会执行 update 的逻辑
+// 因为只有最后一次调用 update 才是有价值的
+window.count = ref(1);
+
+// 如果一个响应式变量同时触发了两个组件的 update
+// 会发生什么有趣的事呢？
+const Child1 = {
+  name: "NextTickerChild1",
+  setup() {},
+  render() {
+    return h("div", {}, `child1 count: ${window.count.value}`);
+  },
+};
+
+const Child2 = {
+  name: "NextTickerChild2",
+  setup() {},
+  render() {
+    return h("div", {}, `child2 count: ${window.count.value}`);
+  },
+};
+
+export default {
+  name: "NextTicker",
+  setup() {},
+  render() {
+    return h(
+      "div",
+      { tId: "nextTicker" },
+      [h(Child1), h(Child2)]
+      //   `for nextTick: count: ${window.count.value}`
+    );
+  },
+};