Refactored & optimized useAsyncCallback hook;

Author: DigitalBrainJS

Diff for: .npmignore

@@ -1,2 +1,3 @@
 *
-!dist/**
+!lib/**
+!use-async-effect.d.ts

Diff for: README.md

@@ -6,9 +6,9 @@
 
 ## useAsyncEffect2 :snowflake:
 
-This library provides asynchronous versions of the `useEffect` and` useCallback` React hooks that can cancel
-asynchronous code inside it due to timeouts, user requests, or automatically when a component is unmounted or some
-dependency has changed.
+This library makes it possible to use cancellable async effects inside React components by providing asynchronous
+versions of the `useEffect` and` useCallback` hooks. These hooks can cancel asynchronous code inside it due to timeouts,
+user requests, or automatically when a component is unmounted or some dependency has changed.
 
 The library is designed to make it as easy as possible to use complex and composite asynchronous routines 
 in React components. It works on top of a [custom cancellable promise](https://www.npmjs.com/package/c-promise2),

Diff for: lib/use-async-effect.js

@@ -182,6 +182,64 @@ const useAsyncEffect = (generator, options) => {
 
 const argsToPromiseMap = new Map();
 
+const asyncEffectFactory= (options) => {
+    if (options != null) {
+        if (typeof options !== 'object') {
+            throw TypeError('options must be an object');
+        }
+
+        if (options.threads === undefined) {
+            options.threads = options.cancelPrevious || options.states ? 1 : 0;
+        } else {
+            if (!Number.isFinite(options.threads) || options.threads < 0) {
+                throw Error('threads must be a positive number');
+            }
+
+            if (options.states && options.threads !== 1) {
+                throw Error(`Can not use states in not single threaded async function`);
+            }
+        }
+
+        if (options.queueSize !== undefined && (!Number.isFinite(options.queueSize) || options.queueSize < -1)) {
+            throw Error('queueSize must be a finite number >=-1');
+        }
+    }
+
+    const promises= [];
+
+    return {
+        promises,
+        queue: [],
+        pending: 0,
+        args: null,
+        cancel : (reason) => {
+            const _reason = isEvent(reason) ? undefined : reason;
+            promises.forEach(promise => promise.cancel(_reason));
+            promises.length = 0;
+        },
+        pause: (data)=> promises.forEach(promise=> promise.pause(data)),
+        resume: (data)=> promises.forEach(promise=> promise.resume(data)),
+        initialState: {
+            done: false,
+            result: undefined,
+            error: undefined,
+            canceled: false,
+            pending: false
+        },
+        options: {
+            deps: [],
+            combine: false,
+            cancelPrevious: false,
+            threads: 0,
+            queueSize: -1,
+            scopeArg: false,
+            states: false,
+            catchErrors: false,
+            ...(Array.isArray(options) ? {deps: options} : options)
+        }
+    };
+}
+
 /**
  * @typedef {Function} UseAsyncCallbackDecoratedFn
  * @param {CPromise} [scope]
@@ -214,65 +272,32 @@ const argsToPromiseMap = new Map();
  * @returns {UseAsyncCallbackDecoratedFn}
  */
 const useAsyncCallback = (generator, options) => {
-    if (options != null && typeof options !== 'object') {
-        throw TypeError('options must be an object or array');
-    }
-
-    const initialState = {
-        done: false,
-        result: undefined,
-        error: undefined,
-        canceled: false,
-        pending: false
-    };
-
-    const {current} = useRef({
-        promises: [],
-        queue: [],
-        pending: 0,
-        args: null,
-        callback: null
-    });
+    const current = useFactory(asyncEffectFactory, [options]);
 
     let {
-        deps = [],
-        combine = false,
-        cancelPrevious = false,
-        threads,
-        queueSize = -1,
-        scopeArg = false,
-        states = false,
-        catchErrors = false
-    } = options && Array.isArray(options) ? {deps: options} : options || {};
-
-    if (threads === undefined) {
-        threads = cancelPrevious || states ? 1 : 0;
-    } else {
-        if (!Number.isFinite(threads) || threads < 0) {
-            throw Error('threads must be a positive number');
+        initialState,
+        options: {
+            deps,
+            combine,
+            cancelPrevious,
+            threads,
+            queueSize,
+            scopeArg,
+            states,
+            catchErrors
         }
-    }
-
-    if (queueSize !== -1 && (!Number.isFinite(queueSize) || queueSize < -1)) {
-        throw Error('queueSize must be a finite number >=-1');
-    }
+    } = current;
 
     const [state, setState] = states ? useAsyncDeepState(initialState, {watch: false}) : [];
 
-    const singleThreaded = threads === 1;
-
     const callback = useMemo(() => {
-        const {promises, queue}= current;
-
-        const cancel = (reason) => {
-            const _reason = isEvent(reason) ? undefined : reason;
-            promises.forEach(promise => promise.cancel(_reason));
-            promises.length = 0;
-        };
-
-        const pause= (data)=> promises.forEach(promise=> promise.pause(data));
-
-        const resume= (data)=> promises.forEach(promise=> promise.resume(data));
+        const {
+            promises,
+            queue,
+            cancel,
+            pause,
+            resume
+        } = current;
 
         const fn = (...args) => {
             let n;
@@ -304,7 +329,7 @@ const useAsyncCallback = (generator, options) => {
 
                         started = true;
 
-                        if (states && singleThreaded) {
+                        if (states) {
                             setState({
                                 ...initialState,
                                 pending: true,
@@ -335,7 +360,7 @@ const useAsyncCallback = (generator, options) => {
                         return;
                     }
 
-                    states && singleThreaded && setState({
+                    states && setState({
                         pending: false,
                         done: true,
                         error: isRejected ? value : undefined,
@@ -346,7 +371,7 @@ const useAsyncCallback = (generator, options) => {
                     return isRejected ? undefined : value;
                 }).weight(0).aggregate();
 
-                if(states && singleThreaded){
+                if(states){
                     promise.onPause(()=> setState({
                         paused: true
                     }))
@@ -379,59 +404,72 @@ const useAsyncCallback = (generator, options) => {
             return promise;
         }
 
+        if(states) {
+            const makeDescriptor = (name) => ({
+                get() {
+                    return state[name];
+                }
+            })
+
+            Object.defineProperties(fn, {
+                done: makeDescriptor('done'),
+                pending: makeDescriptor('pending'),
+                result: makeDescriptor('result'),
+                error: makeDescriptor('error'),
+                canceled: makeDescriptor('canceled'),
+                paused: makeDescriptor('paused'),
+                [Symbol.iterator]: {
+                    value: function*() {
+                        yield* [
+                            fn,
+                            cancel,
+                            state.pending,
+                            state.done,
+                            state.result,
+                            state.error,
+                            state.canceled,
+                            state.paused
+                        ];
+                    }
+                }
+            })
+        } else{
+            fn[Symbol.iterator] = function*() {
+                yield* [fn, cancel];
+            }
+        }
+
         fn.cancel = cancel;
 
         fn.pause= pause;
 
         fn.resume= resume;
 
-        current.callback= fn;
-
-        Object.defineProperty(fn, 'current', {
-           get(){
-               return current.callback;
-           },
-           configurable: true
-        });
-
         return fn;
     }, deps);
 
     useEffect(() => {
         return () => callback.cancel(E_REASON_UNMOUNTED);
-    }, deps);
-
-    if(states) {
-        if(!singleThreaded){
-            throw Error(`Can not use states in not single threaded async function`);
-        }
-        callback.done = state.done;
-        callback.pending = state.pending;
-        callback.result = state.result;
-        callback.error = state.error;
-        callback.canceled = state.canceled;
-        callback.paused = state.paused;
-
-        callback[Symbol.iterator] = function*() {
-            yield* [
-              callback,
-              callback.cancel,
-              state.pending,
-              state.done,
-              state.result,
-              state.error,
-              state.canceled,
-              state.paused
-            ];
-        }
-    } else{
-        callback[Symbol.iterator] = function*() {
-            yield* [callback, callback.cancel];
-        }
-    }
+    }, []);
 
     return callback;
 }
+
+const initialized= new WeakSet();
+
+const useFactory = (factory, args) => {
+    const {current} = useRef({});
+
+    if (initialized.has(current)) return current;
+
+    initialized.add(current);
+
+    Object.assign(current, factory.apply(null, args));
+
+    return current;
+}
+
+
 /**
  * useAsyncDeepState hook whose setter returns a promise
  * @param {*} [initialValue]

Diff for: package.json

@@ -1,7 +1,7 @@
 {
   "name": "use-async-effect2",
   "version": "0.11.2",
-  "description": "Asynchronous versions of the `useEffect` and` useCallback` hooks that able to cancel internal code by user requests or component unmounting",
+  "description": "Asynchronous & promisified versions of the `useEffect`, `useCallback` and `useState` hooks that able to cancel internal code on user requests or component unmounting",
   "main": "lib/use-async-effect.js",
   "scripts": {
     "test": "npm run test:build && mocha-headless-chrome -f test/test.html",
@@ -23,10 +23,16 @@
   },
   "license": "MIT",
   "keywords": [
-    "React",
+    "react",
+    "reactjs",
     "hook",
+    "hooks",
     "useEffect",
     "useCallback",
+    "useAsyncEffect",
+    "use-async-effect",
+    "async",
+    "deepstate",
     "setState",
     "promise",
     "c-promise",
@@ -41,9 +47,9 @@
     "abort",
     "AbortController",
     "AbortSignal",
-    "async",
     "signal",
     "await",
+    "wait",
     "promises",
     "generator",
     "co",
@@ -54,7 +60,6 @@
     "delay",
     "break",
     "suspending",
-    "wait",
     "bluebird",
     "deferred",
     "react",
@@ -63,8 +68,7 @@
     "close",
     "closable",
     "pause",
-    "task",
-    "reactjs"
+    "task"
   ],
   "repository": "https://github.com/DigitalBrainJS/use-async-effect.git",
   "bugs": {