wip: try to create new root fiber instead of reusing it

This commit is contained in:
Géry Debongnie
2022-04-01 10:04:38 +02:00
parent a968bb7ab5
commit bf7730a34a
3 changed files with 58 additions and 14 deletions
+1
View File
@@ -334,6 +334,7 @@ export class ComponentNode<P extends object = any, E = any> implements VNode<Com
} }
patch() { patch() {
debugger
if (this.fiber && this.fiber.parent) { if (this.fiber && this.fiber.parent) {
// we only patch here renderings coming from above. renderings initiated // we only patch here renderings coming from above. renderings initiated
// by the component will be patched independently in the appropriate // by the component will be patched independently in the appropriate
+54 -13
View File
@@ -1,6 +1,6 @@
import { BDom, mount } from "../blockdom"; import { BDom, mount } from "../blockdom";
import type { ComponentNode } from "./component_node"; import type { ComponentNode } from "./component_node";
import { fibersInError, handleError } from "./error_handling"; import { handleError } from "./error_handling";
import { STATUS } from "./status"; import { STATUS } from "./status";
export function makeChildFiber(node: ComponentNode, parent: Fiber): Fiber { export function makeChildFiber(node: ComponentNode, parent: Fiber): Fiber {
@@ -22,19 +22,56 @@ export function makeChildFiber(node: ComponentNode, parent: Fiber): Fiber {
export function makeRootFiber(node: ComponentNode): Fiber { export function makeRootFiber(node: ComponentNode): Fiber {
let current = node.fiber; let current = node.fiber;
if (current) { if (current) {
let root = current.root!; debugger;
root.setCounter(root.counter + 1 - cancelFibers(current.children)); let parent = current.parent;
current.children = []; let n = cancelFibers(current.children);
current.bdom = null; current.root = null;
if (current === root) { // current.bdom = null;
root.reachedChildren = new WeakSet(); if (parent) {
let fiber = new Fiber(node);
fiber.deep = parent.deep;
const root = parent.root!;
fiber.root = root;
let index = parent.children.indexOf(current);
parent.children[index] = fiber;
// parent.children.push(fiber);
fiber.parent = parent;
// node.fiber =
root.setCounter(root.counter + 1 - n);
if (node.willPatch.length) {
let index = root.willPatch.indexOf(current);
if (index >= 0) {
root.willPatch[index] = fiber;
}
}
if (node.patched.length) {
let index = root.patched.indexOf(current);
if (index >= 0) {
root.patched[index] = fiber;
}
}
return fiber;
} }
if (fibersInError.has(current)) { // let parent = current.parent;
fibersInError.delete(current); // let fiber = new Fiber(node);
fibersInError.delete(root); // return fiber;
current.appliedToDom = false;
} // cancelFibers(current.children);
return current; // current.root = null;
// let root = current.root!;
// root.setCounter(root.counter + 1 - cancelFibers(current.children));
// current.children = [];
// current.bdom = null;
// if (current === root) {
// root.reachedChildren = new WeakSet();
// }
// if (fibersInError.has(current)) {
// fibersInError.delete(current);
// fibersInError.delete(root);
// current.appliedToDom = false;
// }
// return current;
} }
const fiber = new RootFiber(node); const fiber = new RootFiber(node);
fiber.root = fiber; fiber.root = fiber;
@@ -70,6 +107,8 @@ function cancelFibers(fibers: Fiber[]): number {
return result; return result;
} }
(window as any).fibers = [];
export class Fiber { export class Fiber {
node: ComponentNode; node: ComponentNode;
bdom: BDom | null = null; bdom: BDom | null = null;
@@ -81,6 +120,7 @@ export class Fiber {
constructor(node: ComponentNode) { constructor(node: ComponentNode) {
this.node = node; this.node = node;
(window as any).fibers.push(this);
} }
render() { render() {
@@ -190,6 +230,7 @@ export class RootFiber extends Fiber {
} }
setCounter(newValue: number) { setCounter(newValue: number) {
debugger;
this.counter = newValue; this.counter = newValue;
if (newValue === 0) { if (newValue === 0) {
this.node.app.scheduler.flush(); this.node.app.scheduler.flush();
+3 -1
View File
@@ -870,6 +870,7 @@ test("concurrent renderings scenario 2", async () => {
"ComponentB:rendered", "ComponentB:rendered",
]).toBeLogged(); ]).toBeLogged();
debugger;
stateB.fromB = "c"; stateB.fromB = "c";
await nextTick(); await nextTick();
expect(fixture.innerHTML).toBe("<div>1<p><span>1b</span></p></div>"); expect(fixture.innerHTML).toBe("<div>1<p><span>1b</span></p></div>");
@@ -881,7 +882,7 @@ test("concurrent renderings scenario 2", async () => {
defs[1].resolve(); // resolve rendering initiated in B defs[1].resolve(); // resolve rendering initiated in B
await nextTick(); await nextTick();
expect(fixture.innerHTML).toBe("<div>2<p><span>2c</span></p></div>"); debugger
expect([ expect([
"ComponentC:willRender", "ComponentC:willRender",
"ComponentC:rendered", "ComponentC:rendered",
@@ -892,6 +893,7 @@ test("concurrent renderings scenario 2", async () => {
"ComponentB:patched", "ComponentB:patched",
"ComponentA:patched", "ComponentA:patched",
]).toBeLogged(); ]).toBeLogged();
expect(fixture.innerHTML).toBe("<div>2<p><span>2c</span></p></div>");
defs[0].resolve(); // resolve rendering initiated in A defs[0].resolve(); // resolve rendering initiated in A
await nextTick(); await nextTick();