@xstate/react - npm Package Compare versions

Comparing version 0.0.3 to 0.1.0

lib/index.js

@@ -24,5 +24,8 @@ "use strict";
     var _a = __read(react_1.useState(machine.initialState), 2), current = _a[0], setCurrent = _a[1];
-    // Start the service (only once!)
-    var service = react_1.useMemo(function () {
-        return xstate_1.interpret(machine, options).onTransition(function (state) {
+    // Reference the service
+    var serviceRef = react_1.useRef(null);
+    // Create the service only once
+    // See https://reactjs.org/docs/hooks-faq.html#how-to-create-expensive-objects-lazily
+    var service = serviceRef.current ||
+        ((serviceRef.current = xstate_1.interpret(machine, options).onTransition(function (state) {
             // Update the current machine state when a transition occurs
@@ -32,8 +35,9 @@ if (state.changed) {
             }
-        });
-    }, []);
-    // Stop the service when the component unmounts
+        })),
+            serviceRef.current);
     react_1.useEffect(function () {
+        // Start the service when the component mounts
         service.start();
         return function () {
+            // Stop the service when the component unmounts
             service.stop();
@@ -40,0 +44,0 @@ };

package.json

 {
   "name": "@xstate/react",
-  "version": "0.0.3",
+  "version": "0.1.0",
   "description": "XState tools for React",
@@ -5,0 +5,0 @@ "keywords": [

No alert changes

Improved metrics

Total package byte prevSize

7420

increased by3.53%

Lines of code

71

increased by5.97%

No dependency changes