Why UI Kit ModalDialog component is so slow, about 10 seconds to respond

Hi Community,

I found the response time is so long for ModalDialog (about 10 seconds for onClose event). Anyone knows how to improve the speed?

 const App = () => {
  const [isOpen, setOpen] = useState(false);
  return (
    <Fragment>
      <Button text="Show modal" onClick={() => setOpen(true)} />
      {isOpen && (
        <ModalDialog header="My modal dialog" onClose={() => setOpen(false)}>
          <Text>Hello there!</Text>
        </ModalDialog>
      )}
    </Fragment>
  );
};

Thanks,
YY1

Hi, may I know if anyone also had this issue and how to resolve it? Thanks,

Hey @YY1,

the example looks like you are using UI Kit 1, which is slow, since state changes are calculated in Atlassian’s backend.
Have you tried migrating to the new version of UI Kit (2), now only called UI Kit: https://developer.atlassian.com/platform/forge/ui-kit/? Here the UI “runs” client side.