Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tab key is extremely slow on medium-large files when emmet.triggerExpansionOnTab is enabled #71996

Closed
xak2000 opened this issue Apr 9, 2019 · 19 comments
Assignees
Labels
bug Issue identified by VS Code Team member as probable bug emmet Emmet related issues insiders-released Patch has been released in VS Code Insiders perf verified Verification succeeded
Milestone

Comments

@xak2000
Copy link

xak2000 commented Apr 9, 2019

Issue Type: Bug

When I open a large file (tried on .php and .html) and emmet.triggerExpansionOnTab option is enabled, then each pressing on TAB key (even on blank line) make my computer hung for about 1-2 seconds (depends on file size) with high CPU load.

This is true with current 1.33 version of VS CODE, with or without extensions (tried with code --disable-extensions), with or without project open. I also tried to download 1.34 insiders build and the behavior is still the same.

Steps to Reproduce:

  1. Download a fresh 1.34 insiders build (or use 1.33 current).

  2. Create new HTML file tmp.html with any content. Make sure it is 2000+ lines. Better 5000+ - the hang is more obvious when the file is more large. I attached an example file here.

  3. Set cursor on any line and press TAB. You can press it many times in a row or press and hold - all should be fine.

  4. Open preferences and enable Emmet: Trigger Expansion on Tab option (emmet.triggerExpansionOnTab).

  5. Return to opened file and try to press TAB again. You should see a very notable delay between pressing the key and moving the cursor (you can enable Toggle render whitespace option to see this better).

    If you press and hold the TAB key for about 5 seconds, then you should see no spaces/tabs characters entered (but notice high CPU load), you then can move cursor to anoter place in the editor, and after another 10-30 seconds have been passed (all that time with high CPU load), the delayed space characters will appear at the current cursor position (not where the cursor been when you actually pressed the TAB key).

So here is two problems:

  1. A high CPU load and delay between pressing TAB key and appearing of spaces/tab characters.
  2. The space/tab characters appears after the delay not where the cursor was when TAB key was pressed, but at the current position of the cursor.

I notice this problem only recently. I'm not sure with which build this comes in (not used VS Code recently), but 1-2 month ago there were no this problem.


VS Code version: Code - Insiders 1.34.0-insider (56f1b47, 2019-04-09T05:19:45.294Z)
OS version: Windows_NT x64 6.1.7601

System Info
Item Value
CPUs Intel(R) Core(TM) i5-4670 CPU @ 3.40GHz (4 x 3400)
GPU Status 2d_canvas: enabled
checker_imaging: disabled_off
flash_3d: enabled
flash_stage3d: enabled
flash_stage3d_baseline: enabled
gpu_compositing: enabled
multiple_raster_threads: enabled_on
native_gpu_memory_buffers: disabled_software
rasterization: enabled
surface_synchronization: enabled_on
video_decode: enabled
webgl: enabled
webgl2: enabled
Load (avg) undefined
Memory (System) 23.93GB (1.39GB free)
Process Argv
Screen Reader no
VM 0%
Extensions: none
@vscodebot vscodebot bot added the editor-find Editor find operations label Apr 9, 2019
@ramya-rao-a ramya-rao-a assigned octref and unassigned ramya-rao-a Apr 10, 2019
@ramya-rao-a ramya-rao-a added emmet Emmet related issues and removed editor-find Editor find operations labels Apr 10, 2019
@medzhidov
Copy link

I have the same problem with latest vscode.

@octref
Copy link
Contributor

octref commented Jul 29, 2019

Duplicate of #70371. Try tomorrow's Insiders which should have the fix.

@octref octref closed this as completed Jul 29, 2019
@octref octref added *duplicate Issue identified as a duplicate of another issue(s) and removed emmet Emmet related issues labels Jul 29, 2019
@xak2000
Copy link
Author

xak2000 commented Jul 30, 2019

@octref Tried today's insiders build. Nothing is changed.

I opened a html file with 3700 LOC, enabled emmet.triggerExpansionOnTab, and tried to press TAB. It extremely slow and consumes high CPU. For doing nothing (nothing to expand by emmet because I press TAB key on empty lines...).

