bippy 0.0.15 → 0.0.18
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +10 -6
- package/dist/index.d.cts +18 -24
- package/dist/index.d.ts +18 -24
- package/dist/index.global.js +1 -1
- package/dist/index.js +10 -6
- package/package.json +1 -1
- package/dist/score.cjs +0 -220
- package/dist/score.d.cts +0 -17
- package/dist/score.d.ts +0 -17
- package/dist/score.js +0 -214
package/dist/index.cjs
CHANGED
|
@@ -42,7 +42,7 @@ var Ref = 512;
|
|
|
42
42
|
var Snapshot = 1024;
|
|
43
43
|
var Visibility = 8192;
|
|
44
44
|
var MutationMask = Placement | Update | ChildDeletion | ContentReset | Hydrating | Visibility | Snapshot;
|
|
45
|
-
var isValidElement = (element) => typeof element === "object" && element
|
|
45
|
+
var isValidElement = (element) => typeof element === "object" && element != null && "$$typeof" in element && String(element.$$typeof) === "Symbol(react.element)";
|
|
46
46
|
var isHostFiber = (fiber) => fiber.tag === HostComponentTag || // @ts-expect-error: it exists
|
|
47
47
|
fiber.tag === HostHoistableTag || // @ts-expect-error: it exists
|
|
48
48
|
fiber.tag === HostSingletonTag;
|
|
@@ -240,7 +240,8 @@ var getRDTHook = () => {
|
|
|
240
240
|
const nextID = ++i;
|
|
241
241
|
renderers.set(nextID, renderer);
|
|
242
242
|
return nextID;
|
|
243
|
-
}
|
|
243
|
+
},
|
|
244
|
+
_instrumentationSource: "bippy"
|
|
244
245
|
};
|
|
245
246
|
try {
|
|
246
247
|
globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__ = rdtHook;
|
|
@@ -400,14 +401,17 @@ var createFiberVisitor = ({
|
|
|
400
401
|
var instrument = ({
|
|
401
402
|
onCommitFiberRoot,
|
|
402
403
|
onCommitFiberUnmount,
|
|
403
|
-
onPostCommitFiberRoot
|
|
404
|
+
onPostCommitFiberRoot,
|
|
405
|
+
name
|
|
404
406
|
}) => {
|
|
405
407
|
const devtoolsHook = getRDTHook();
|
|
408
|
+
devtoolsHook._instrumentationSource = name ?? "bippy";
|
|
406
409
|
const prevOnCommitFiberRoot = devtoolsHook.onCommitFiberRoot;
|
|
407
410
|
if (onCommitFiberRoot) {
|
|
408
|
-
devtoolsHook.onCommitFiberRoot = (rendererID, root) => {
|
|
409
|
-
if (prevOnCommitFiberRoot)
|
|
410
|
-
|
|
411
|
+
devtoolsHook.onCommitFiberRoot = (rendererID, root, priority) => {
|
|
412
|
+
if (prevOnCommitFiberRoot)
|
|
413
|
+
prevOnCommitFiberRoot(rendererID, root, priority);
|
|
414
|
+
onCommitFiberRoot(rendererID, root, priority);
|
|
411
415
|
};
|
|
412
416
|
}
|
|
413
417
|
const prevOnCommitFiberUnmount = devtoolsHook.onCommitFiberUnmount;
|
package/dist/index.d.cts
CHANGED
|
@@ -1,6 +1,17 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { Fiber, FiberRoot } from 'react-reconciler';
|
|
3
3
|
|
|
4
|
+
interface ReactDevToolsGlobalHook {
|
|
5
|
+
checkDCE: () => void;
|
|
6
|
+
supportsFiber: boolean;
|
|
7
|
+
supportsFlight: boolean;
|
|
8
|
+
renderers: Map<number, unknown>;
|
|
9
|
+
onCommitFiberRoot: (rendererID: number, root: unknown, priority: void | number) => void;
|
|
10
|
+
onCommitFiberUnmount: (rendererID: number, root: unknown) => void;
|
|
11
|
+
onPostCommitFiberRoot: (rendererID: number, root: unknown) => void;
|
|
12
|
+
inject: (renderer: unknown) => number;
|
|
13
|
+
_instrumentationSource?: string;
|
|
14
|
+
}
|
|
4
15
|
declare const ClassComponentTag = 1;
|
|
5
16
|
declare const FunctionComponentTag = 0;
|
|
6
17
|
declare const ContextConsumerTag = 9;
|
|
@@ -33,7 +44,7 @@ declare const Ref = 512;
|
|
|
33
44
|
declare const Snapshot = 1024;
|
|
34
45
|
declare const Visibility = 8192;
|
|
35
46
|
declare const MutationMask: number;
|
|
36
|
-
declare const isValidElement: (element: unknown) =>
|
|
47
|
+
declare const isValidElement: (element: unknown) => element is React.ReactElement;
|
|
37
48
|
declare const isHostFiber: (fiber: Fiber) => boolean;
|
|
38
49
|
declare const isCompositeFiber: (fiber: Fiber) => boolean;
|
|
39
50
|
declare const traverseContexts: (fiber: Fiber, selector: (prevValue: {
|
|
@@ -63,16 +74,7 @@ declare const getTimings: (fiber?: Fiber | null | undefined) => {
|
|
|
63
74
|
declare const hasMemoCache: (fiber: Fiber) => boolean;
|
|
64
75
|
declare const getType: (type: any) => any;
|
|
65
76
|
declare const getDisplayName: (type: any) => string | null;
|
|
66
|
-
declare const getRDTHook: () =>
|
|
67
|
-
checkDCE: () => void;
|
|
68
|
-
supportsFiber: boolean;
|
|
69
|
-
supportsFlight: boolean;
|
|
70
|
-
renderers: Map<number, unknown>;
|
|
71
|
-
onCommitFiberRoot: (rendererID: number, root: unknown) => void;
|
|
72
|
-
onCommitFiberUnmount: (rendererID: number, root: unknown) => void;
|
|
73
|
-
onPostCommitFiberRoot: (rendererID: number, root: unknown) => void;
|
|
74
|
-
inject: (renderer: unknown) => number;
|
|
75
|
-
};
|
|
77
|
+
declare const getRDTHook: () => ReactDevToolsGlobalHook;
|
|
76
78
|
type RenderHandler = <S>(fiber: Fiber, phase: 'mount' | 'update' | 'unmount', state?: S) => void;
|
|
77
79
|
declare const mountFiberRecursively: (onRender: RenderHandler, firstChild: Fiber, traverseSiblings: boolean) => void;
|
|
78
80
|
declare const updateFiberRecursively: (onRender: RenderHandler, nextFiber: Fiber, prevFiber: Fiber, parentFiber: Fiber | null) => void;
|
|
@@ -82,19 +84,11 @@ declare const createFiberVisitor: ({ onRender: onRenderWithoutState, onError, }:
|
|
|
82
84
|
onRender: RenderHandler;
|
|
83
85
|
onError?: (error: unknown) => void;
|
|
84
86
|
}) => <S>(_rendererID: number, root: FiberRoot, state?: S) => void;
|
|
85
|
-
declare const instrument: ({ onCommitFiberRoot, onCommitFiberUnmount, onPostCommitFiberRoot, }: {
|
|
86
|
-
onCommitFiberRoot?: (rendererID: number, root: FiberRoot) => void;
|
|
87
|
+
declare const instrument: ({ onCommitFiberRoot, onCommitFiberUnmount, onPostCommitFiberRoot, name, }: {
|
|
88
|
+
onCommitFiberRoot?: (rendererID: number, root: FiberRoot, priority: void | number) => void;
|
|
87
89
|
onCommitFiberUnmount?: (rendererID: number, root: FiberRoot) => void;
|
|
88
90
|
onPostCommitFiberRoot?: (rendererID: number, root: FiberRoot) => void;
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
supportsFiber: boolean;
|
|
92
|
-
supportsFlight: boolean;
|
|
93
|
-
renderers: Map<number, unknown>;
|
|
94
|
-
onCommitFiberRoot: (rendererID: number, root: unknown) => void;
|
|
95
|
-
onCommitFiberUnmount: (rendererID: number, root: unknown) => void;
|
|
96
|
-
onPostCommitFiberRoot: (rendererID: number, root: unknown) => void;
|
|
97
|
-
inject: (renderer: unknown) => number;
|
|
98
|
-
};
|
|
91
|
+
name?: string;
|
|
92
|
+
}) => ReactDevToolsGlobalHook;
|
|
99
93
|
|
|
100
|
-
export { CONCURRENT_MODE_NUMBER, CONCURRENT_MODE_SYMBOL_STRING, ChildDeletion, ClassComponentTag, Cloned, ContentReset, ContextConsumerTag, DEPRECATED_ASYNC_MODE_SYMBOL_STRING, DehydratedSuspenseComponent, DidCapture, ForwardRefTag, Fragment, FunctionComponentTag, HostComponentTag, HostHoistableTag, HostRoot, HostSingletonTag, HostText, Hydrating, LegacyHiddenComponent, MemoComponentTag, MutationMask, OffscreenComponent, OffscreenComponentTag, PerformedWork, Placement, Ref, SimpleMemoComponentTag, Snapshot, SuspenseComponentTag, Update, Visibility, createFiberVisitor, didFiberCommit, didFiberRender, getDisplayName, getFiberStack, getMutatedHostFibers, getNearestHostFiber, getRDTHook, getTimings, getType, hasMemoCache, instrument, isCompositeFiber, isHostFiber, isValidElement, mountFiberRecursively, shouldFilterFiber, traverseContexts, traverseFiber, traverseProps, traverseState, unmountFiber, unmountFiberChildrenRecursively, updateFiberRecursively };
|
|
94
|
+
export { CONCURRENT_MODE_NUMBER, CONCURRENT_MODE_SYMBOL_STRING, ChildDeletion, ClassComponentTag, Cloned, ContentReset, ContextConsumerTag, DEPRECATED_ASYNC_MODE_SYMBOL_STRING, DehydratedSuspenseComponent, DidCapture, ForwardRefTag, Fragment, FunctionComponentTag, HostComponentTag, HostHoistableTag, HostRoot, HostSingletonTag, HostText, Hydrating, LegacyHiddenComponent, MemoComponentTag, MutationMask, OffscreenComponent, OffscreenComponentTag, PerformedWork, Placement, type ReactDevToolsGlobalHook, Ref, SimpleMemoComponentTag, Snapshot, SuspenseComponentTag, Update, Visibility, createFiberVisitor, didFiberCommit, didFiberRender, getDisplayName, getFiberStack, getMutatedHostFibers, getNearestHostFiber, getRDTHook, getTimings, getType, hasMemoCache, instrument, isCompositeFiber, isHostFiber, isValidElement, mountFiberRecursively, shouldFilterFiber, traverseContexts, traverseFiber, traverseProps, traverseState, unmountFiber, unmountFiberChildrenRecursively, updateFiberRecursively };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,17 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { Fiber, FiberRoot } from 'react-reconciler';
|
|
3
3
|
|
|
4
|
+
interface ReactDevToolsGlobalHook {
|
|
5
|
+
checkDCE: () => void;
|
|
6
|
+
supportsFiber: boolean;
|
|
7
|
+
supportsFlight: boolean;
|
|
8
|
+
renderers: Map<number, unknown>;
|
|
9
|
+
onCommitFiberRoot: (rendererID: number, root: unknown, priority: void | number) => void;
|
|
10
|
+
onCommitFiberUnmount: (rendererID: number, root: unknown) => void;
|
|
11
|
+
onPostCommitFiberRoot: (rendererID: number, root: unknown) => void;
|
|
12
|
+
inject: (renderer: unknown) => number;
|
|
13
|
+
_instrumentationSource?: string;
|
|
14
|
+
}
|
|
4
15
|
declare const ClassComponentTag = 1;
|
|
5
16
|
declare const FunctionComponentTag = 0;
|
|
6
17
|
declare const ContextConsumerTag = 9;
|
|
@@ -33,7 +44,7 @@ declare const Ref = 512;
|
|
|
33
44
|
declare const Snapshot = 1024;
|
|
34
45
|
declare const Visibility = 8192;
|
|
35
46
|
declare const MutationMask: number;
|
|
36
|
-
declare const isValidElement: (element: unknown) =>
|
|
47
|
+
declare const isValidElement: (element: unknown) => element is React.ReactElement;
|
|
37
48
|
declare const isHostFiber: (fiber: Fiber) => boolean;
|
|
38
49
|
declare const isCompositeFiber: (fiber: Fiber) => boolean;
|
|
39
50
|
declare const traverseContexts: (fiber: Fiber, selector: (prevValue: {
|
|
@@ -63,16 +74,7 @@ declare const getTimings: (fiber?: Fiber | null | undefined) => {
|
|
|
63
74
|
declare const hasMemoCache: (fiber: Fiber) => boolean;
|
|
64
75
|
declare const getType: (type: any) => any;
|
|
65
76
|
declare const getDisplayName: (type: any) => string | null;
|
|
66
|
-
declare const getRDTHook: () =>
|
|
67
|
-
checkDCE: () => void;
|
|
68
|
-
supportsFiber: boolean;
|
|
69
|
-
supportsFlight: boolean;
|
|
70
|
-
renderers: Map<number, unknown>;
|
|
71
|
-
onCommitFiberRoot: (rendererID: number, root: unknown) => void;
|
|
72
|
-
onCommitFiberUnmount: (rendererID: number, root: unknown) => void;
|
|
73
|
-
onPostCommitFiberRoot: (rendererID: number, root: unknown) => void;
|
|
74
|
-
inject: (renderer: unknown) => number;
|
|
75
|
-
};
|
|
77
|
+
declare const getRDTHook: () => ReactDevToolsGlobalHook;
|
|
76
78
|
type RenderHandler = <S>(fiber: Fiber, phase: 'mount' | 'update' | 'unmount', state?: S) => void;
|
|
77
79
|
declare const mountFiberRecursively: (onRender: RenderHandler, firstChild: Fiber, traverseSiblings: boolean) => void;
|
|
78
80
|
declare const updateFiberRecursively: (onRender: RenderHandler, nextFiber: Fiber, prevFiber: Fiber, parentFiber: Fiber | null) => void;
|
|
@@ -82,19 +84,11 @@ declare const createFiberVisitor: ({ onRender: onRenderWithoutState, onError, }:
|
|
|
82
84
|
onRender: RenderHandler;
|
|
83
85
|
onError?: (error: unknown) => void;
|
|
84
86
|
}) => <S>(_rendererID: number, root: FiberRoot, state?: S) => void;
|
|
85
|
-
declare const instrument: ({ onCommitFiberRoot, onCommitFiberUnmount, onPostCommitFiberRoot, }: {
|
|
86
|
-
onCommitFiberRoot?: (rendererID: number, root: FiberRoot) => void;
|
|
87
|
+
declare const instrument: ({ onCommitFiberRoot, onCommitFiberUnmount, onPostCommitFiberRoot, name, }: {
|
|
88
|
+
onCommitFiberRoot?: (rendererID: number, root: FiberRoot, priority: void | number) => void;
|
|
87
89
|
onCommitFiberUnmount?: (rendererID: number, root: FiberRoot) => void;
|
|
88
90
|
onPostCommitFiberRoot?: (rendererID: number, root: FiberRoot) => void;
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
supportsFiber: boolean;
|
|
92
|
-
supportsFlight: boolean;
|
|
93
|
-
renderers: Map<number, unknown>;
|
|
94
|
-
onCommitFiberRoot: (rendererID: number, root: unknown) => void;
|
|
95
|
-
onCommitFiberUnmount: (rendererID: number, root: unknown) => void;
|
|
96
|
-
onPostCommitFiberRoot: (rendererID: number, root: unknown) => void;
|
|
97
|
-
inject: (renderer: unknown) => number;
|
|
98
|
-
};
|
|
91
|
+
name?: string;
|
|
92
|
+
}) => ReactDevToolsGlobalHook;
|
|
99
93
|
|
|
100
|
-
export { CONCURRENT_MODE_NUMBER, CONCURRENT_MODE_SYMBOL_STRING, ChildDeletion, ClassComponentTag, Cloned, ContentReset, ContextConsumerTag, DEPRECATED_ASYNC_MODE_SYMBOL_STRING, DehydratedSuspenseComponent, DidCapture, ForwardRefTag, Fragment, FunctionComponentTag, HostComponentTag, HostHoistableTag, HostRoot, HostSingletonTag, HostText, Hydrating, LegacyHiddenComponent, MemoComponentTag, MutationMask, OffscreenComponent, OffscreenComponentTag, PerformedWork, Placement, Ref, SimpleMemoComponentTag, Snapshot, SuspenseComponentTag, Update, Visibility, createFiberVisitor, didFiberCommit, didFiberRender, getDisplayName, getFiberStack, getMutatedHostFibers, getNearestHostFiber, getRDTHook, getTimings, getType, hasMemoCache, instrument, isCompositeFiber, isHostFiber, isValidElement, mountFiberRecursively, shouldFilterFiber, traverseContexts, traverseFiber, traverseProps, traverseState, unmountFiber, unmountFiberChildrenRecursively, updateFiberRecursively };
|
|
94
|
+
export { CONCURRENT_MODE_NUMBER, CONCURRENT_MODE_SYMBOL_STRING, ChildDeletion, ClassComponentTag, Cloned, ContentReset, ContextConsumerTag, DEPRECATED_ASYNC_MODE_SYMBOL_STRING, DehydratedSuspenseComponent, DidCapture, ForwardRefTag, Fragment, FunctionComponentTag, HostComponentTag, HostHoistableTag, HostRoot, HostSingletonTag, HostText, Hydrating, LegacyHiddenComponent, MemoComponentTag, MutationMask, OffscreenComponent, OffscreenComponentTag, PerformedWork, Placement, type ReactDevToolsGlobalHook, Ref, SimpleMemoComponentTag, Snapshot, SuspenseComponentTag, Update, Visibility, createFiberVisitor, didFiberCommit, didFiberRender, getDisplayName, getFiberStack, getMutatedHostFibers, getNearestHostFiber, getRDTHook, getTimings, getType, hasMemoCache, instrument, isCompositeFiber, isHostFiber, isValidElement, mountFiberRecursively, shouldFilterFiber, traverseContexts, traverseFiber, traverseProps, traverseState, unmountFiber, unmountFiberChildrenRecursively, updateFiberRecursively };
|
package/dist/index.global.js
CHANGED
|
@@ -6,4 +6,4 @@ var Bippy=(function(exports){'use strict';/**
|
|
|
6
6
|
* This source code is licensed under the MIT license found in the
|
|
7
7
|
* LICENSE file in the root directory of this source tree.
|
|
8
8
|
*/
|
|
9
|
-
var
|
|
9
|
+
var k=1,D=0,O=9,H=13,_=22,P=11,z=14,M=15,E=5,N=26,V=27,I=18,U=6,j=7,A=23,L=22,B=3,W=60111,T="Symbol(react.concurrent_mode)",R="Symbol(react.async_mode)",$=1,G=2,Y=128,K=4096,Q=4,q=8,J=16,X=32,Z=512,ee=1024,te=8192,oe=13366,ne=e=>typeof e=="object"&&e!=null&&"$$typeof"in e&&String(e.$$typeof)==="Symbol(react.element)",d=e=>e.tag===5||e.tag===26||e.tag===27,re=e=>e.tag===0||e.tag===1||e.tag===15||e.tag===14||e.tag===11,ie=(e,t)=>{try{let n=e.dependencies,o=e.alternate?.dependencies;if(!n||!o||typeof n!="object"||!("firstContext"in n)||typeof o!="object"||!("firstContext"in o))return !1;let r=n.firstContext,l=o.firstContext;for(;r&&typeof r=="object"&&"memoizedValue"in r&&l&&typeof l=="object"&&"memoizedValue"in l;){if(t(r,l)===!0)return !0;r=r.next,l=l.next;}}catch{}return !1},le=(e,t)=>{try{let n=e.memoizedState,o=e.alternate?.memoizedState;for(;n&&o;){if(t(n,o)===!0)return !0;n=n.next,o=o.next;}}catch{}return !1},se=(e,t)=>{try{let n=e.memoizedProps,o=e.alternate?.memoizedProps||{};for(let r in {...o,...n}){let l=o?.[r],s=n?.[r];if(t(l,s)===!0)return !0}}catch{}return !1},g=e=>{let t=e.memoizedProps,n=e.alternate?.memoizedProps||{},o=e.flags??e.effectTag??0;switch(e.tag){case 1:case 0:case 9:case 11:case 14:case 15:return (o&1)===1;default:return e.alternate?n!==t||e.alternate.memoizedState!==e.memoizedState||e.alternate.ref!==e.ref:!0}},v=e=>!!(e.flags&22||e.subtreeFlags&22),ae=e=>{let t=[],n=new WeakSet,o=r=>{!r||n.has(r)||(n.add(r),d(r)&&v(r)&&g(r)&&t.push(r),r.child&&o(r.child),r.sibling&&o(r.sibling));};return o(e),t},ue=e=>{let t=[];for(;e.return;)t.push(e),e=e.return;let n=new Array(t.length);for(let o=0;o<t.length;o++)n[o]=t[t.length-o-1];return n},f=e=>{switch(e.tag){case 18:return !0;case 6:case 7:case 23:case 22:return !0;case 3:return !1;default:{let t=typeof e.type=="object"&&e.type!==null?e.type.$$typeof:e.type;switch(typeof t=="symbol"?t.toString():t){case 60111:case T:case R:return !0;default:return !1}}}},ce=e=>{let t=b(e,d);return t||(t=b(e,d,!0)),t},b=(e,t,n=!1)=>{if(!e)return null;if(t(e)===!0)return e;let o=n?e.return:e.child;for(;o;){let r=b(o,t,n);if(r)return r;o=n?null:o.sibling;}return null},me=e=>{let t=e?.actualDuration??0,n=t,o=e?.child??null;for(;t>0&&o!=null;)n-=o.actualDuration??0,o=o.sibling;return {selfTime:n,totalTime:t}},pe=e=>!!e.updateQueue?.memoCache,F=e=>typeof e=="function"?e:typeof e=="object"&&e?F(e.type||e.render):null,de=e=>{if(typeof e!="function"&&!(typeof e=="object"&&e))return null;let t=e.displayName||e.name||null;return t||(e=F(e),e&&(e.displayName||e.name)||null)},p=()=>{},x=()=>{let e=globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__,t=new Map,n=0;e??={checkDCE:p,supportsFiber:!0,supportsFlight:!0,renderers:t,onCommitFiberRoot:p,onCommitFiberUnmount:p,onPostCommitFiberRoot:p,inject(o){let r=++n;return t.set(r,o),r},_instrumentationSource:"bippy"};try{globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__=e;}catch{}return e};typeof window<"u"&&x();var m=(e,t,n)=>{let o=t;for(;o!=null;){if(!f(o)&&g(o)&&e(o,"mount"),o.tag===13)if(o.memoizedState!==null){let s=o.child,u=s?s.sibling:null;if(u){let i=u.child;i!==null&&m(e,i,!1);}}else {let s=null;o.child!==null&&(s=o.child.child),s!==null&&m(e,s,!1);}else o.child!=null&&m(e,o.child,!0);o=n?o.sibling:null;}},C=(e,t,n,o)=>{if(!n)return;let r=t.tag===13,l=!f(t);l&&g(t)&&e(t,"update");let s=r&&n.memoizedState!==null,u=r&&t.memoizedState!==null;if(s&&u){let i=t.child?.sibling??null,a=n.child?.sibling??null;i!==null&&a!==null&&C(e,i,a);}else if(s&&!u){let i=t.child;i!==null&&m(e,i,!0);}else if(!s&&u){y(e,n);let i=t.child?.sibling??null;i!==null&&m(e,i,!0);}else if(t.child!==n.child){let i=t.child;for(;i;){if(i.alternate){let a=i.alternate;C(e,i,a);}else m(e,i,!1);i=i.sibling;}}},S=(e,t)=>{(t.tag===3||!f(t))&&e(t,"unmount");},y=(e,t)=>{let n=t.tag===13&&t.memoizedState!==null,o=t.child;for(n&&(o=(t.child?.sibling??null)?.child??null);o!==null;)o.return!==null&&(S(e,o),y(e,o)),o=o.sibling;},w=0,h=new WeakMap,be=({onRender:e,onError:t})=>(n,o,r)=>{let l=o.current,s=(a,c)=>e(a,c,r),u=h.get(o);u||(u={prevFiber:null,id:w++},h.set(o,u));let{prevFiber:i}=u;try{if(i!==null){let a=i&&i.memoizedState!=null&&i.memoizedState.element!=null&&i.memoizedState.isDehydrated!==!0,c=l.memoizedState!=null&&l.memoizedState.element!=null&&l.memoizedState.isDehydrated!==!0;!a&&c?m(s,l,!1):a&&c?C(s,l,l.alternate,null):a&&!c&&S(s,l);}else m(s,l,!1);}catch(a){if(t)t(a);else throw a}u.prevFiber=l;},Ce=({onCommitFiberRoot:e,onCommitFiberUnmount:t,onPostCommitFiberRoot:n,name:o})=>{let r=x();r._instrumentationSource=o??"bippy";let l=r.onCommitFiberRoot;e&&(r.onCommitFiberRoot=(i,a,c)=>{l&&l(i,a,c),e(i,a,c);});let s=r.onCommitFiberUnmount;t&&(r.onCommitFiberUnmount=(i,a)=>{s&&s(i,a),t(i,a);});let u=r.onPostCommitFiberRoot;return n&&(r.onPostCommitFiberRoot=(i,a)=>{u&&u(i,a);}),r};exports.CONCURRENT_MODE_NUMBER=W;exports.CONCURRENT_MODE_SYMBOL_STRING=T;exports.ChildDeletion=J;exports.ClassComponentTag=k;exports.Cloned=q;exports.ContentReset=X;exports.ContextConsumerTag=O;exports.DEPRECATED_ASYNC_MODE_SYMBOL_STRING=R;exports.DehydratedSuspenseComponent=I;exports.DidCapture=Y;exports.ForwardRefTag=P;exports.Fragment=j;exports.FunctionComponentTag=D;exports.HostComponentTag=E;exports.HostHoistableTag=N;exports.HostRoot=B;exports.HostSingletonTag=V;exports.HostText=U;exports.Hydrating=K;exports.LegacyHiddenComponent=A;exports.MemoComponentTag=z;exports.MutationMask=oe;exports.OffscreenComponent=L;exports.OffscreenComponentTag=_;exports.PerformedWork=$;exports.Placement=G;exports.Ref=Z;exports.SimpleMemoComponentTag=M;exports.Snapshot=ee;exports.SuspenseComponentTag=H;exports.Update=Q;exports.Visibility=te;exports.createFiberVisitor=be;exports.didFiberCommit=v;exports.didFiberRender=g;exports.getDisplayName=de;exports.getFiberStack=ue;exports.getMutatedHostFibers=ae;exports.getNearestHostFiber=ce;exports.getRDTHook=x;exports.getTimings=me;exports.getType=F;exports.hasMemoCache=pe;exports.instrument=Ce;exports.isCompositeFiber=re;exports.isHostFiber=d;exports.isValidElement=ne;exports.mountFiberRecursively=m;exports.shouldFilterFiber=f;exports.traverseContexts=ie;exports.traverseFiber=b;exports.traverseProps=se;exports.traverseState=le;exports.unmountFiber=S;exports.unmountFiberChildrenRecursively=y;exports.updateFiberRecursively=C;return exports;})({});
|
package/dist/index.js
CHANGED
|
@@ -40,7 +40,7 @@ var Ref = 512;
|
|
|
40
40
|
var Snapshot = 1024;
|
|
41
41
|
var Visibility = 8192;
|
|
42
42
|
var MutationMask = Placement | Update | ChildDeletion | ContentReset | Hydrating | Visibility | Snapshot;
|
|
43
|
-
var isValidElement = (element) => typeof element === "object" && element
|
|
43
|
+
var isValidElement = (element) => typeof element === "object" && element != null && "$$typeof" in element && String(element.$$typeof) === "Symbol(react.element)";
|
|
44
44
|
var isHostFiber = (fiber) => fiber.tag === HostComponentTag || // @ts-expect-error: it exists
|
|
45
45
|
fiber.tag === HostHoistableTag || // @ts-expect-error: it exists
|
|
46
46
|
fiber.tag === HostSingletonTag;
|
|
@@ -238,7 +238,8 @@ var getRDTHook = () => {
|
|
|
238
238
|
const nextID = ++i;
|
|
239
239
|
renderers.set(nextID, renderer);
|
|
240
240
|
return nextID;
|
|
241
|
-
}
|
|
241
|
+
},
|
|
242
|
+
_instrumentationSource: "bippy"
|
|
242
243
|
};
|
|
243
244
|
try {
|
|
244
245
|
globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__ = rdtHook;
|
|
@@ -398,14 +399,17 @@ var createFiberVisitor = ({
|
|
|
398
399
|
var instrument = ({
|
|
399
400
|
onCommitFiberRoot,
|
|
400
401
|
onCommitFiberUnmount,
|
|
401
|
-
onPostCommitFiberRoot
|
|
402
|
+
onPostCommitFiberRoot,
|
|
403
|
+
name
|
|
402
404
|
}) => {
|
|
403
405
|
const devtoolsHook = getRDTHook();
|
|
406
|
+
devtoolsHook._instrumentationSource = name ?? "bippy";
|
|
404
407
|
const prevOnCommitFiberRoot = devtoolsHook.onCommitFiberRoot;
|
|
405
408
|
if (onCommitFiberRoot) {
|
|
406
|
-
devtoolsHook.onCommitFiberRoot = (rendererID, root) => {
|
|
407
|
-
if (prevOnCommitFiberRoot)
|
|
408
|
-
|
|
409
|
+
devtoolsHook.onCommitFiberRoot = (rendererID, root, priority) => {
|
|
410
|
+
if (prevOnCommitFiberRoot)
|
|
411
|
+
prevOnCommitFiberRoot(rendererID, root, priority);
|
|
412
|
+
onCommitFiberRoot(rendererID, root, priority);
|
|
409
413
|
};
|
|
410
414
|
}
|
|
411
415
|
const prevOnCommitFiberUnmount = devtoolsHook.onCommitFiberUnmount;
|
package/package.json
CHANGED
package/dist/score.cjs
DELETED
|
@@ -1,220 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* @license bippy
|
|
5
|
-
*
|
|
6
|
-
* Copyright (c) Aiden Bai.
|
|
7
|
-
*
|
|
8
|
-
* This source code is licensed under the MIT license found in the
|
|
9
|
-
* LICENSE file in the root directory of this source tree.
|
|
10
|
-
*/
|
|
11
|
-
|
|
12
|
-
// src/index.ts
|
|
13
|
-
var ClassComponentTag = 1;
|
|
14
|
-
var FunctionComponentTag = 0;
|
|
15
|
-
var ContextConsumerTag = 9;
|
|
16
|
-
var ForwardRefTag = 11;
|
|
17
|
-
var MemoComponentTag = 14;
|
|
18
|
-
var SimpleMemoComponentTag = 15;
|
|
19
|
-
var HostComponentTag = 5;
|
|
20
|
-
var HostHoistableTag = 26;
|
|
21
|
-
var HostSingletonTag = 27;
|
|
22
|
-
var PerformedWork = 1;
|
|
23
|
-
var Placement = 2;
|
|
24
|
-
var Hydrating = 4096;
|
|
25
|
-
var Update = 4;
|
|
26
|
-
var Cloned = 8;
|
|
27
|
-
var ChildDeletion = 16;
|
|
28
|
-
var ContentReset = 32;
|
|
29
|
-
var Snapshot = 1024;
|
|
30
|
-
var Visibility = 8192;
|
|
31
|
-
var MutationMask = Placement | Update | ChildDeletion | ContentReset | Hydrating | Visibility | Snapshot;
|
|
32
|
-
var isHostFiber = (fiber) => fiber.tag === HostComponentTag || // @ts-expect-error: it exists
|
|
33
|
-
fiber.tag === HostHoistableTag || // @ts-expect-error: it exists
|
|
34
|
-
fiber.tag === HostSingletonTag;
|
|
35
|
-
var didFiberRender = (fiber) => {
|
|
36
|
-
const nextProps = fiber.memoizedProps;
|
|
37
|
-
const prevProps = fiber.alternate?.memoizedProps || {};
|
|
38
|
-
const flags = fiber.flags ?? fiber.effectTag ?? 0;
|
|
39
|
-
switch (fiber.tag) {
|
|
40
|
-
case ClassComponentTag:
|
|
41
|
-
case FunctionComponentTag:
|
|
42
|
-
case ContextConsumerTag:
|
|
43
|
-
case ForwardRefTag:
|
|
44
|
-
case MemoComponentTag:
|
|
45
|
-
case SimpleMemoComponentTag: {
|
|
46
|
-
return (flags & PerformedWork) === PerformedWork;
|
|
47
|
-
}
|
|
48
|
-
default:
|
|
49
|
-
if (!fiber.alternate) return true;
|
|
50
|
-
return prevProps !== nextProps || fiber.alternate.memoizedState !== fiber.memoizedState || fiber.alternate.ref !== fiber.ref;
|
|
51
|
-
}
|
|
52
|
-
};
|
|
53
|
-
var didFiberCommit = (fiber) => {
|
|
54
|
-
return Boolean(
|
|
55
|
-
fiber.subtreeFlags & (MutationMask | Cloned) || fiber.deletions != null || fiber.alternate == null
|
|
56
|
-
);
|
|
57
|
-
};
|
|
58
|
-
var getMutatedHostFibers = (fiber) => {
|
|
59
|
-
const mutations = [];
|
|
60
|
-
const visited = /* @__PURE__ */ new WeakSet();
|
|
61
|
-
const traverse = (node) => {
|
|
62
|
-
if (!node || visited.has(node)) return;
|
|
63
|
-
visited.add(node);
|
|
64
|
-
if (isHostFiber(node) && didFiberCommit(node.return ?? node) && didFiberRender(node)) {
|
|
65
|
-
mutations.push(node);
|
|
66
|
-
}
|
|
67
|
-
if (node.child) {
|
|
68
|
-
traverse(node.child);
|
|
69
|
-
}
|
|
70
|
-
if (node.sibling) {
|
|
71
|
-
traverse(node.sibling);
|
|
72
|
-
}
|
|
73
|
-
};
|
|
74
|
-
traverse(fiber);
|
|
75
|
-
return mutations;
|
|
76
|
-
};
|
|
77
|
-
var getNearestHostFiber = (fiber) => {
|
|
78
|
-
let hostFiber = traverseFiber(fiber, isHostFiber);
|
|
79
|
-
if (!hostFiber) {
|
|
80
|
-
hostFiber = traverseFiber(fiber, isHostFiber, true);
|
|
81
|
-
}
|
|
82
|
-
return hostFiber;
|
|
83
|
-
};
|
|
84
|
-
var traverseFiber = (fiber, selector, ascending = false) => {
|
|
85
|
-
if (!fiber) return null;
|
|
86
|
-
if (selector(fiber) === true) return fiber;
|
|
87
|
-
let child = ascending ? fiber.return : fiber.child;
|
|
88
|
-
while (child) {
|
|
89
|
-
const match = traverseFiber(child, selector, ascending);
|
|
90
|
-
if (match) return match;
|
|
91
|
-
child = ascending ? null : child.sibling;
|
|
92
|
-
}
|
|
93
|
-
return null;
|
|
94
|
-
};
|
|
95
|
-
var NO_OP = () => {
|
|
96
|
-
};
|
|
97
|
-
var getRDTHook = () => {
|
|
98
|
-
let rdtHook = globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__;
|
|
99
|
-
const renderers = /* @__PURE__ */ new Map();
|
|
100
|
-
let i = 0;
|
|
101
|
-
rdtHook ??= {
|
|
102
|
-
checkDCE: NO_OP,
|
|
103
|
-
supportsFiber: true,
|
|
104
|
-
supportsFlight: true,
|
|
105
|
-
renderers,
|
|
106
|
-
onCommitFiberRoot: NO_OP,
|
|
107
|
-
onCommitFiberUnmount: NO_OP,
|
|
108
|
-
onPostCommitFiberRoot: NO_OP,
|
|
109
|
-
inject(renderer) {
|
|
110
|
-
const nextID = ++i;
|
|
111
|
-
renderers.set(nextID, renderer);
|
|
112
|
-
return nextID;
|
|
113
|
-
}
|
|
114
|
-
};
|
|
115
|
-
try {
|
|
116
|
-
globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__ = rdtHook;
|
|
117
|
-
} catch {
|
|
118
|
-
}
|
|
119
|
-
return rdtHook;
|
|
120
|
-
};
|
|
121
|
-
if (typeof window !== "undefined") {
|
|
122
|
-
getRDTHook();
|
|
123
|
-
}
|
|
124
|
-
|
|
125
|
-
// src/score.ts
|
|
126
|
-
var fps = 0;
|
|
127
|
-
var lastTime = performance.now();
|
|
128
|
-
var frameCount = 0;
|
|
129
|
-
var inited = false;
|
|
130
|
-
var getFPS = () => {
|
|
131
|
-
const updateFPS = () => {
|
|
132
|
-
frameCount++;
|
|
133
|
-
const now = performance.now();
|
|
134
|
-
if (now - lastTime >= 1e3) {
|
|
135
|
-
fps = frameCount;
|
|
136
|
-
frameCount = 0;
|
|
137
|
-
lastTime = now;
|
|
138
|
-
}
|
|
139
|
-
requestAnimationFrame(updateFPS);
|
|
140
|
-
};
|
|
141
|
-
if (!inited) {
|
|
142
|
-
inited = true;
|
|
143
|
-
updateFPS();
|
|
144
|
-
}
|
|
145
|
-
return fps;
|
|
146
|
-
};
|
|
147
|
-
var truncateFloat = (value, maxLen = 1e4) => {
|
|
148
|
-
if (typeof value === "number" && parseInt(value) !== value) {
|
|
149
|
-
value = ~~(value * maxLen) / maxLen;
|
|
150
|
-
}
|
|
151
|
-
return value;
|
|
152
|
-
};
|
|
153
|
-
var THRESHOLD_FPS = 60;
|
|
154
|
-
var getFiberRenderScore = (fiber) => {
|
|
155
|
-
const hostFiber = getNearestHostFiber(fiber);
|
|
156
|
-
const hasMutation = didFiberCommit(fiber);
|
|
157
|
-
const mutatedHostFibers = getMutatedHostFibers(fiber);
|
|
158
|
-
const isVisible = hostFiber && isElementVisible(hostFiber.stateNode) && isElementInViewport(hostFiber.stateNode);
|
|
159
|
-
const fps2 = getFPS();
|
|
160
|
-
let unnecessaryScore = (
|
|
161
|
-
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
|
|
162
|
-
isVisible || mutatedHostFibers.length || hasMutation ? 0 : 1
|
|
163
|
-
);
|
|
164
|
-
for (const mutatedHostFiber of mutatedHostFibers) {
|
|
165
|
-
const node = mutatedHostFiber.stateNode;
|
|
166
|
-
if (!isElementVisible(node) || !isElementInViewport(node)) {
|
|
167
|
-
unnecessaryScore += 1 / mutatedHostFibers.length;
|
|
168
|
-
}
|
|
169
|
-
}
|
|
170
|
-
return {
|
|
171
|
-
unnecessary: truncateFloat(unnecessaryScore),
|
|
172
|
-
slow: fps2 < THRESHOLD_FPS ? truncateFloat((THRESHOLD_FPS - fps2) / THRESHOLD_FPS) : 0
|
|
173
|
-
};
|
|
174
|
-
};
|
|
175
|
-
var isElementVisible = (el) => {
|
|
176
|
-
const style = window.getComputedStyle(el);
|
|
177
|
-
return style.display !== "none" && style.visibility !== "hidden" && style.contentVisibility !== "hidden" && style.opacity !== "0";
|
|
178
|
-
};
|
|
179
|
-
var initedEventListeners = false;
|
|
180
|
-
var scrollX = null;
|
|
181
|
-
var scrollY = null;
|
|
182
|
-
var innerWidth = null;
|
|
183
|
-
var innerHeight = null;
|
|
184
|
-
var getWindowDimensions = () => {
|
|
185
|
-
if (scrollX === null) scrollX = window.scrollX;
|
|
186
|
-
if (scrollY === null) scrollY = window.scrollY;
|
|
187
|
-
if (innerWidth === null) innerWidth = window.innerWidth;
|
|
188
|
-
if (innerHeight === null) innerHeight = window.innerHeight;
|
|
189
|
-
if (!initedEventListeners) {
|
|
190
|
-
initedEventListeners = true;
|
|
191
|
-
const handleResize = () => {
|
|
192
|
-
scrollX = null;
|
|
193
|
-
scrollY = null;
|
|
194
|
-
innerWidth = null;
|
|
195
|
-
innerHeight = null;
|
|
196
|
-
};
|
|
197
|
-
window.addEventListener("resize", handleResize);
|
|
198
|
-
window.addEventListener("scroll", handleResize);
|
|
199
|
-
}
|
|
200
|
-
return {
|
|
201
|
-
top: scrollY,
|
|
202
|
-
left: scrollX,
|
|
203
|
-
right: scrollX + innerWidth,
|
|
204
|
-
bottom: scrollY + innerHeight
|
|
205
|
-
};
|
|
206
|
-
};
|
|
207
|
-
var isElementInViewport = (el) => {
|
|
208
|
-
const elTop = el.offsetTop;
|
|
209
|
-
const elLeft = el.offsetLeft;
|
|
210
|
-
const elWidth = el.offsetWidth;
|
|
211
|
-
const elHeight = el.offsetHeight;
|
|
212
|
-
const { top, left, right, bottom } = getWindowDimensions();
|
|
213
|
-
return elTop + elHeight > top && elLeft + elWidth > left && elTop < bottom && elLeft < right;
|
|
214
|
-
};
|
|
215
|
-
|
|
216
|
-
exports.getFPS = getFPS;
|
|
217
|
-
exports.getFiberRenderScore = getFiberRenderScore;
|
|
218
|
-
exports.getWindowDimensions = getWindowDimensions;
|
|
219
|
-
exports.isElementInViewport = isElementInViewport;
|
|
220
|
-
exports.isElementVisible = isElementVisible;
|
package/dist/score.d.cts
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { Fiber } from 'react-reconciler';
|
|
2
|
-
|
|
3
|
-
declare const getFPS: () => number;
|
|
4
|
-
declare const getFiberRenderScore: (fiber: Fiber) => {
|
|
5
|
-
unnecessary: number;
|
|
6
|
-
slow: number;
|
|
7
|
-
};
|
|
8
|
-
declare const isElementVisible: (el: HTMLElement) => boolean;
|
|
9
|
-
declare const getWindowDimensions: () => {
|
|
10
|
-
top: number;
|
|
11
|
-
left: number;
|
|
12
|
-
right: number;
|
|
13
|
-
bottom: number;
|
|
14
|
-
};
|
|
15
|
-
declare const isElementInViewport: (el: HTMLElement) => boolean;
|
|
16
|
-
|
|
17
|
-
export { getFPS, getFiberRenderScore, getWindowDimensions, isElementInViewport, isElementVisible };
|
package/dist/score.d.ts
DELETED
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { Fiber } from 'react-reconciler';
|
|
2
|
-
|
|
3
|
-
declare const getFPS: () => number;
|
|
4
|
-
declare const getFiberRenderScore: (fiber: Fiber) => {
|
|
5
|
-
unnecessary: number;
|
|
6
|
-
slow: number;
|
|
7
|
-
};
|
|
8
|
-
declare const isElementVisible: (el: HTMLElement) => boolean;
|
|
9
|
-
declare const getWindowDimensions: () => {
|
|
10
|
-
top: number;
|
|
11
|
-
left: number;
|
|
12
|
-
right: number;
|
|
13
|
-
bottom: number;
|
|
14
|
-
};
|
|
15
|
-
declare const isElementInViewport: (el: HTMLElement) => boolean;
|
|
16
|
-
|
|
17
|
-
export { getFPS, getFiberRenderScore, getWindowDimensions, isElementInViewport, isElementVisible };
|
package/dist/score.js
DELETED
|
@@ -1,214 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license bippy
|
|
3
|
-
*
|
|
4
|
-
* Copyright (c) Aiden Bai.
|
|
5
|
-
*
|
|
6
|
-
* This source code is licensed under the MIT license found in the
|
|
7
|
-
* LICENSE file in the root directory of this source tree.
|
|
8
|
-
*/
|
|
9
|
-
|
|
10
|
-
// src/index.ts
|
|
11
|
-
var ClassComponentTag = 1;
|
|
12
|
-
var FunctionComponentTag = 0;
|
|
13
|
-
var ContextConsumerTag = 9;
|
|
14
|
-
var ForwardRefTag = 11;
|
|
15
|
-
var MemoComponentTag = 14;
|
|
16
|
-
var SimpleMemoComponentTag = 15;
|
|
17
|
-
var HostComponentTag = 5;
|
|
18
|
-
var HostHoistableTag = 26;
|
|
19
|
-
var HostSingletonTag = 27;
|
|
20
|
-
var PerformedWork = 1;
|
|
21
|
-
var Placement = 2;
|
|
22
|
-
var Hydrating = 4096;
|
|
23
|
-
var Update = 4;
|
|
24
|
-
var Cloned = 8;
|
|
25
|
-
var ChildDeletion = 16;
|
|
26
|
-
var ContentReset = 32;
|
|
27
|
-
var Snapshot = 1024;
|
|
28
|
-
var Visibility = 8192;
|
|
29
|
-
var MutationMask = Placement | Update | ChildDeletion | ContentReset | Hydrating | Visibility | Snapshot;
|
|
30
|
-
var isHostFiber = (fiber) => fiber.tag === HostComponentTag || // @ts-expect-error: it exists
|
|
31
|
-
fiber.tag === HostHoistableTag || // @ts-expect-error: it exists
|
|
32
|
-
fiber.tag === HostSingletonTag;
|
|
33
|
-
var didFiberRender = (fiber) => {
|
|
34
|
-
const nextProps = fiber.memoizedProps;
|
|
35
|
-
const prevProps = fiber.alternate?.memoizedProps || {};
|
|
36
|
-
const flags = fiber.flags ?? fiber.effectTag ?? 0;
|
|
37
|
-
switch (fiber.tag) {
|
|
38
|
-
case ClassComponentTag:
|
|
39
|
-
case FunctionComponentTag:
|
|
40
|
-
case ContextConsumerTag:
|
|
41
|
-
case ForwardRefTag:
|
|
42
|
-
case MemoComponentTag:
|
|
43
|
-
case SimpleMemoComponentTag: {
|
|
44
|
-
return (flags & PerformedWork) === PerformedWork;
|
|
45
|
-
}
|
|
46
|
-
default:
|
|
47
|
-
if (!fiber.alternate) return true;
|
|
48
|
-
return prevProps !== nextProps || fiber.alternate.memoizedState !== fiber.memoizedState || fiber.alternate.ref !== fiber.ref;
|
|
49
|
-
}
|
|
50
|
-
};
|
|
51
|
-
var didFiberCommit = (fiber) => {
|
|
52
|
-
return Boolean(
|
|
53
|
-
fiber.subtreeFlags & (MutationMask | Cloned) || fiber.deletions != null || fiber.alternate == null
|
|
54
|
-
);
|
|
55
|
-
};
|
|
56
|
-
var getMutatedHostFibers = (fiber) => {
|
|
57
|
-
const mutations = [];
|
|
58
|
-
const visited = /* @__PURE__ */ new WeakSet();
|
|
59
|
-
const traverse = (node) => {
|
|
60
|
-
if (!node || visited.has(node)) return;
|
|
61
|
-
visited.add(node);
|
|
62
|
-
if (isHostFiber(node) && didFiberCommit(node.return ?? node) && didFiberRender(node)) {
|
|
63
|
-
mutations.push(node);
|
|
64
|
-
}
|
|
65
|
-
if (node.child) {
|
|
66
|
-
traverse(node.child);
|
|
67
|
-
}
|
|
68
|
-
if (node.sibling) {
|
|
69
|
-
traverse(node.sibling);
|
|
70
|
-
}
|
|
71
|
-
};
|
|
72
|
-
traverse(fiber);
|
|
73
|
-
return mutations;
|
|
74
|
-
};
|
|
75
|
-
var getNearestHostFiber = (fiber) => {
|
|
76
|
-
let hostFiber = traverseFiber(fiber, isHostFiber);
|
|
77
|
-
if (!hostFiber) {
|
|
78
|
-
hostFiber = traverseFiber(fiber, isHostFiber, true);
|
|
79
|
-
}
|
|
80
|
-
return hostFiber;
|
|
81
|
-
};
|
|
82
|
-
var traverseFiber = (fiber, selector, ascending = false) => {
|
|
83
|
-
if (!fiber) return null;
|
|
84
|
-
if (selector(fiber) === true) return fiber;
|
|
85
|
-
let child = ascending ? fiber.return : fiber.child;
|
|
86
|
-
while (child) {
|
|
87
|
-
const match = traverseFiber(child, selector, ascending);
|
|
88
|
-
if (match) return match;
|
|
89
|
-
child = ascending ? null : child.sibling;
|
|
90
|
-
}
|
|
91
|
-
return null;
|
|
92
|
-
};
|
|
93
|
-
var NO_OP = () => {
|
|
94
|
-
};
|
|
95
|
-
var getRDTHook = () => {
|
|
96
|
-
let rdtHook = globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__;
|
|
97
|
-
const renderers = /* @__PURE__ */ new Map();
|
|
98
|
-
let i = 0;
|
|
99
|
-
rdtHook ??= {
|
|
100
|
-
checkDCE: NO_OP,
|
|
101
|
-
supportsFiber: true,
|
|
102
|
-
supportsFlight: true,
|
|
103
|
-
renderers,
|
|
104
|
-
onCommitFiberRoot: NO_OP,
|
|
105
|
-
onCommitFiberUnmount: NO_OP,
|
|
106
|
-
onPostCommitFiberRoot: NO_OP,
|
|
107
|
-
inject(renderer) {
|
|
108
|
-
const nextID = ++i;
|
|
109
|
-
renderers.set(nextID, renderer);
|
|
110
|
-
return nextID;
|
|
111
|
-
}
|
|
112
|
-
};
|
|
113
|
-
try {
|
|
114
|
-
globalThis.__REACT_DEVTOOLS_GLOBAL_HOOK__ = rdtHook;
|
|
115
|
-
} catch {
|
|
116
|
-
}
|
|
117
|
-
return rdtHook;
|
|
118
|
-
};
|
|
119
|
-
if (typeof window !== "undefined") {
|
|
120
|
-
getRDTHook();
|
|
121
|
-
}
|
|
122
|
-
|
|
123
|
-
// src/score.ts
|
|
124
|
-
var fps = 0;
|
|
125
|
-
var lastTime = performance.now();
|
|
126
|
-
var frameCount = 0;
|
|
127
|
-
var inited = false;
|
|
128
|
-
var getFPS = () => {
|
|
129
|
-
const updateFPS = () => {
|
|
130
|
-
frameCount++;
|
|
131
|
-
const now = performance.now();
|
|
132
|
-
if (now - lastTime >= 1e3) {
|
|
133
|
-
fps = frameCount;
|
|
134
|
-
frameCount = 0;
|
|
135
|
-
lastTime = now;
|
|
136
|
-
}
|
|
137
|
-
requestAnimationFrame(updateFPS);
|
|
138
|
-
};
|
|
139
|
-
if (!inited) {
|
|
140
|
-
inited = true;
|
|
141
|
-
updateFPS();
|
|
142
|
-
}
|
|
143
|
-
return fps;
|
|
144
|
-
};
|
|
145
|
-
var truncateFloat = (value, maxLen = 1e4) => {
|
|
146
|
-
if (typeof value === "number" && parseInt(value) !== value) {
|
|
147
|
-
value = ~~(value * maxLen) / maxLen;
|
|
148
|
-
}
|
|
149
|
-
return value;
|
|
150
|
-
};
|
|
151
|
-
var THRESHOLD_FPS = 60;
|
|
152
|
-
var getFiberRenderScore = (fiber) => {
|
|
153
|
-
const hostFiber = getNearestHostFiber(fiber);
|
|
154
|
-
const hasMutation = didFiberCommit(fiber);
|
|
155
|
-
const mutatedHostFibers = getMutatedHostFibers(fiber);
|
|
156
|
-
const isVisible = hostFiber && isElementVisible(hostFiber.stateNode) && isElementInViewport(hostFiber.stateNode);
|
|
157
|
-
const fps2 = getFPS();
|
|
158
|
-
let unnecessaryScore = (
|
|
159
|
-
// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
|
|
160
|
-
isVisible || mutatedHostFibers.length || hasMutation ? 0 : 1
|
|
161
|
-
);
|
|
162
|
-
for (const mutatedHostFiber of mutatedHostFibers) {
|
|
163
|
-
const node = mutatedHostFiber.stateNode;
|
|
164
|
-
if (!isElementVisible(node) || !isElementInViewport(node)) {
|
|
165
|
-
unnecessaryScore += 1 / mutatedHostFibers.length;
|
|
166
|
-
}
|
|
167
|
-
}
|
|
168
|
-
return {
|
|
169
|
-
unnecessary: truncateFloat(unnecessaryScore),
|
|
170
|
-
slow: fps2 < THRESHOLD_FPS ? truncateFloat((THRESHOLD_FPS - fps2) / THRESHOLD_FPS) : 0
|
|
171
|
-
};
|
|
172
|
-
};
|
|
173
|
-
var isElementVisible = (el) => {
|
|
174
|
-
const style = window.getComputedStyle(el);
|
|
175
|
-
return style.display !== "none" && style.visibility !== "hidden" && style.contentVisibility !== "hidden" && style.opacity !== "0";
|
|
176
|
-
};
|
|
177
|
-
var initedEventListeners = false;
|
|
178
|
-
var scrollX = null;
|
|
179
|
-
var scrollY = null;
|
|
180
|
-
var innerWidth = null;
|
|
181
|
-
var innerHeight = null;
|
|
182
|
-
var getWindowDimensions = () => {
|
|
183
|
-
if (scrollX === null) scrollX = window.scrollX;
|
|
184
|
-
if (scrollY === null) scrollY = window.scrollY;
|
|
185
|
-
if (innerWidth === null) innerWidth = window.innerWidth;
|
|
186
|
-
if (innerHeight === null) innerHeight = window.innerHeight;
|
|
187
|
-
if (!initedEventListeners) {
|
|
188
|
-
initedEventListeners = true;
|
|
189
|
-
const handleResize = () => {
|
|
190
|
-
scrollX = null;
|
|
191
|
-
scrollY = null;
|
|
192
|
-
innerWidth = null;
|
|
193
|
-
innerHeight = null;
|
|
194
|
-
};
|
|
195
|
-
window.addEventListener("resize", handleResize);
|
|
196
|
-
window.addEventListener("scroll", handleResize);
|
|
197
|
-
}
|
|
198
|
-
return {
|
|
199
|
-
top: scrollY,
|
|
200
|
-
left: scrollX,
|
|
201
|
-
right: scrollX + innerWidth,
|
|
202
|
-
bottom: scrollY + innerHeight
|
|
203
|
-
};
|
|
204
|
-
};
|
|
205
|
-
var isElementInViewport = (el) => {
|
|
206
|
-
const elTop = el.offsetTop;
|
|
207
|
-
const elLeft = el.offsetLeft;
|
|
208
|
-
const elWidth = el.offsetWidth;
|
|
209
|
-
const elHeight = el.offsetHeight;
|
|
210
|
-
const { top, left, right, bottom } = getWindowDimensions();
|
|
211
|
-
return elTop + elHeight > top && elLeft + elWidth > left && elTop < bottom && elLeft < right;
|
|
212
|
-
};
|
|
213
|
-
|
|
214
|
-
export { getFPS, getFiberRenderScore, getWindowDimensions, isElementInViewport, isElementVisible };
|