perf(form-core): reduce instantiations when type checking

[chorobin]

I have used the large example in the repo (this isn't very large so difference is not so large) to check reduction in instantiations and type checking time. I am using extendedDiagnostics but also traced the example

Before:

> tsc "--extendedDiagnostics"

Files:                         215
Lines of Library:            43159
Lines of Definitions:        80538
Lines of TypeScript:           209
Lines of JavaScript:             0
Lines of JSON:                   0
Lines of Other:                  0
Identifiers:                105350
Symbols:                    118110
Types:                       18129
Instantiations:             205206
Memory used:               157045K
Assignability cache size:     9324
Identity cache size:           223
Subtype cache size:              5
Strict subtype cache size:       0
I/O Read time:               0.05s
Parse time:                  0.43s
ResolveModule time:          0.09s
ResolveTypeReference time:   0.00s
ResolveLibrary time:         0.02s
Program time:                0.66s
Bind time:                   0.21s
Check time:                  0.71s
printTime time:              0.00s
Emit time:                   0.00s
Total time:                  1.58s

After

> tsc "--extendedDiagnostics"

Files:                         215
Lines of Library:            43159
Lines of Definitions:        80528
Lines of TypeScript:           209
Lines of JavaScript:             0
Lines of JSON:                   0
Lines of Other:                  0
Identifiers:                105504
Symbols:                     85611
Types:                        6188
Instantiations:              27643
Memory used:               133987K
Assignability cache size:     1640
Identity cache size:           166
Subtype cache size:              5
Strict subtype cache size:      12
I/O Read time:               0.05s
Parse time:                  0.44s
ResolveModule time:          0.10s
ResolveTypeReference time:   0.00s
ResolveLibrary time:         0.02s
Program time:                0.68s
Bind time:                   0.21s
Check time:                  0.37s
printTime time:              0.00s
Emit time:                   0.00s
Total time:                  1.26s

There are three main things contributing to lower instantiations:

1. Variance annotations have been added, this means when comparing two types with different type parameters, the variance worker takes less time as we are hinting to the compiler how our type parameters are going to be used
2. TName is not constrained and uses a ValidateName utility instead. I prefer not to use contraints at inference sites against complex types that could be unions. This is because TName could default to the union and this can slow things down in a few situations.
3. I re-worked DeepKeys and DeepValue. Instead of creating a union and then parsing TName again, a map is constructed so TValue can be grabbed by TName. TName -> TValue

[nx-cloud]

View your CI Pipeline Execution ↗ for commit 22bf0d2.

Command	Status	Duration	Result
nx affected --targets=test:sherif,test:knip,tes...	✅ Succeeded	2m 11s	View ↗
nx run-many --target=build --exclude=examples/**	✅ Succeeded	18s	View ↗

---

☁️ Nx Cloud last updated this comment at 2025-03-12 00:32:32 UTC

[pkg-pr-new]

Open in Stackblitz

More templates

• @tanstack/form-example-angular-array
• @tanstack/form-example-angular-simple
• @tanstack/form-example-lit-simple
• @tanstack/form-example-lit-ui-libraries
• @tanstack/form-example-react-array
• @tanstack/form-example-react-compiler
• @tanstack/field-errors-from-form-validators
• @tanstack/form-example-react-large-form
• @tanstack/form-example-react-next-server-actions
• @tanstack/form-example-react-query-integration
• @tanstack/form-example-remix
• @tanstack/form-example-react-simple
• @tanstack/form-example-react-standard-schema
• @tanstack/form-example-react-tanstack-start
• @tanstack/form-example-react-ui-libraries
• @tanstack/form-example-solid-array
• @tanstack/form-example-solid-simple
• @tanstack/form-example-vue-array
• @tanstack/form-example-vue-simple

@tanstack/angular-form

npm i https://pkg.pr.new/@tanstack/angular-form@1262

@tanstack/form-core

npm i https://pkg.pr.new/@tanstack/form-core@1262

@tanstack/react-form

npm i https://pkg.pr.new/@tanstack/react-form@1262

@tanstack/lit-form

npm i https://pkg.pr.new/@tanstack/lit-form@1262

@tanstack/solid-form

npm i https://pkg.pr.new/@tanstack/solid-form@1262

@tanstack/vue-form

npm i https://pkg.pr.new/@tanstack/vue-form@1262

commit: 22bf0d2

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 88.79%. Comparing base (4ef7fd1) to head (22bf0d2).
Report is 1 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1262      +/-   ##
==========================================
- Coverage   88.81%   88.79%   -0.02%     
==========================================
  Files          28       28              
  Lines        1269     1267       -2     
  Branches      331      329       -2     
==========================================
- Hits         1127     1125       -2     
  Misses        127      127              
  Partials       15       15              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[Balastrong]

Thanks for the improvements and sorry for taking so long for the review!

I just added a couple comments, overall looks great! (and slightly beyond my TS knowledge, but I trust you :D)

[Balastrong]

I think field.option.name should be 'name' only and that's also true on the code, maybe this change was lost there during a refactor? (same for the two instances below on this file).

I see the test is still passing with assertType<'name'>

[Balastrong]

Question: the types with [number] are added to ArrayAccessor on purpose for the autocomplete, right?

I see it goes from this (on main)

to this