Perf/core

packages/animations/src/animated/animated.ts

@@ -35,8 +35,8 @@ const Animated = component<AnimatedProps>(
         const fiber = cursor.hook.owner;
 
         walk(fiber.child, (fiber, _, stop) => {
-          if (fiber.element) {
-            scope.element = fiber.element;
+          if (fiber.el) {
+            scope.element = fiber.el;
             return stop();
           }
         });

packages/core/src/atom/atom.ts

@@ -76,13 +76,12 @@ class Atom<T = unknown> {
 
   __connect(fn: ShouldUpdate<T>, key: T) {
     const rootId = getRootId();
-    const fiber = $$scope().getCursorFiber();
-    const { hook } = fiber;
+    const cursor = $$scope().getCursor();
+    const { hook } = cursor;
     const disconnect = () => this.off(hook, key);
 
-    !hook.atoms && (hook.atoms = new Map());
-    hook.atoms.set(this, disconnect);
-    fiber.markHost(ATOM_HOST_MASK);
+    hook.setAtom(this, disconnect);
+    cursor.markHost(ATOM_HOST_MASK);
 
     if (detectIsEmpty(key)) {
       !this.connections1 && (this.connections1 = new Map());
@@ -159,7 +158,7 @@ class Atom<T = unknown> {
   }
 
   private off(hook: Hook, key: T) {
-    hook.atoms.delete(this);
+    hook.removeAtom(this);
     this.connections1 && this.connections1.delete(hook);
     this.connections2 && this.connections2.delete(key);
   }

packages/core/src/awaiter/awaiter.ts

@@ -25,7 +25,7 @@ class Awaiter {
 
       if (suspenseHook) {
         suspenseHook.setIsPeinding(true);
-        suspenseHook.incrementPending();
+        suspenseHook.incrementPendings();
         pendings = suspenseHook.getPendings();
         suspenseHook.update();
       }

packages/core/src/batch/batch.ts

@@ -5,15 +5,15 @@ import { $$scope } from '../scope';
 function batch(callback: () => void) {
   const $scope = $$scope();
 
-  $scope.setIsBatchZone(true);
+  $scope.setIsBatch(true);
   callback();
-  $scope.setIsBatchZone(false);
+  $scope.setIsBatch(false);
 }
 
 function addBatch(hook: Hook, callback: Callback, change: Callback) {
   const $scope = $$scope();
 
-  if ($scope.getIsTransitionZone()) {
+  if ($scope.getIsTransition()) {
     callback();
   } else {
     const batch = hook.getBatch() || { timer: null, changes: [] };

packages/core/src/component/component.ts

@@ -8,7 +8,7 @@ class Component<P extends StandardComponentProps = {}> {
   token?: Symbol = null;
   displayName?: string = null;
   shouldUpdate?: ShouldUpdate<P> = null;
-  children: Array<Instance> = [];
+  children: Array<Instance> = null;
 
   constructor(type: CreateElement<P>, token: Symbol, props: P, shouldUpdate: ShouldUpdate<P>, displayName: string) {
     this.type = type;

packages/core/src/constants.ts

@@ -9,12 +9,10 @@ export const CREATE_EFFECT_TAG = 'C';
 export const UPDATE_EFFECT_TAG = 'U';
 export const DELETE_EFFECT_TAG = 'D';
 export const SKIP_EFFECT_TAG = 'S';
-export const INSERTION_EFFECT_HOST_MASK = 1;
-export const LAYOUT_EFFECT_HOST_MASK = 2;
-export const ASYNC_EFFECT_HOST_MASK = 4;
-export const ATOM_HOST_MASK = 8;
-export const FLUSH_MASK = 16;
-export const MOVE_MASK = 32;
+export const EFFECT_HOST_MASK = 1;
+export const ATOM_HOST_MASK = 2;
+export const FLUSH_MASK = 4;
+export const MOVE_MASK = 8;
 export const IS_WIP_HOOK_MASK = 1;
 export const IS_PORTAL_HOOK_MASK = 2;
 export const IS_SUSPENSE_HOOK_MASK = 4;

packages/core/src/fiber/fiber.ts

@@ -1,14 +1,16 @@
 import {
+  EFFECT_HOST_MASK,
   IS_WIP_HOOK_MASK,
   IS_PORTAL_HOOK_MASK,
   IS_SUSPENSE_HOOK_MASK,
   IS_BOUNDARY_HOOK_MASK,
   IS_PENDING_HOOK_MASK,
 } from '../constants';
-import { detectIsFunction, detectIsUndefined, logError } from '../utils';
 import { type Instance, type Callback, type TimerId } from '../shared';
 import { detectAreSameComponentTypesWithSameKeys } from '../view';
+import { type UseEffectValue, dropEffects } from '../use-effect';
 import { type Context, type ContextProvider } from '../context';
+import { detectIsFunction, logError } from '../utils';
 import { detectIsComponent } from '../component';
 import { type Atom } from '../atom';
 
@@ -19,7 +21,7 @@ class Fiber<N = NativeElement> {
   idx = 0; // idx of fiber in the parent fiber
   eidx = 0; // native element idx
   mask = 0; // bit mask
-  element: N = null; // native element
+  el: N = null; // native element
   tag: string = null; // effect tag (CREATE, UPDATE, DELETE, SKIP)
   parent: Fiber<N> = null; // parent fiber
   child: Fiber<N> = null; // child fiber
@@ -51,7 +53,7 @@ class Fiber<N = NativeElement> {
     if (!this.parent) return;
     this.parent.cec += count;
 
-    if (!this.parent.element && !this.parent.hook?.getIsWip()) {
+    if (!this.parent.el && !this.parent.hook?.getIsWip()) {
       this.parent.increment(count);
     }
   }
@@ -82,9 +84,13 @@ class Hook<T = unknown> {
   idx = 0;
   values: Array<T> = [];
   owner: Fiber = null;
-  atoms: Map<Atom, Callback> = null;
   mask = 0;
-  box?: Box = null;
+  providers: Map<Context, ContextProvider> = null;
+  atoms: Map<Atom, Callback> = null;
+  batch: Batch = null;
+  catch: Catch = null;
+  pendings = 0;
+  update: Callback = null;
 
   __getMask(mask: number) {
     return Boolean(this.mask & mask);
@@ -94,10 +100,6 @@ class Hook<T = unknown> {
     x ? (this.mask |= mask) : (this.mask &= ~mask);
   }
 
-  __box() {
-    if (!this.box) this.box = {};
-  }
-
   getIsWip() {
     return this.__getMask(IS_WIP_HOOK_MASK);
   }
@@ -139,53 +141,66 @@ class Hook<T = unknown> {
   }
 
   getProviders() {
-    return this.box?.providers;
+    return this.providers;
   }
 
   setProviders(x: Map<Context, ContextProvider>) {
-    this.__box();
-    this.box.providers = x;
+    this.providers = x;
+  }
+
+  setAtom(atom: Atom, cb: Callback) {
+    !this.atoms && (this.atoms = new Map());
+    this.atoms.set(atom, cb);
+  }
+
+  removeAtom(atom: Atom) {
+    this.atoms.delete(atom);
   }
 
   getBatch() {
-    return this.box?.batch;
+    return this.batch;
   }
 
   setBatch(x: Batch) {
-    this.__box();
-    this.box.batch = x;
+    this.batch = x;
   }
 
   hasCatch() {
-    return detectIsFunction(this.box?.catch);
+    return detectIsFunction(this.catch);
   }
 
   setCatch(x: Catch) {
-    this.__box();
-    this.box.catch = x;
-  }
-
-  catch(x: Error) {
-    this.box?.catch(x);
+    this.catch = x;
   }
 
   setUpdate(x: Callback) {
-    this.__box();
-    this.box.update = x;
+    this.update = x;
   }
 
-  update() {
-    this.box?.update();
+  incrementPendings() {
+    this.pendings++;
   }
 
-  incrementPending() {
-    this.__box();
-    detectIsUndefined(this.box.pendings) && (this.box.pendings = 0);
-    this.box.pendings++;
+  getPendings() {
+    return this.pendings;
   }
 
-  getPendings() {
-    return this.box?.pendings;
+  drop() {
+    const { atoms } = this;
+
+    if (this.values.length > 0) {
+      const $hook = this as Hook<HookValue<UseEffectValue>>;
+
+      this.owner.mask & EFFECT_HOST_MASK && dropEffects($hook);
+    }
+
+    if (atoms) {
+      for (const [_, cleanup] of atoms) {
+        cleanup();
+      }
+
+      this.atoms = null;
+    }
   }
 }
 
@@ -196,14 +211,6 @@ function getHook(alt: Fiber, prevInst: Instance, nextInst: Instance): Hook | nul
   return null;
 }
 
-type Box = {
-  providers?: Map<Context, ContextProvider>;
-  batch?: Batch;
-  catch?: Catch;
-  pendings?: number;
-  update?: Callback;
-};
-
 type Batch = {
   timer: TimerId;
   changes: Array<Callback>;

packages/core/src/internal/internal.ts

@@ -4,7 +4,7 @@ import { $$scope, getRootId } from '../scope';
 import { useMemo } from '../use-memo';
 
 function useCursor() {
-  return $$scope().getCursorFiber();
+  return $$scope().getCursor();
 }
 
 function useSSR() {

packages/core/src/lazy/lazy.ts

@@ -2,7 +2,6 @@ import { detectIsUndefined, detectIsFunction, illegal, throwThis } from '../util
 import { type ComponentFactory, component } from '../component';
 import { useMemo } from '../use-memo';
 
-const $$lazy = Symbol('lazy');
 const factories = new Map<Loader, ComponentFactory>();
 
 function lazy<P extends object>(loader: Loader<P>, done?: () => void) {
@@ -23,7 +22,7 @@ function lazy<P extends object>(loader: Loader<P>, done?: () => void) {
 
       return factory ? factory(props) : null;
     },
-    { token: $$lazy, displayName: 'Lazy' },
+    { displayName: 'Lazy' },
   );
 }
 

packages/core/src/platform/platform.ts

@@ -30,7 +30,7 @@ const platform: Platform = {
 
 const detectIsServer = () => !platform.detectIsDynamic();
 
-const detectIsHydration = () => $$scope().getIsHydrateZone();
+const detectIsHydration = () => $$scope().getIsHydration();
 
 const detectIsSSR = () => detectIsServer() || detectIsHydration();
 

packages/core/src/reconciler/index.ts

@@ -0,0 +1 @@
+export * from './reconciler';