Struggling with sluggish performance on a certain project within VS Code

My experience with VS code has been excellent over the years, but I recently encountered a problem in one of my projects that caused a significant slowdown in performance. Strangely, other projects are working fine without any issues on VS code. I suspect that there's something specific to this troubled project causing the slow-down. Despite trying to troubleshoot by deleting and re-cloning the repository, as well as reinstalling VS code, the lag persists. It now takes up to a minute for the editor to update changes.

Here is the status report of VS code when the issue occurs:

Version:          Code 1.63.0 (7db1a2b88f7557e0a43fec75b6ba7e50b3e9f77e, 2021-12-07T05:15:48.091Z)
OS Version:       Darwin arm64 20.6.0
CPUs:             Apple M1 (8 x 24)
Memory (System):  8.00GB (0.16GB free)
Load (avg):       5, 3, 3
VM:               0%
Screen Reader:    no
... (CPU/Memory stats truncated for brevity) ...

Workspace Stats: 
|  Window (Home.module.scss — intl_rail_frontend)
|    Folder (intl_rail_frontend): 1059 files
|      File types: js(252) json(163) ts(89) tsx(69) woff(52) eot(52) pack(47)
|                  scss(32) png(30) map(28)
|      Conf files: package.json(9) tsconfig.json(4) settings.json(1)

I am using a Mac with an M1 chip running macOS Big Sur v11.6.

typescriptvisual-studio-codenext.js

Answer №1

