Repository: TypeScript
Issue: IntelliSense lag right after trigger, in project with many importable files
Labels: Suggestion,Needs Proposal

<!-- ⚠️⚠️ Do Not Delete This! bug_report_template ⚠️⚠️ -->
<!-- Please read our Rules of Conduct: https://opensource.microsoft.com/codeofconduct/ -->
<!-- 🕮 Read our guide about submitting issues: https://github.com/microsoft/vscode/wiki/Submitting-Bugs-and-Suggestions -->
<!-- 🔎 Search existing issues to avoid creating duplicates. -->
<!-- 🧪 Test using the latest Insiders build to see if your issue has already been fixed: https://code.visualstudio.com/insiders/ -->
<!-- 💡 Instead of creating your report here, use 'Report Issue' from the 'Help' menu in VS Code to pre-fill useful information. -->
<!-- 🔧 Launch with `code --disable-extensions` to check. -->
Does this issue occur when all extensions are disabled?: Yes

<!-- 🪓 If you answered No above, use 'Help: Start Extension Bisect' from Command Palette to try to identify the cause. -->
<!-- 📣 Issues caused by an extension need to be reported directly to the extension publisher. The 'Help > Report Issue' dialog can assist with this. -->
- VS Code Version: 1.60.2 and main branch (e1fb453fb67bd9887d1119965006a91ea4839d97)
- OS Version: macOS Big Sur 11.5.2

Steps to Reproduce:

1. Prepare node.js environment.
2. `npx create-next-app --typescript`
3. `yarn add @mui/core @mui/icons-material @fortawesome/fontawesome-svg-core @fortawesome/free-solid-svg-icons @fortawesome/free-solid-svg-icons lodash @types/lodash`
  lodash contains many methods, and icons contains many files
4. Open project with vscode and create new `pages/foo.tsx` file.
5. Write below code (`|` is the caret). JSX opening bracket will trigger completions provided by TypeScript language feature.
6. It takes >500ms until the suggestions show up (the first item is `FactoryIcon`, with my MBP 16 inch 2019 i7).

```tsx
import React from "react";
import ImageIcon from '@mui/icons-material/Image'
import FactoryIcon from 'mdi-react/FactoryIcon'
import { pick } from 'lodash'

const Page = () => {
    <F|
}
export Page
```

This is because it processes too many completion items retrieved with *empty prefix word*, and request is not canceled even after more characters are typed (current SuggestModel implementation waits for the first result from tsserver).

All lodash methods and icon files are show up.
<img width="500" alt=" lodash methods shown in completions" src="https://user-images.githubusercontent.com/400558/134607204-89dadb0f-7ba9-4e68-a993-3ada0b0099e8.png">

In this case 12000 completions items are  [processed in TS language feature](https://github.com/microsoft/vscode/blob/082520758cd363d98f1d1611804beed593132be8/extensions/typescript-language-features/src/languageFeatures/completions.ts#L759) in my environment.

(Sometimes it does not show up unexpectedly, but adding import statement and restart TS server must produce the same result.)

----

Even worse, in my real editor (with extensions like ESLint and VSCodeVim plugin enabled) & project (with many files), 13000 completion entries are processed.
This will happen while typing through the word with VSCodeVIm which also works on the extension host and gets blocked, my experience is like `<Factor.....freeeze!!!....yIcon`.
(Also it'll immediately [retrigger for incomplete result](https://github.com/microsoft/vscode/blob/082520758cd363d98f1d1611804beed593132be8/src/vs/editor/contrib/suggest/suggestModel.ts#L638))

Extension host profile shows 536.7ms blocking time, almost of it is taken by `new MyCompletionItem(...)` in `getCompletionItems()` of TS language service.
<img width="708" alt="Extension host profile shows 536.7ms blocking time" src="https://user-images.githubusercontent.com/400558/134606042-bc07dc85-3327-4846-a5fd-b83cc5dcf9bc.png">

Electron renderer process also blocked by deserializing result JSON for ~196.78ms~.
<img width="479" alt="Electron renderer process also blocked by deserializing result JSON for 196.78ms" src="https://user-images.githubusercontent.com/400558/134604791-4d0ea0f3-c4df-4b82-8a71-bd50cca313e8.png">
**EDIT:** It was including overhead of "Performance" tab of dev tools. Using JS Profiler tab reduces it to 54.6ms. But still other micro tasks are still blocking for 118.2ms.
![image](https://user-images.githubusercontent.com/400558/142647595-3870ee7d-571a-42cd-a047-cb7d3c89f223.png)


Interestingly, although `mdi-react` is installed and imported in my project, it does not show up in completions. Maybe because it does not provide "main" or "types" in package.json.

----

Created PR: microsoft/vscode#133707
Other possible solution:
- Add `limit` parameter to tsserver API (treat it as incomplete)
- Trim result in provideCompletionItems (ditto)
- Improve performance of new MyCompletionItem() ..?