Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 618de24

Browse files
revert useCompInstance optimisations
1 parent 520fd0c commit 618de24

File tree

2 files changed

+20
-73
lines changed

2 files changed

+20
-73
lines changed

‎client/packages/lowcoder/src/comps/utils/useCompInstance.test.tsx‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -67,8 +67,7 @@ test("nestDispatchHandler", () => {
6767
const handler = nestDispatchHandlerGenerator();
6868
const result: string[] = [];
6969
const dispatch = (action: CompAction) => {
70-
const [handleAction] = handler;
71-
handleAction(action, (a: CompAction) => {
70+
handler(action, (a) => {
7271
if (a.type !== CompActionTypes.CHANGE_VALUE) {
7372
return;
7473
}
@@ -107,4 +106,4 @@ test("nestDispatchHandler", () => {
107106
"start7",
108107
"end7",
109108
]);
110-
});
109+
});

‎client/packages/lowcoder/src/comps/utils/useCompInstance.tsx‎

Lines changed: 18 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
import { debounce } from "lodash";
99
import log from "loglevel";
1010
import { CompAction, CompActionTypes, CompConstructor } from "lowcoder-core";
11-
import { useEffect, useMemo, useRef,useState } from "react";
11+
import { useEffect, useMemo, useState } from "react";
1212
import { PriorityQueue, Queue } from "typescript-collections";
1313
import { JSONValue } from "util/jsonTypes";
1414
import {
@@ -78,14 +78,7 @@ export function actionHandlerGenerator() {
7878
ratio: ((1 - statsData.groups / statsData.total) * 100).toFixed(2) + "%",
7979
};
8080
};
81-
82-
const cleanup = () => {
83-
while (deferQueue.size() > 0) {
84-
deferQueue.dequeue();
85-
}
86-
};
87-
88-
return [actionHandler, stats, cleanup] as const;
81+
return [actionHandler, stats] as const;
8982
}
9083

9184
// Reduce the nested dispatch in call order, then evaluate to update comp once.
@@ -99,8 +92,8 @@ export function nestDispatchHandlerGenerator() {
9992
const diff = a.depth - b.depth;
10093
return diff !== 0 ? diff : b.seq - a.seq;
10194
});
102-
103-
constdispatchHandler=(action: CompAction,reduceFn: (action: CompAction)=>void)=>{
95+
return(action: CompAction,reduceFn: (action: CompAction)=>void)=>{
96+
// Find the nested dispatch action, add it to the queue, and execute reduce later
10497
if (depth > 0) {
10598
++seq;
10699
queue.enqueue({ action, depth, seq });
@@ -118,14 +111,6 @@ export function nestDispatchHandlerGenerator() {
118111
depth = 0;
119112
seq = 0;
120113
};
121-
122-
const cleanup = () => {
123-
while (queue.size() > 0) {
124-
queue.dequeue();
125-
}
126-
};
127-
128-
return [dispatchHandler, cleanup] as const;
129114
}
130115

131116
type CompContainerChangeHandler = (actions?: CompAction[]) => void;
@@ -161,8 +146,8 @@ export function getCompContainer<T extends CompConstructor>(params: GetContainer
161146
if (!initialValue || !isReady) {
162147
return null;
163148
}
164-
const [actionHandler, stats,cleanupActionHandler] = actionHandlerGenerator();
165-
const [nestDispatchHandler,cleanupNestDispatch] = nestDispatchHandlerGenerator();
149+
const [actionHandler, stats] = actionHandlerGenerator();
150+
const nestDispatchHandler = nestDispatchHandlerGenerator();
166151

167152
class CompContainer {
168153
comp: InstanceType<T>;
@@ -173,10 +158,6 @@ export function getCompContainer<T extends CompConstructor>(params: GetContainer
173158
initializing: boolean = false;
174159

175160
private changeListeners: CompContainerChangeHandler[] = [];
176-
private clearQueueTimerHandle = 0;
177-
private appCalmDownTimerHandle = 0;
178-
private appCalmDowned = false;
179-
private idleCallbackId: number | null = null;
180161

181162
constructor() {
182163
this.dispatch = this.dispatch.bind(this);
@@ -201,6 +182,10 @@ export function getCompContainer<T extends CompConstructor>(params: GetContainer
201182
return this.comp;
202183
}
203184

185+
clearQueueTimerHandle = 0;
186+
appCalmDownTimerHandle = 0;
187+
appCalmDowned = false;
188+
204189
dispatch(action?: CompAction) {
205190
if (!this.initialized) {
206191
throw new Error("comp container is not initialized");
@@ -291,29 +276,6 @@ export function getCompContainer<T extends CompConstructor>(params: GetContainer
291276
// FIXME: Check it out, why does it take 30ms to change the code editor, and only 1ms for others
292277
showCost("setComp", () => this.changeListeners.forEach((x) => x(actions)));
293278
}
294-
295-
cleanup() {
296-
// Clear timers
297-
if (this.clearQueueTimerHandle) {
298-
clearTimeout(this.clearQueueTimerHandle);
299-
}
300-
if (this.appCalmDownTimerHandle) {
301-
clearTimeout(this.appCalmDownTimerHandle);
302-
}
303-
if (this.idleCallbackId !== null) {
304-
cancelIdleCallback(this.idleCallbackId);
305-
}
306-
307-
// Clear queues
308-
cleanupActionHandler();
309-
cleanupNestDispatch();
310-
311-
// Clear listeners
312-
this.changeListeners = [];
313-
314-
// Clear comp reference
315-
this.comp = null as any;
316-
}
317279
}
318280

319281
return new CompContainer();
@@ -330,42 +292,28 @@ export function useCompInstance<T extends CompConstructor>(
330292
) {
331293
const [comp, setComp] = useState<InstanceType<T> | null>(null);
332294
const container = useCompContainer(params);
333-
const mountedRef = useRef(true);
334295

335-
useEffect(() => {
336-
return () => {
337-
mountedRef.current = false;
338-
};
339-
}, []);
296+
if (container && !container.initialized) {
297+
container.init().then(setComp);
298+
}
340299

341300
useEffect(() => {
342301
if (!container) {
343302
return () => {};
344303
}
345304

346-
if (!container.initialized) {
347-
container.init().then((comp) => {
348-
if (mountedRef.current) {
349-
setComp(comp);
350-
}
351-
});
352-
}
305+
let updateHandler = () => setComp(container.comp);
353306

354-
constupdateHandler=debounce(()=> {
355-
if(mountedRef.current) {
307+
// if (UPDATE_ROOT_VIEW_DEBOUNCE > 0) {
308+
updateHandler=debounce(()=> {
356309
setComp(container.comp);
357-
}
358-
},UPDATE_ROOT_VIEW_DEBOUNCE||50);
310+
},50/* UPDATE_ROOT_VIEW_DEBOUNCE */);
311+
// }
359312

360313
const finalHandlers = [...(handlers || []), updateHandler];
361314
finalHandlers.forEach((handler) => container.addChangeListener(handler));
362-
363315
return () => {
364316
finalHandlers.forEach((handler) => container.removeChangeListener(handler));
365-
updateHandler.cancel();
366-
if (container) {
367-
container.cleanup();
368-
}
369317
};
370318
}, [container, handlers]);
371319

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /