Poor auto-complete performance when Drizzle ORM is installed

[cdebotton]

Describe the bug

When installing Drizzle ORM and setting up a single table in a brand new SvelteKit project (no other libraries), the language server slows down to the point where it's almost unusable, however only within the svelte template syntax. Intellisense is still instantaneous in .ts, .svelte.ts, and <script lang="ts"> blocks.

When setting up a similar example project in Next.js (only using ts-server in the IDE), there are no performance issues.

Reproduction

$ pnpm create svelte@latest example
$ cd example
$ pnpm add drizzle-orm
$ mkdir -p src/lib/server && touch src/lib/server/db.ts

// db.ts
import { drizzle } from 'drizzle-orm/vercel-postgres';
import { sql } from '@vercel/postgres';
import { pgTable, serial, timestamp, varchar } from 'drizzle-orm/pg-core';

export const db = drizzle(sql);

export const objects = pgTable('objects', {
  id: serial('id').primaryKey(),
  name: varchar('name', { length: 255 }),
  createdAt: timestamp('created_at').defaultNow().notNull(),
  updatedAt: timestamp('updated_at'),
});

Editing an *.svelte files results in unusable autocomplete with HTML elements, script/style blocks.

Autocomplete for typescript in TS files and within script blocks performs as expected.

When I uninstall drizzle-orm, the performance issues disappear and autocomplete preforms as expected.

Expected behaviour

There should ideally be no extra delay when working within the svelte template syntax

System Info

• OS: MacOS 14.2
• IDE: VSCode

Version: 1.85.1 (Universal)
Commit: 0ee08df0cf4527e40edc9aa28f4b5bd38bbff2b2
Date: 2023-12-13T09:48:06.308Z (6 days ago)
Electron: 25.9.7
ElectronBuildId: 25551756
Chromium: 114.0.5735.289
Node.js: 18.15.0
V8: 11.4.183.29-electron.0
OS: Darwin arm64 23.2.0

Which package is the issue about?

I believe it's an issue with the language-server?

Additional Information, eg. Screenshots

Here's an example repo:
https://github.com/cdebotton/svelte-drizzle-example-language-tools

I've tested this on both an M3 Pro and an M1 Max and found the same results.

[jasonlyu123]

TSServer doesn't suffer from this because of caches in some TypeScript internal APIs. So, I changed the label to enhancement. We probably need to use Volar's cache package but there is some issue with the package we need to sort out.

[cdebotton]

Thanks for looking into this! I just wanted to clarify the issue isn't just with auto-import, but also with any completion, ie: adding html elements or attributes to elements in the svelte template itself.

Here's a video to demonstrate:

Screen.Recording.2023-12-21.at.1.45.07.PM.mov

This slowdown doesn't happen when editing a javascript/typescript file or a script block within the template.

[jasonlyu123]

It's weird, but auto-import is still triggered in this case. This is because of some limitations we have. Once you have a syntax error in the template, all js completion is global completion. Which includes auto import, but VSCode might filter it out depending on the word before the cursor.

You'll have a better experience if you complete the tag and then write the attributes.

[cdebotton]

Just installed the update this morning and I have to say, wow, what a difference this makes! This will make building projects in svelte a much better developer experience, thank you!