Add queue
operator
#167
Replies: 7 comments 4 replies
-
I think, it's better to start with a cancellable (abort) #154 What so you think? |
Beta Was this translation helpful? Give feedback.
-
I suggest you first discuss the problem you are solving with this method. |
Beta Was this translation helpful? Give feedback.
-
I suggest a shorthand for this: const fx = queue({
getKey: (p) => p.id,
signal: cancel,
async effect(p, {onAbort}) {
}
}) |
Beta Was this translation helpful? Give feedback.
-
Hey everyone, I am sharing my tests with queues and concurrency support: https://share.effector.dev/EIThdjrq Initialization: const queue = createQueue({ concurrency: 4 });
const fx = createEffect(async ({ params: { time }, signal }) => {
await new Promise((r, e) => {
setTimeout(r, 3000);
});
console.log(`Finished: ${n}`, time);
return time;
});
const $time = createStore(1000);
const abort = queue({
source: $time,
fn: (time) => ({ time }),
effect: fx
}); Abort & Retry: const fx = createEffect(async ({ params: { time }, signal }) => {
await new Promise((r, e) => {
signal.onabort = () => {
e(`Aborted`);
};
setTimeout(r, 3000);
});
console.log(`Finished: ${n}`, time);
return time;
});
fx.fail.watch(({ params, error }) => {
console.error(`Aborted: ${n}`, error, params);
if (params.retry) {
params.retry();
}
});
const abort = queue({
source: $var,
fn: (time) => ({ time }),
effect: fx
});
if (n % 4 === 0 && n > 0) {
fx.watch(({ retryAttempts }) => {
if (retryAttempts < 2) {
setTimeout(() => {
abort();
}, 1500);
}
});
} |
Beta Was this translation helpful? Give feedback.
-
What about a queue length? To make N-parallel requests |
Beta Was this translation helpful? Give feedback.
-
I found performance issues in the previous example, Summary
Example: https://share.effector.dev/OPrqooUV queue() returns event: sample({
clock: addToQueue,
fn: () => ({ n: "text" }),
target: queue({
source: $time,
fn: (time) => ({ time }),
target: fetchDataFx,
}),
});
forward({
from: addToQueue,
to: queue({
source: $time,
fn: (time) => ({ time }),
target: fetchDataFx,
}),
}); Abort: const abort = createEvent();
const add = queue({
priority: 1,
target: actionFx,
abort,
});
add();
sample({
clock: cancel,
filter: () => true,
target: abort,
}); |
Beta Was this translation helpful? Give feedback.
-
New API, I decided to remove source/params/fn from the queue and take priority from the parameters, it's possible to use it together with the sample: const queue = createQueue({ concurrency: 4 });
const add = queue({
target: taskFx,
});
add({ priority: 1, paramA: 1 }); or const addAllTasksToQueue = createEvent();
sample({
clock: addAllTasksToQueue,
source: $time,
fn: (time) => ({
time,
priority: 1,
}),
target: queue({
target: taskFx,
}),
});
addAllTasksToQueue(); Also possible to abort different effects using one abort event and match it using filterMap: sample({
clock: addAllTasksToQueue,
source: $time,
fn: (time) => ({
time,
n,
priority: n,
}),
target: queue({
target: taskFx,
abort: clickRowIndex,
abortFilter: (index, {n}) => index === n // Compares clickRowIndex event args with fx params
}),
});
setTimeout(() => abortByIndex(n), 500); Playground: https://share.effector.dev/qwdhnJpQ |
Beta Was this translation helpful? Give feedback.
-
Queue
queue
operator to setup queue of effectsLive example:
https://share.effector.dev/6fS9dyqn
Possible api, if there is a need of more control over a queue:
https://share.effector.dev/kPeWAIRZ
in possible combination with abort
UPD:
Updated snippet after meeting the real-world usecase:
https://share.effector.dev/7cmyUIyT
It turns out that we might need few separate queues + many different effects for each queue, so this api consists of two steps:
where each effect works described earlier
Beta Was this translation helpful? Give feedback.
All reactions