react-hooks-worker - npm Package Compare versions

Comparing version 0.8.0 to 0.9.0

CHANGELOG.md

 # Change Log
 
 ## [Unreleased]
+
+## [0.9.0] - 2019-10-18
 ### Changed
+- Refactor to useState instead of useReducer (smaller size)
+
+## [0.8.0] - 2019-08-18
+### Changed
 - BREAKING CHANGE: worker-based API (#10)
@@ -6,0 +12,0 @@

dist/useWorker.js

@@ -13,2 +13,4 @@ "use strict";
 
+require("core-js/modules/es.date.to-string");
+
 require("core-js/modules/es.object.define-property");
@@ -18,2 +20,4 @@
 
+require("core-js/modules/es.regexp.to-string");
+
 require("core-js/modules/es.string.iterator");
@@ -34,44 +38,13 @@
 
-function _iterableToArrayLimit(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-var initialState = {
-  result: null,
-  error: null
-};
+var initialState = {};
 
-var reducer = function reducer(state, action) {
-  switch (action.type) {
-    case 'init':
-      return initialState;
-
-    case 'result':
-      return {
-        result: action.result,
-        error: null
-      };
-
-    case 'error':
-      return {
-        result: null,
-        error: 'error'
-      };
-
-    case 'messageerror':
-      return {
-        result: null,
-        error: 'messageerror'
-      };
-
-    default:
-      throw new Error('no such action type');
-  }
-};
-
 var useWorker = function useWorker(createWorker, input) {
-  var _useReducer = (0, _react.useReducer)(reducer, initialState),
-      _useReducer2 = _slicedToArray(_useReducer, 2),
-      state = _useReducer2[0],
-      dispatch = _useReducer2[1];
+  var _useState = (0, _react.useState)(initialState),
+      _useState2 = _slicedToArray(_useState, 2),
+      state = _useState2[0],
+      setState = _useState2[1];
 
@@ -83,9 +56,8 @@ var worker = (0, _react.useMemo)(createWorker, [createWorker]);
 
-    var dispatchSafe = function dispatchSafe(action) {
-      return dispatch(action);
+    var setStateSafe = function setStateSafe(nextState) {
+      return setState(nextState);
     };
 
     worker.onmessage = function (e) {
-      return dispatchSafe({
-        type: 'result',
+      return setStateSafe({
         result: e.data
@@ -96,4 +68,4 @@ });
     worker.onerror = function () {
-      return dispatchSafe({
-        type: 'error'
+      return setStateSafe({
+        error: 'error'
       });
@@ -103,4 +75,4 @@ };
     worker.onmessageerror = function () {
-      return dispatchSafe({
-        type: 'messageerror'
+      return setStateSafe({
+        error: 'messageerror'
       });
@@ -110,11 +82,9 @@ };
     var cleanup = function cleanup() {
-      dispatchSafe = function dispatchSafe() {
+      setStateSafe = function setStateSafe() {
         return null;
-      }; // we should not dispatch after cleanup.
+      }; // we should not setState after cleanup.
 
 
       worker.terminate();
-      dispatch({
-        type: 'init'
-      });
+      setState(initialState);
     };
@@ -121,0 +91,0 @@

package.json

 {
   "name": "react-hooks-worker",
   "description": "React custom hooks for web workers",
-  "version": "0.8.0",
+  "version": "0.9.0",
   "author": "Daishi Kato",
@@ -38,31 +38,30 @@ "repository": {
   "devDependencies": {
-    "@babel/cli": "^7.5.5",
-    "@babel/core": "^7.5.5",
-    "@babel/preset-env": "^7.5.5",
-    "@babel/preset-react": "^7.0.0",
-    "@types/react": "^16.9.2",
-    "@types/react-dom": "^16.8.5",
-    "@typescript-eslint/eslint-plugin": "^2.0.0",
-    "@typescript-eslint/parser": "^2.0.0",
+    "@babel/cli": "^7.6.4",
+    "@babel/core": "^7.6.4",
+    "@babel/preset-env": "^7.6.3",
+    "@babel/preset-react": "^7.6.3",
+    "@types/react": "^16.9.9",
+    "@types/react-dom": "^16.9.2",
+    "@typescript-eslint/eslint-plugin": "^2.4.0",
+    "@typescript-eslint/parser": "^2.4.0",
     "babel-core": "^7.0.0-bridge.0",
-    "babel-eslint": "^10.0.2",
     "babel-loader": "^8.0.6",
-    "core-js": "^3.2.1",
-    "eslint": "^6.1.0",
+    "core-js": "^3.3.2",
+    "eslint": "^6.5.1",
     "eslint-config-airbnb": "^18.0.1",
     "eslint-plugin-import": "^2.18.2",
     "eslint-plugin-jsx-a11y": "^6.2.3",
-    "eslint-plugin-react": "^7.14.3",
-    "eslint-plugin-react-hooks": "^1.7.0",
+    "eslint-plugin-react": "^7.16.0",
+    "eslint-plugin-react-hooks": "^2.1.2",
     "html-webpack-plugin": "^3.2.0",
     "jest": "^24.9.0",
-    "react": "^16.9.0",
-    "react-dom": "^16.9.0",
-    "react-test-renderer": "^16.9.0",
-    "ts-loader": "^6.0.4",
-    "typescript": "^3.5.3",
-    "webpack": "^4.39.2",
-    "webpack-cli": "^3.3.6",
-    "webpack-dev-server": "^3.8.0",
-    "worker-plugin": "^3.1.0"
+    "react": "^16.10.2",
+    "react-dom": "^16.10.2",
+    "react-test-renderer": "^16.10.2",
+    "ts-loader": "^6.2.0",
+    "typescript": "^3.6.4",
+    "webpack": "^4.41.2",
+    "webpack-cli": "^3.3.9",
+    "webpack-dev-server": "^3.8.2",
+    "worker-plugin": "^3.2.0"
   },
@@ -69,0 +68,0 @@ "peerDependencies": {

README.md

@@ -106,1 +106,2 @@ # react-hooks-worker
 - [Playing with React Hooks and Web Workers](https://blog.axlight.com/posts/playing-with-react-hooks-and-web-workers/)
+- [How I Developed React Hooks for Web Workers](https://blog.axlight.com/posts/how-i-developed-react-hooks-for-web-workers/)

src/index.d.ts

@@ -5,4 +5,4 @@ export type UseWorker = <Result>(
 ) => {
-  result: Result | null;
-  error: 'error' | 'messageerror' | null;
+  result?: Result;
+  error?: 'error' | 'messageerror';
 };
@@ -9,0 +9,0 @@

src/useWorker.js

@@ -5,23 +5,9 @@ import {
   useRef,
-  useReducer,
+  useState,
 } from 'react';
 
-const initialState = { result: null, error: null };
-const reducer = (state, action) => {
-  switch (action.type) {
-    case 'init':
-      return initialState;
-    case 'result':
-      return { result: action.result, error: null };
-    case 'error':
-      return { result: null, error: 'error' };
-    case 'messageerror':
-      return { result: null, error: 'messageerror' };
-    default:
-      throw new Error('no such action type');
-  }
-};
+const initialState = {};
 
 export const useWorker = (createWorker, input) => {
-  const [state, dispatch] = useReducer(reducer, initialState);
+  const [state, setState] = useState(initialState);
   const worker = useMemo(createWorker, [createWorker]);
@@ -31,10 +17,10 @@ const lastWorker = useRef(null);
     lastWorker.current = worker;
-    let dispatchSafe = action => dispatch(action);
-    worker.onmessage = e => dispatchSafe({ type: 'result', result: e.data });
-    worker.onerror = () => dispatchSafe({ type: 'error' });
-    worker.onmessageerror = () => dispatchSafe({ type: 'messageerror' });
+    let setStateSafe = nextState => setState(nextState);
+    worker.onmessage = e => setStateSafe({ result: e.data });
+    worker.onerror = () => setStateSafe({ error: 'error' });
+    worker.onmessageerror = () => setStateSafe({ error: 'messageerror' });
     const cleanup = () => {
-      dispatchSafe = () => null; // we should not dispatch after cleanup.
+      setStateSafe = () => null; // we should not setState after cleanup.
       worker.terminate();
-      dispatch({ type: 'init' });
+      setState(initialState);
     };
@@ -41,0 +27,0 @@ return cleanup;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Dev dependency count

28

decreased by-3.45%

Number of lines in readme file

107

increased by0.94%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

18410

decreased by-3.04%

Lines of code

287

decreased by-12.5%

No dependency changes