Also, it can be not a duplicate of #70371 because in #70371 there is no high CPU load and there users try real emmet expansions. This bug on other hand not about emmet expansion, but about pressing TAB key on empty line (where emmet should not trigger at all). Not only on empty lines I must say, but on non-empty lines too.

It also has nothing to do with HTML. I tried to open a large PHP file and it has same problem.

VS Code version: Code - Insiders 1.37.0-insider (cf03ea3, 2019-07-30T07:15:22.972Z)
OS version: Windows_NT x64 6.1.7601

System Info
Item Value
CPUs Intel(R) Core(TM) i5-4670 CPU @ 3.40GHz (4 x 3400)
GPU Status 2d_canvas: enabled
flash_3d: enabled
flash_stage3d: enabled
flash_stage3d_baseline: enabled
gpu_compositing: enabled
multiple_raster_threads: enabled_on
native_gpu_memory_buffers: disabled_software
oop_rasterization: disabled_off
protected_video_decode: unavailable_off
rasterization: enabled
skia_deferred_display_list: disabled_off
skia_renderer: disabled_off
surface_synchronization: enabled_on
video_decode: enabled
viz_display_compositor: disabled_off
webgl: enabled
webgl2: enabled
Load (avg) undefined
Memory (System) 23.93GB (2.88GB free)
Process Argv
Screen Reader no
VM 0%
Extensions: none

@octref
Copy link
Contributor

octref commented Jul 30, 2019

It's not in insider yet. Wait a bit.

@medzhidov
Copy link

It's not in insider yet. Wait a bit.

Is a bit - you mean we have no chance to resolve this critycal for developer problem?)
This problem follows from when vscode released emmet from the box. We have no problem before, but now we have a lot of problem with default emmet - it does not support a lot of shortcuts from original emmet and have a lot of bugs by default installation.

I loved vscode and developed several extensions, but now i start thinking about sublime text 3 again.

@octref
Copy link
Contributor

octref commented Jul 30, 2019

we have no chance to resolve

It's already resolved.

Is a bit

You can either build from source or wait for another release of Insiders version coming out this afternoon.

@xak2000
Copy link
Author

xak2000 commented Jul 31, 2019

@octref

I downloaded a fresh copy of VS Code Insiders (I inlcuded version and commit hash on bottom of this message) and still nothing changed.

As I see, the commit 99d5ff9, that fixes #70371 is from PR #78207 and it is already included in insiders build (at least it is below of the current commit of downloaded build on master branch. The Insiders build is built from master, right?).

So, if you meant that this commit should fix this issue, it doesn't, unfortunately. :-(

