microsoft / microsoft/monaco-editor
[Bug] High CPU Usage and Out of Memory Issue in Chrome
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 46.8k
- Forks
- 4.1k
- Avg merge
- 17h 58m
- Merged PRs (30d)
- 1
Description
Reproducible in vscode.dev or in VS Code Desktop?
- Not reproducible in vscode.dev or VS Code Desktop
Reproducible in the monaco editor playground?
- Not reproducible in the monaco editor playground
Monaco Editor Playground Link
Using this library causes severe performance issues, particularly in Chrome:
Chrome: The browser runs out of memory, with CPU usage spiking to nearly 100% as shown in Chrome DevTools. Additionally, an excessive number of DOM nodes are created, contributing to the problem.
Other Browsers: While the issue does not result in an out-of-memory error, it still leads to noticeable performance degradation.
Steps to Reproduce:
Set a fixed height on instance (e.g., 800px).
Populate the editor with a large amount of text.
Scroll up and down quickly (at a faster pace than typical reading).
Observe the performance impact:
Noticeable performance degradation, particularly in Chrome.
In Chrome, extreme memory usage and high CPU consumption can occur.
This issue becomes more evident when the text within the editor is large enough to stress the rendering and scrolling performance.
My app (angular) is breaking because of this. Makes me believe there monaco-editor demos are really small because of this...
Monaco Editor Playground Code
Reproduction Steps
Set a fixed height on instance (e.g., 800px).
Populate the editor with a large amount of text.
Scroll up and down quickly (at a faster pace than typical reading).
Observe the performance impact:
Noticeable performance degradation, particularly in Chrome.
In Chrome, extreme memory usage and high CPU consumption can occur.
This issue becomes more evident when the text within the editor is large enough to stress the rendering and scrolling performance.
Actual (Problematic) Behavior
No response
Expected Behavior
No response
Additional Context
this is causing out of memory issues. see chrome debug dump:
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
No source file, test, or runnable playground code is provided. Start by building the described reproduction with an 800px editor, large text, and rapid scrolling, then use Chrome DevTools to measure DOM growth, CPU, and memory; done requires a confirmed cause and a demonstrated performance improvement across the reported browsers.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- angular, javascript, typescript
- Domain
- frontend, performance, web-dev
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100