Why is this package eating all my memory?

[wkd-kapsule]

Hi! I stumbled on your package thinking I found exactly what I needed: a monaco-editor wrapper that would let me use TextMate to customize the theme. I've been building my own tsx tokenizer for 2 days, deep in the Regex hell.

But now that I try your package, even the most minimal implementation will eat up all my memory and the server will never resolve. My project is of a decent size but without your packages, Node.js takes around 2 GB of memory. With them, Node.js goes up to 10 GB before I kill it, unless I want my pc to crash... Might it be related to me using Next.js as a framework?

Any help would be greatly appreciated!

export const CodeEditor = () => {
  // {...} some files management here

  const [isReady, setIsReady] = useState(false)
  
  useEffect(() => {
    initialize.then(() => setIsReady(true))
  }, [])
  
  return (
    isReady && (
      <Edit
        programmingLanguage={currentFile.lang}
        fileUri={currentFile.path}
        height={'75vh'}
        onChange={code => (currentFile.code = code)}
        options={{
          cursorWidth: 2,
          fontFamily: 'Fira Code',
          fontLigatures: true,
          fontWeight: '400',
          fontSize: 12,
          letterSpacing: 0.5,
          lineHeight: 1.6,
          wrappingIndent: 'same',
          tabSize: 2,
          detectIndentation: false,
          readOnly: currentFile.readonly,
          minimap: {enabled: false},
          scrollBeyondLastColumn: 0,
          wordBreak: 'keepAll',
          wordWrap: 'on'
        }}
      />
    )
  )
}

[CGNonofr]

Hello!

You're talking about Node.js even though that's a browser library, so I'm not sure what you are exactly talking about:

• Are you talking about the memory your bundler consume? (webpack, vite...)?
• Are you using it with electron or similar?

[wkd-kapsule]

Hey!

First, thanks for your responsiveness. Then, yes, I'm talking about the bundler. I am building a web app with Next.js, so Node.js is used to serve it on localhost:3000. It consumes around 2 GB of memory and everything is fine as long as I'm not on a page using your packages. Otherwise, it goes over 10 GB, the page won't load and I have to stop the server from running, or my pc will eventually crash.

Here is a screenshot of the page where I use the editor. This is my own implementation, without your packages. You can see in the memory ("mémoire") column that Node.js is consuming less than 500 MB.

[CGNonofr]

I'm not really familiar with next.js, does it use webpack? One particularity of the lib and its dependencies is that they are in ESM in many modules

Do you have the same issue if you build you app, instead of starting it in dev mode?

[wkd-kapsule]

I'll try that. Note that upon installing the package (with Bun), I got this warning multiple times:
warn: incorrect peer dependency "@xterm/xterm@5.6.0-beta.39"

[wkd-kapsule]

I have added the @xterm/xterm@5.6.0-beta.39 dependency manually. Still doesn't work. Maybe the fact that I am using the canary version of React?

Concerning prod build, I get this error when deploying to Vercel:

[CGNonofr]

I'll try that. Note that upon installing the package (with Bun)

I've never tried bun and I think there were some issues in the past with it 🤔

I got this warning multiple times:
warn: incorrect peer dependency "@xterm/xterm@5.6.0-beta.39"

I will need a little more details. It's not defined as peerDependencies but in the dependencies