I record a video to show what it looks like: vc-code-slow-tab-and-high-cpu-usage2.zip. On 00:18 I pressed TAB key several times in a row and only on 00:43 the editor finally rendered all these spaces (in my case 4 spaces instead of "tab" character). Throughout its 25 seconds VS Code consumed 100% of a single CPU core, trying to render 10 TABs (I know, that it actually consumed the cpu for something else (Emmet I think), it's just a simplification).

The GIF version of the video:
ezgif com-optimize


VS Code version: Code - Insiders 1.37.0-insider (d5900c6, 2019-07-31T05:24:41.973Z)
OS version: Windows_NT x64 6.1.7601

System Info
Item Value
CPUs Intel(R) Core(TM) i5-4670 CPU @ 3.40GHz (4 x 3400)
GPU Status 2d_canvas: enabled
flash_3d: enabled
flash_stage3d: enabled
flash_stage3d_baseline: enabled
gpu_compositing:

enabled
multiple_raster_threads: enabled_on
native_gpu_memory_buffers: disabled_software
oop_rasterization: disabled_off
protected_video_decode: unavailable_off
rasterization: enabled
skia_deferred_display_list: disabled_off
skia_renderer: disabled_off
surface_synchronization: enabled_on
video_decode: enabled
viz_display_compositor: disabled_off
webgl: enabled
webgl2: enabled|
|Load (avg)|undefined|
|Memory (System)|23.93GB (4.55GB free)|
|Process Argv||
|Screen Reader|no|
|VM|0%|

Extensions: none

@octref octref added bug Issue identified by VS Code Team member as probable bug emmet Emmet related issues and removed *duplicate Issue identified as a duplicate of another issue(s) labels Jul 31, 2019
@octref
Copy link
Contributor

octref commented Jul 31, 2019

I'm on d5900c6 and here's what I see in a 5k line HTML file:

fast

Whereas this is stable:

slow

NVM, I just realized that your bug is you are having "emmet.triggerExpansionOnTab" and expanding on empty lines, whereas the bug I fixed was for "emmet.triggerExpansionOnTab": false.

@octref octref reopened this Jul 31, 2019
@octref octref modified the milestones: July 2019, August 2019 Jul 31, 2019
@octref octref modified the milestones: August 2019, September 2019 Aug 26, 2019
@DerrikMilligan
Copy link

This is indeed a bug, thanks for narrowing it down to the setting for me to turn off to at least live while it's being worked on.

@octref
Copy link
Contributor

octref commented Sep 3, 2019

I made a cheap improvement, which is to disable expansion if the previous character is space or tab. For example div| expands, but div | doesn't. This makes tabbing on empty lines not that miserable, but a proper fix is still needed for the expansion.

@octref octref reopened this Dec 4, 2019
@octref octref modified the milestones: November 2019, December 2019 Dec 5, 2019
@octref octref removed verification-needed Verification of issue is requested verification-steps-needed Steps to verify are needed for verification labels Dec 5, 2019
@octref
Copy link
Contributor

octref commented Dec 5, 2019

I'll switch to our html languageservice parser for December.

@octref octref modified the milestones: January 2020, February 2020 Jan 29, 2020
@octref octref modified the milestones: February 2020, March 2020 Feb 26, 2020
@octref octref modified the milestones: March 2020, April 2020 Apr 2, 2020
@octref octref modified the milestones: April 2020, Backlog Apr 28, 2020
@rzhao271 rzhao271 added the perf label Dec 9, 2020
@rzhao271
Copy link
Contributor

@xak2000 @andremacola @medzhidov does this issue occur for you in the latest vscode?
I know this issue hasn't been looked at for a year, and I want to see where things are at, now.
I noticed that pressing and holding down tab is causing a bunch of events to fire in the profile, though I haven't associated any directly with Emmet yet.
Will take a closer look tomorrow.

emmet-perf-delay

@medzhidov
Copy link

Don't worry, i started use PHPStorm, so this bug can be leaved for another one year =)

@xak2000
Copy link
Author

xak2000 commented Dec 10, 2020

@rzhao271 I checked out the file tmp.html that I included in the issue description and no, it doesn't occur anymore if I press and hold TAB on an empty line.

But I managed to reproduce the issue in other way.

  1. Open preferences and enable Emmet: Trigger Expansion on Tab option (emmet.triggerExpansionOnTab).
  2. Put the cursor at the start of an empty line of tmp.html file (e.g. on line 11).
  3. Enter div and press Esc to close the autocompletion popup menu.
  4. Press and hold TAB for 5-10 seconds. Release it.
  5. Nothing new will be entered in the editor (emmet expansion would not happen) in next 10-20 seconds (one expansion sometimes still happens so one instance of <tab></tab> text could appear), but you will notice one CPU thread that consume 100% CPU. Main editor thread is still responsive, I suppose. I can move cursor to another line and enter some new text here etc. It looks like VS Code is not frozen at all. To notice that something is wrong I needed to look at my CPU temperature and frequency and I see that it doing some hard work. And then after 10-20 seconds suddenly emmet will finish it's expansion and something like this will be printed in the editor at the location of cursor when you held TAB:
<div>|</div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>v></div>

(the | indicates the cursor location).

And what is worse: cursor will be moved back into the position of the file when you held TAB (after first <div>). Even if you already was in another place of the file and entering some text at the moment, your input will be interrupted and part of text that you entered will be placed into the new position of cursor (after first <div>).

@rzhao271
Copy link
Contributor

\closedWith 15ba9ae

@meganrogge meganrogge added the verified Verification succeeded label Jan 26, 2021
@github-actions github-actions bot locked and limited conversation to collaborators Feb 13, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
bug Issue identified by VS Code Team member as probable bug emmet Emmet related issues insiders-released Patch has been released in VS Code Insiders perf verified Verification succeeded
Projects
None yet
Development

No branches or pull requests

10 participants