memoize parsed text labels

src/App/App.tsx

@@ -150,7 +150,7 @@ export function App() {
   }, [setTrace, setTime]);
 
   // raise input event, producing a new runtime configuration (or a runtime error)
-  function onRaise(inputEvent: string, param: any) {
+  const onRaise = (inputEvent: string, param: any) => {
     if (trace !== null && ast.inputEvents.some(e => e.event === inputEvent)) {
       const config = current(trace);
       if (config.kind === "bigstep") {
@@ -158,7 +158,7 @@ export function App() {
         produceNextConfig(simtime, {kind: "input", name: inputEvent, param}, config);
       }
     }
-  }
+  };
   // timer elapse events are triggered by a change of the simulated time (possibly as a scheduled JS event loop timeout)
   useEffect(() => {
     let timeout: NodeJS.Timeout | undefined;
@@ -219,6 +219,7 @@ export function App() {
         ...trace!.trace.slice(0, trace!.idx+1), // remove everything after current item
         newItem,
       ],
+      // idx: 0,
       idx: trace!.idx+1,
     }));
     scrollDownSidebar();

src/App/TextDialog.tsx

@@ -1,6 +1,6 @@
 import { Dispatch, ReactElement, SetStateAction, useState, KeyboardEvent, useEffect, useRef } from "react";
 
-import { parse as parseLabel } from "../statecharts/label_parser";
+import { cachedParseLabel } from "@/statecharts/parser";
 
 export function TextDialog(props: {setModal: Dispatch<SetStateAction<ReactElement|null>>, text: string, done: (newText: string|undefined) => void}) {
   const [text, setText] = useState(props.text);
@@ -22,7 +22,7 @@ export function TextDialog(props: {setModal: Dispatch<SetStateAction<ReactElemen
 
   let parseError = "";
   try {
-    parseLabel(text);
+    cachedParseLabel(text);
   } catch (e) {
     // @ts-ignore
     parseError = e.message;