I encountered a similar problem with VSCode and decided to try out the latest version of VSCode Insiders (https://code.visualstudio.com/insiders/). It appears that they have resolved this issue, as I no longer see the problem in any of my affected projects.

You can also synchronize your VSCode settings with VSCode Insiders (https://code.visualstudio.com/docs/editor/settings-sync) to continue working smoothly until this issue is addressed in the regular version of VSCode.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Encountering an issue while attempting to implement Redux Toolkit alongside the MUI ToggleButtonGroup component

The error message initially started as: Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. When I attempted to update the Redux state using a dispatcher, the handleChange function suddenly showed an e ...

javascriptreactjsnext.jsmaterial-uiredux-toolkit

The TypeScript error message is saying that it cannot find the property 'push' of an undefined value, resulting in a error within the

Issue: Unable to access property 'push' of undefined in [null]. class B implements OnInit { messageArr: string[]; ngOnInit() { for(let i=0; i<5; i++) { this.messageArr.push("bbb"); } } } ...

typescript

After deploying on Vercel, Next.js' getServerSideProps function is returning undefined

I am trying to create a Netflix-inspired website using next.js. I am able to fetch movie data from TMDB using getServerSideProps(). While everything works as expected in development mode, once deployed on Vercel (re-deployed multiple times), the props I re ...

javascriptreactjstypescriptnext.js

Working with type-agnostic values in a type-agnostic list within a type-agnostic class using Typescript

I'm currently attempting to add a generic object to a list of other generic objects within a generic class. There seems to be an issue with the semantics, but I can't pinpoint exactly what the problem is. type EventCallback<I, O> = (event ...

typescripttypescript-genericstypescript-typestypescript-class

Passing a complex variable type in TypeScript to a function without the need to redefine the type

I'm fairly new to working with TypeScript and I've encountered this issue several times. When using tools like Prisma to retrieve data, I often come across values with incredibly complex types. These values contain many attributes, which is perf ...

javascripttypescriptprisma

When compiling to ES5, TypeScript fails to remove imports

I am working on a TypeScript file that utilizes the moment library, and I need to import moment for it to compile properly. However, after compilation, the import line is still present in the compiled file, which is causing issues on my web page. Here is ...

typescript

Need to end all Node.js instances to properly reflect the code. Any solutions for resolving this issue?

After developing an application using typescript, hapi, and nodejs, I encountered a strange issue. Whenever I save, remove, or add new code, the changes are not reflected even after running gulp build. The only way to get it working is by closing all run ...

node.jstypescriptgulp

execute the NPM script in the current directory

Within my package.json file for a node project, I have the following test script that utilizes the ts-node package: "scripts": { "build": "tsc", "test": "ts-node" } Executing this script from the root ...

javascriptnode.jstypescriptnpm

Initially, when an iframe is loaded in Angular 10, it may display a 404 error page

Hey there! I'm currently using the HTML code below to incorporate an iframe and display an external page hosted on the same domain so no need to worry about cross domain issues: <iframe frameborder="0" [src]="url"></iframe ...

angulartypescriptiframeangular10

How can we include additional types for external npm packages in a React TypeScript project?

Recently, I encountered an issue while using the react-microsoft-login package from npm. I included a button in the children property and received a typescript error stating that "property 'children' does not exist on type 'intrinsicattribut ...

reactjstypescriptgitnpmnode-modules

The node command line does not recognize the term 'require'

My Typescript project was compiling and running smoothly until recently when I started encountering the error ReferenceError: require is not defined every time I try to run node. I am uncertain whether this issue stems from Typescript, as even when I ru ...

node.jstypescriptrequirecommonjs

After creating my Docker container, it is unable to detect any new files within its assigned volume

I am encountering an issue with my Nextjs app and images in my docker-compose file on my Ubuntu VPM with bind volumes. After composing the website, I am unable to view any new files that are uploaded; only the ones that were in /root/docker/public at the t ...

dockernext.jsdocker-compose

Separate files containing TypeScript decorators are defined within a project

(Let's dive into Typescript and Angular2, shall we?) Having primarily coded in Symfony2 with annotations, I found it convenient to configure entity mapping, routing, and other features using yaml, xml, or plain PHP. This flexibility was great for cre ...

typescriptangular

Is query result caching implemented in the Next.js API route?

I have a Next.js application that is connected to a third-party API in order to display certain information. The data is retrieved through Next.js API routes, and the code for this can be found in /pages/api/data.js. const handler = async (req, res) => ...

reactjsapinext.js

Multiple asynchronous calls in Angular 2

In my Component, there is a function that is supposed to return a value (Promise). This value requires information from two distinct sources: an API call and data from a database. The method in question looks like this: public getValue(): Promise<numb ...

typescriptpromiseangular2-services

Tips on leveraging separate files for classes in TypeScript

I'm currently working on developing a TypeScript application where each class is saved in its own .ts file. I prefer to use VS Code for this project. So far, my compile task seems to be functioning correctly (transpiling .ts files into .js files). How ...

typescriptcommonjs

Getting into a dynamic named property inside another object in angular can be achieved by utilizing bracket notation

I encountered an issue in my Angular 8 project where I create an object from a JSON, but there is a dynamic property whose name is unknown until runtime. This causes problems when trying to access the value of that dynamic property within another object, l ...

angulartypescriptobjectionic-frameworkruntime

Error: Code cannot be executed because the variable "sel" has not been defined in the HTML element

Every time I try to click on the div, I encounter an error message stating 'Uncaught ReferenceError: sel is not defined at HTMLDivElement.onclick' I am currently developing with Angular 8 and this error keeps popping up. I have read through simil ...

javascripthtmlangulartypescriptangular8

Starting the process of configuring Angular 5 with Express using TypeScript

Hi there! I am looking to create a fresh application using angular 5 and express (typescript for express as well). Do you have any helpful guides or tips that could assist me in reaching my objective? Appreciate all the help, Giuseppe ...

node.jstypescriptexpressangular5

Dealing with ERR_PNPM_OUTDATED_LOCKFILE in Next.js

Every time I try to deploy my project on Vercel, the build process fails and shows this error message: ERR_PNPM_OUTDATED_LOCKFILE  Cannot install with "frozen-lockfile" because pnpm-lock.yaml is not up-to-date with package.json I am unsure of ...

npmnext.jsvercelpnpm