microsoft / TypeScript

TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
https://www.typescriptlang.org
Apache License 2.0
101.26k stars 12.52k forks source link

JavaScript heap out of memory after upgrading to 4.3 #44299

Open dagstuan opened 3 years ago

dagstuan commented 3 years ago

Bug Report

🔎 Search Terms

Memory

🕗 Version & Regression Information

After upgrading to 4.3.2 I get a "JavaScript heap out of memory" exception when i try to run tsc. Downgrading to 4.2.4 does not yield the same error.

<--- Last few GCs --->

[43233:0x108008000]    75872 ms: Scavenge 2043.5 (2049.9) -> 2043.0 (2049.9) MB, 6.6 / 0.0 ms  (average mu = 0.119, current mu = 0.127) allocation failure 
[43233:0x108008000]    75927 ms: Scavenge 2043.8 (2049.9) -> 2043.3 (2050.2) MB, 6.5 / 0.0 ms  (average mu = 0.119, current mu = 0.127) allocation failure 
[43233:0x108008000]    75986 ms: Scavenge 2044.0 (2050.2) -> 2043.5 (2050.4) MB, 7.0 / 0.0 ms  (average mu = 0.119, current mu = 0.127) allocation failure 

<--- JS stacktrace --->

==== JS stack trace =========================================

    0: ExitFrame [pc: 0x100930c99]
Security context: 0x390dbb3008a1 <JSObject>
    1: getIntersectionType(aka getIntersectionType) [0x390df5b65bb9] [/.../node_modules/typescript/lib/tsc.js:~47588] [pc=0x1a0124246ed4](this=0x390d982804a9 <undefined>,0x390d7a08df51 <JSArray[18]>,0x390d982804a9 <undefined>,0x390d982804a9 <undefined>)
    2: getCrossProductIntersections(aka getCrossProductIntersections) [0...

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
 1: 0x10007e9b3 node::Abort() [/usr/local/bin/node]
 2: 0x10007eb37 node::OnFatalError(char const*, char const*) [/usr/local/bin/node]
 3: 0x100176337 v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node]
 4: 0x1001762d3 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node]
 5: 0x1002fa485 v8::internal::Heap::FatalProcessOutOfMemory(char const*) [/usr/local/bin/node]
 6: 0x1002fbb54 v8::internal::Heap::RecomputeLimits(v8::internal::GarbageCollector) [/usr/local/bin/node]
 7: 0x1002f8a27 v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [/usr/local/bin/node]
 8: 0x1002f6a0d v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/usr/local/bin/node]
 9: 0x1002f58c1 v8::internal::Heap::HandleGCRequest() [/usr/local/bin/node]
10: 0x1002bac3f v8::internal::StackGuard::HandleInterrupts() [/usr/local/bin/node]
11: 0x1005f7b6c v8::internal::Runtime_StackGuard(int, unsigned long*, v8::internal::Isolate*) [/usr/local/bin/node]
12: 0x100930c99 Builtins_CEntry_Return1_DontSaveFPRegs_ArgvOnStack_NoBuiltinExit [/usr/local/bin/node]
13: 0x1a0124246ed4

🙁 Actual behavior

It crashed.

🙂 Expected behavior

No crash

adam-thomas-privitar commented 3 years ago

Almost (young object promotion failed Allocation failed) exact same issue. obviously must be something specific about our codebase, but verbose outputs nothing so I dont know where we go from here. Perhaps providing some kind of dump might be useful for someone?

Worth noting it happens after a very long time hanging.



<--- Last few GCs --->

[7184:0x110008000]   621386 ms: Mark-sweep (reduce) 4064.9 (4101.8) -> 4064.2 (4103.3) MB, 2424.6 / 0.0 ms  (average mu = 0.114, current mu = 0.018) allocation failure scavenge might not succeed
[7184:0x110008000]   624960 ms: Mark-sweep (reduce) 4065.3 (4102.3) -> 4064.5 (4103.5) MB, 3528.9 / 0.0 ms  (average mu = 0.056, current mu = 0.013) allocation failure scavenge might not succeed

<--- JS stacktrace --->

FATAL ERROR: MarkCompactCollector: young object promotion failed Allocation failed - JavaScript heap out of memory
 1: 0x1012d84c5 node::Abort() (.cold.1) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
 2: 0x1000a5d59 node::Abort() [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
 3: 0x1000a5ebf node::OnFatalError(char const*, char const*) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
 4: 0x1001e8007 v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
 5: 0x1001e7fa3 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
 6: 0x100394ea5 v8::internal::Heap::FatalProcessOutOfMemory(char const*) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
 7: 0x1003f0e03 v8::internal::EvacuateNewSpaceVisitor::Visit(v8::internal::HeapObject, int) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
 8: 0x1003d866b void v8::internal::LiveObjectVisitor::VisitBlackObjectsNoFail<v8::internal::EvacuateNewSpaceVisitor, v8::internal::MajorNonAtomicMarkingState>(v8::internal::MemoryChunk*, v8::internal::MajorNonAtomicMarkingState*, v8::internal::EvacuateNewSpaceVisitor*, v8::internal::LiveObjectVisitor::IterationMode) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
 9: 0x1003d81b5 v8::internal::FullEvacuator::RawEvacuatePage(v8::internal::MemoryChunk*, long*) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
10: 0x1003d7ef6 v8::internal::Evacuator::EvacuatePage(v8::internal::MemoryChunk*) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
11: 0x1003f582e v8::internal::PageEvacuationTask::RunInParallel(v8::internal::ItemParallelJob::Task::Runner) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
12: 0x1003af8a2 v8::internal::ItemParallelJob::Task::RunInternal() [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
13: 0x1003afd28 v8::internal::ItemParallelJob::Run() [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
14: 0x1003d9f65 void v8::internal::MarkCompactCollectorBase::CreateAndExecuteEvacuationTasks<v8::internal::FullEvacuator, v8::internal::MarkCompactCollector>(v8::internal::MarkCompactCollector*, v8::internal::ItemParallelJob*, v8::internal::MigrationObserver*, long) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
15: 0x1003d9b66 v8::internal::MarkCompactCollector::EvacuatePagesInParallel() [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
16: 0x1003c5397 v8::internal::MarkCompactCollector::Evacuate() [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
17: 0x1003c2c2b v8::internal::MarkCompactCollector::CollectGarbage() [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
18: 0x10039556b v8::internal::Heap::MarkCompact() [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
19: 0x100391b59 v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
20: 0x10038f9a0 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
21: 0x10039e08a v8::internal::Heap::AllocateRawWithLightRetrySlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
22: 0x10039e111 v8::internal::Heap::AllocateRawWithRetryOrFailSlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
23: 0x10036c1e7 v8::internal::Factory::NewFillerObject(int, bool, v8::internal::AllocationType, v8::internal::AllocationOrigin) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
24: 0x1006eb078 v8::internal::Runtime_AllocateInYoungGeneration(int, unsigned long*, v8::internal::Isolate*) [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
25: 0x100a709b9 Builtins_CEntry_Return1_DontSaveFPRegs_ArgvOnStack_NoBuiltinExit [/Users/adamthomas/.nvm/versions/node/v14.14.0/bin/node]
26: 0x2cb8704f923c ```
brudil commented 3 years ago

We're experiencing this against both our front and backend applications which is interesting as they share little code. By any chance is anyone else here using Zod? It's perhaps the most type-complex library which we're using in both.

adam-thomas-privitar commented 3 years ago

@brudil Im using Zod too!

mudit-gupta-privitar commented 3 years ago

@brudil I am also using Zod!

jraoult commented 3 years ago

Interesting, using Zod here as well, 3.1.0 and I can't compile typecheck anything anymore since TS 4.3.2

adam-thomas-privitar commented 3 years ago

I setup a minimal test case like so:

import zod from 'zod'

export const SchemaExample = zod.object({
    name: zod.string().min(1),
    description: zod.string().min(1),
})

export type SchemaExampleType = zod.infer<typeof SchemaExample>

Interestingly, in the simple case, this causes "maximum depth" TS errors rather than a hang. I think when you have a lot of calls to zod.infer this triggers some infinite recursion/memory leak. Actually you dont need the infer even, or even the schema -- importing zod alone is enough. Not sure exactly how this might ultimately end up in hang when consumed a lot of times in a large codebase. Also not sure what changed in TS to make Zod incompatible.

Here are the errors:


node_modules/zod/lib/helpers/partialUtil.d.ts:5:42 - error TS2321: Excessive stack depth comparing types 'ZodError<?>' and 'ZodError<?>'.

5         object: T extends AnyZodObject ? ZodObject<{
                                           ~~~~~~~~~~~
6             [k in keyof T["_shape"]]: DeepPartial<T["_shape"][k]>;
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
7         }, T["_unknownKeys"], T["_catchall"]> : never;
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/zod/lib/helpers/partialUtil.d.ts:5:42 - error TS2321: Excessive stack depth comparing types 'ZodFormattedError<?>' and 'ZodFormattedError<?>'.

5         object: T extends AnyZodObject ? ZodObject<{
                                           ~~~~~~~~~~~
6             [k in keyof T["_shape"]]: DeepPartial<T["_shape"][k]>;
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
7         }, T["_unknownKeys"], T["_catchall"]> : never;
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/zod/lib/helpers/partialUtil.d.ts:5:42 - error TS2321: Excessive stack depth comparing types 'ZodIntersection<?, U>' and 'ZodIntersection<?, U>'.

5         object: T extends AnyZodObject ? ZodObject<{
                                           ~~~~~~~~~~~
6             [k in keyof T["_shape"]]: DeepPartial<T["_shape"][k]>;
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
7         }, T["_unknownKeys"], T["_catchall"]> : never;
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/zod/lib/helpers/partialUtil.d.ts:5:42 - error TS2321: Excessive stack depth comparing types 'ZodIntersection<T, ?>' and 'ZodIntersection<T, ?>'.

5         object: T extends AnyZodObject ? ZodObject<{
                                           ~~~~~~~~~~~
6             [k in keyof T["_shape"]]: DeepPartial<T["_shape"][k]>;
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
7         }, T["_unknownKeys"], T["_catchall"]> : never;
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/zod/lib/helpers/partialUtil.d.ts:5:42 - error TS2321: Excessive stack depth comparing types 'ZodNonEmptyArray<?>' and 'ZodNonEmptyArray<?>'.

5         object: T extends AnyZodObject ? ZodObject<{
                                           ~~~~~~~~~~~
6             [k in keyof T["_shape"]]: DeepPartial<T["_shape"][k]>;
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
7         }, T["_unknownKeys"], T["_catchall"]> : never;
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/zod/lib/helpers/partialUtil.d.ts:5:42 - error TS2321: Excessive stack depth comparing types 'ZodOptional<?>' and 'ZodOptional<?>'.

5         object: T extends AnyZodObject ? ZodObject<{
                                           ~~~~~~~~~~~
6             [k in keyof T["_shape"]]: DeepPartial<T["_shape"][k]>;
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
7         }, T["_unknownKeys"], T["_catchall"]> : never;
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/zod/lib/types.d.ts:60:168 - error TS2577: Return type annotation circularly references itself.

60     refine: <Func extends (arg: Output) => any, This extends this = this>(check: Func, message?: string | CustomErrorParams | ((arg: Output) => CustomErrorParams)) => ZodEffectsType<This>;
                                                                                                                                                                          ~~~~~~~~~~~~~~~~~~~~

node_modules/zod/lib/types.d.ts:61:162 - error TS2577: Return type annotation circularly references itself.

61     refinement: <This extends this = this>(check: (arg: Output) => any, refinementData: MakeErrorData | ((arg: Output, ctx: RefinementCtx) => MakeErrorData)) => ZodEffectsType<This>;
                                                                                                                                                                    ~~~~~~~~~~~~~~~~~~~~

node_modules/zod/lib/types.d.ts:62:86 - error TS2577: Return type annotation circularly references itself.

62     _refinement<This extends this>(refinement: InternalCheck<Output>["refinement"]): ZodEffectsType<This>;
                                                                                        ~~~~~~~~~~~~~~~~~~~~

node_modules/zod/lib/types.d.ts:63:90 - error TS2577: Return type annotation circularly references itself.

63     superRefine: <This extends this>(refinement: InternalCheck<Output>["refinement"]) => ZodEffectsType<This>;
                                                                                            ~~~~~~~~~~~~~~~~~~~~

node_modules/zod/lib/types.d.ts:69:68 - error TS2577: Return type annotation circularly references itself.

69     or<T extends ZodTypeAny, This extends this = this>(option: T): This extends ZodUnion<infer Opts> ? [...Opts, T] extends ZodUnionOptions ? ZodUnion<[...Opts, T]> : never : ZodUnion<[This, T]>;
                                                                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/zod/lib/types.d.ts:71:97 - error TS2577: Return type annotation circularly references itself.

71     transform<NewOut, This extends this>(transform: (arg: Output) => NewOut | Promise<NewOut>): This extends ZodEffects<infer T, any> ? ZodEffects<T, NewOut> : ZodEffects<This, NewOut>;
                                                                                                   ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/zod/lib/types.d.ts:381:18 - error TS2321: Excessive stack depth comparing types 'ZodTuple<?>' and 'ZodTuple<?>'.

381 export interface ZodFunctionDef<Args extends ZodTuple<any> = ZodTuple<any>, Returns extends ZodTypeAny = ZodTypeAny> extends ZodTypeDef {
                     ~~~~~~~~~~~~~~

Found 13 errors.
dagstuan commented 3 years ago

FWIW I'm not using Zod, but the codebase is quite large.

adam-thomas-privitar commented 3 years ago

Interesting. Perhaps its more t do with anything that uses recursive types.

amcasey commented 3 years ago

I'm going to investigate Zod, since there's a repro. Hopefully, the underlying issue will turn out to be the same as @dagstuan's.

amcasey commented 3 years ago

Introduced in https://github.com/microsoft/TypeScript/pull/30639 (cc @weswigham). On the bright side, in that exact commit, the toy repro runs out of memory, so we've made improvements since then. :smile:

weswigham commented 3 years ago

Yeah, when we merged that we started exploring more types during relationship checking to test for compatibility which, for generatively expanding types, means manufacturing more types (before we hit somewhat arbitrary limiters) - in the intervening time, we've tightened up on some of those limiters/identities a bit, and that's generally how I've been going about "fixing" it - identify costly structures to compare, figure out how they're dodging our complexity limiters, and the update the complexity limiters to capture them.

meadowsys commented 3 years ago

I'm getting similar error, and I have a (maybe) simpler repro:

import { object, string } from "zod";
const validator = object({
   _key: string()
});

That's enough to trigger the excessive stack depth error. My guess is that it has something to do with generic inference.

amcasey commented 3 years ago

Okay, it took a while, but here's a toy repro with no imports.

export declare type ZodFormattedError<T> = T extends [any, ...any] ? {
    [K in keyof T]?: ZodFormattedError<T[K]>;
} & {
    _errors: string[];
} : T extends any[] ? ZodFormattedError<T[number]>[] & {
    _errors: string[];
} : T extends object ? {
    [K in keyof T]?: ZodFormattedError<T[K]>;
} & {
    _errors: string[];
} : {
    _errors: string[];
};
export declare class ZodError<T> {
    format: () => ZodFormattedError<T>;
}
declare const c1: ZodError<number>;
const c2: ZodError<string> = c1;

Personally, I find it easier to read like this:

type ZodFormattedError<T> = T extends [any, ...any] 
    ? { [K in keyof T]?: ZodFormattedError<T[K]>; } & { _errors: string[]; } 
    : T extends any[] 
        ? ZodFormattedError<T[number]>[] & { _errors: string[]; } 
        : T extends object 
            ? { [K in keyof T]?: ZodFormattedError<T[K]>; } & { _errors: string[]; } 
            : { _errors: string[]; };

interface ZodError<T> {
    format: () => ZodFormattedError<T>;
}
declare const c1: ZodError<number>;
const c2: ZodError<string> = c1;
amcasey commented 3 years ago

Ooh, if you comment out these lines, it OOMs:

type ZodFormattedError<T> = T extends [any, ...any] 
    ? { [K in keyof T]?: ZodFormattedError<T[K]>; } & { _errors: string[]; } 
    : T extends any[] 
        ? ZodFormattedError<T[number]>[] & { _errors: string[]; } 
//      : T extends object 
//          ? { [K in keyof T]?: ZodFormattedError<T[K]>; } & { _errors: string[]; } 
            : { _errors: string[]; };

interface ZodError<T> {
    format: () => ZodFormattedError<T>;
}
declare const c1: ZodError<number>;
const c2: ZodError<string> = c1;
amcasey commented 3 years ago

And pulling out the intersection with { _errors: string[]; } seems to mitigate the issue.

type ZodFormattedError<T> = { _errors: string[]; } & (T extends [any, ...any]
    ? { [K in keyof T]?: ZodFormattedError<T[K]>; }
    : T extends any[]
        ? ZodFormattedError<T[number]>[]
        : T extends object
            ? { [K in keyof T]?: ZodFormattedError<T[K]>; }
            : {});

(I think I got that right.)

amcasey commented 3 years ago

@weswigham Is there something smart we can do with the depth limit in the the toy repros? And does my mitigation look correct enough to submit as a PR to zod?

meadowsys commented 3 years ago

is this a zod problem or a ts problem? I feel like this might be more of a ts problem, because something changed in ts 4.3 that broke zod

amcasey commented 3 years ago

@autumnblazey It's a TS problem, but a zod PR might help people until a new version of TS is released. Also, the proposed change to zod will likely make it faster even after the TS fix.

amcasey commented 3 years ago

@dagstuan Do you want to try running https://www.npmjs.com/package/@amcasey/ts-analyze-trace? It might identify a portion of your code (or imported package) that seems to trigger the problem and which you can share without divulging any IP.

unional commented 3 years ago

I run into the same issue with https://github.com/unional/type-plus. Essentially similar issue with zod

dagstuan commented 3 years ago

@amcasey sure thing, thank you for the help!

I ran the trace and figured out that a utility type I wrote a year or so ago to help with redux-form typings (DeepPartialExceptArrays<T>) is causing the issue, along with two type guards. I created a repro here. If you leave the tab open it eventually crashes. Without the type guards it works fine, and it also works fine in TS 4.2

Edit: Oh, and it also works fine with only one of the type guards. The issue seems to arise with the intersection type generated by applying both type guards.

adam-thomas-privitar commented 3 years ago

Just a note that Zod 3.2 is out and it now works. Still, theres some underlying issue here.

amcasey commented 3 years ago

@dagstuan Fantastic! I'll leave it up to @weswigham to decide whether you're seeing the same underlying issue (I suspect so).

grantila commented 3 years ago

I've seen this repeatedly too in different project (can't share the code yet). E.g. usages suretype and meta-types (both of which I'm the author of). (Again, not in these packages per se, but usages of them).

I've stumbled on this many times from at least 3.x. I think TypeScript would benefit from a rather massive bump in meta programming support and much higher limits. I remember back when C++ template programming was unbearably slow, and then about 10 years ago, compilers made a huge leap and started handling meta programming several orders of magnitude faster. I'd love for this to get prio over new features in the language 🙏

goleary commented 3 years ago

Just a note that Zod 3.2 is out and it now works. Still, theres some underlying issue here.

I'm running Zod 3.2 & TS 4.3.4 and I am experiencing this issue.

Update: whoops I believe this was due to a zod/ts version mismatch between my project & a dependency.

dagstuan commented 3 years ago

Any news on this? I attempted to re-run my repro with 4.4.0-beta and it still fails.

xxleyi commented 3 years ago

Had same problem since 4.3, also in 4.4.2, only thing I can do is lock TS version in 4.2 😔

angusryer commented 2 years ago

I've created a minimal repro here that demonstrates this using Material UI as well. Basically, I'm doing these things:

If I remove the intersection of prop types or the attempt to merge values into one of the base component's props, all compiles well.

I've tried this with ts@next, ts@4.5.4, ts@4.5.2, and ts@4.2.4, as well as node 14.18.2 and 16.5.0 with the same results. It could just be that I just shouldn't be trying to "forward" base component props in the way that I have, but still, I don't think it should cause a fatal error. It should be detected and thrown instead.

Here's the code from the repro that produces the problem for me:

import React from "react";
import { styled, SxProps, TextField, TextFieldProps } from "@mui/material";

const StyledTextField = styled(TextField)<TextFieldProps>({ // <-- Using this base component
  border: "1px solid red"
});

type StyledTextFieldWrapperProps = {
  customWidth?: number | string;
  sx?: SxProps;
};

const StyledTextFieldWrapper = ({
  customWidth,
  sx,
...props
}: StyledTextFieldWrapperProps & TextFieldProps) => { // <-- And this intersection which combines the base + wrapper prop types
  return <StyledTextField sx={{ width: customWidth, ...sx }} {...props} />; // <-- With this attempt to merge objects (sx prop)
};

export default function App() {
  return (
    <div>
      <StyledTextFieldWrapper customWidth="80%" />
    </div>
  );
}
EvHaus commented 2 years ago

Running into OOM errors after upgrading from 4.5.5 to 4.6.2. We're not using zod. Curious if something changed from 4.5 to 4.6 that could cause this problem?

$ tsc --noEmit

<--- Last few GCs --->

[28:0x6298a50]    8[281](https://github.com/myproject/runs/5573794446?check_suite_focus=true#step:2:281)2 ms: Scavenge (reduce) 1021.5 (1041.0) -> 1020.7 (1041.0) MB, 5.1 / 0.0 ms  (average mu = 0.116, current mu = 0.010) allocation failure 
[28:0x6298a50]    8[283](https://github.com/myproject/runs/5573794446?check_suite_focus=true#step:2:283)0 ms: Scavenge (reduce) 1021.6 (1041.0) -> 1021.0 (1041.3) MB, 6.2 / 0.0 ms  (average mu = 0.116, current mu = 0.010) allocation failure 
[28:0x6298a50]    83014 ms: Scavenge (reduce) 1021.7 (1041.3) -> 1021.1 (1041.5) MB, 7.8 / 0.0 ms  (average mu = 0.116, current mu = 0.010) allocation failure 

<--- JS stacktrace --->

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
 1: 0xb09980 node::Abort() [/usr/local/bin/node]
 2: 0xa1c235 node::FatalError(char const*, char const*) [/usr/local/bin/node]
 3: 0xcf77be v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node]
 4: 0xcf7b37 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node]
 5: 0xeaf3d5  [/usr/local/bin/node]
 6: 0xeafeb6  [/usr/local/bin/node]
 7: 0xebe3de  [/usr/local/bin/node]
 8: 0xebee20 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/usr/local/bin/node]
 9: 0xec1d9e v8::internal::Heap::AllocateRawWithRetryOrFailSlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/usr/local/bin/node]
10: 0xe832da v8::internal::Factory::NewFillerObject(int, bool, v8::internal::AllocationType, v8::internal::AllocationOrigin) [/usr/local/bin/node]
11: 0x11fc026 v8::internal::Runtime_AllocateInYoungGeneration(int, unsigned long*, v8::internal::Isolate*) [/usr/local/bin/node]
12: 0x15f0a99  [/usr/local/bin/node]
Aborted (core dumped)
amcasey commented 2 years ago

@EvHaus Have you tried using performance tracing to isolate a repro?

mtt87 commented 2 years ago

I'm also having issues moving from 4.5.5 to 4.6.2 while doing a type check tsc --noEmit -p tsconfig.json and one component is taking a crazy amount of time when usually the whole process takes between 3 and 8 seconds.

The compoent involved is a Button created with @stitches/react so I think there is a pattern here that something is wrong with libraries that are using CSS types perhaps.

I followed the instructions https://github.com/microsoft/TypeScript/wiki/Performance#performance-tracing but no idea if this is a problem on my side or a regression in Typescript 👀

Adding this: the memory usage is constantly increasing but eventually the process ends (I'm on OS X with 32GB RAM)

`$ npx analyze-trace trace` ``` Hot Spots └─ Check file /src/components/ui/button.tsx (94911ms) └─ Check deferred node from (line 155, char 5) to (line 185, char 20) (94848ms) └─ Compare types 15946 and 2127 (93953ms) └─ Compare types 15946 and 2118 (93953ms) └─ Determine variance of type 1987 (93906ms) ├─ Compare types 78756 and 78764 (15979ms) │ └─ Compare types 78756 and 78761 (15815ms) │ ├─ {"id":78756,"kind":"AliasedIntersection","name":"CSS","aliasTypeArguments":[1938,43,1983,1979],"count":5,"types":[78749,78751,78753,1981,78755],"location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":18,"char":1}} │ │ ├─ {"id":1938,"kind":"TypeParameter","name":"Media","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":19,"char":2}} │ │ ├─ {"id":43,"kind":"TypeParameter"} │ │ ├─ {"id":1983,"kind":"TypeParameter","name":"ThemeMap","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":21,"char":2}} │ │ ├─ {"id":1979,"kind":"TypeParameter","name":"Utils","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":22,"char":2}} │ │ ├─ {"id":78749,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":25,"char":4}} │ │ ├─ {"id":78751,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ ├─ {"id":78753,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":40,"char":4}} │ │ ├─ {"id":1981,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":85,"char":4}} │ │ └─ {"id":78755,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":93,"char":4}} │ └─ {"id":78761,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":40,"char":4}} ├─ Compare types 231488 and 231496 (15823ms) │ └─ Compare types 231488 and 231491 (15823ms) │ ├─ {"id":231488,"kind":"AliasedIntersection","name":"CSS","aliasTypeArguments":[1938,1986,1983,43],"count":5,"types":[231481,1975,231483,231485,231487],"location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":18,"char":1}} │ │ ├─ {"id":1938,"kind":"TypeParameter","name":"Media","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":19,"char":2}} │ │ ├─ {"id":1986,"kind":"TypeParameter","name":"Theme","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":20,"char":2}} │ │ ├─ {"id":1983,"kind":"TypeParameter","name":"ThemeMap","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":21,"char":2}} │ │ ├─ {"id":43,"kind":"TypeParameter"} │ │ ├─ {"id":231481,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":25,"char":4}} │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ ├─ {"id":231483,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":40,"char":4}} │ │ ├─ {"id":231485,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":85,"char":4}} │ │ └─ {"id":231487,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":93,"char":4}} │ └─ {"id":231491,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":40,"char":4}} ├─ Compare types 78764 and 78756 (15815ms) │ └─ Compare types 78764 and 78753 (15599ms) │ ├─ {"id":78764,"kind":"AliasedIntersection","name":"CSS","aliasTypeArguments":[1938,44,1983,1979],"count":5,"types":[78757,78759,78761,1981,78763],"location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":18,"char":1}} │ │ ├─ {"id":1938,"kind":"TypeParameter","name":"Media","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":19,"char":2}} │ │ ├─ {"id":44,"kind":"TypeParameter"} │ │ ├─ {"id":1983,"kind":"TypeParameter","name":"ThemeMap","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":21,"char":2}} │ │ ├─ {"id":1979,"kind":"TypeParameter","name":"Utils","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":22,"char":2}} │ │ ├─ {"id":78757,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":25,"char":4}} │ │ ├─ {"id":78759,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ ├─ {"id":78761,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":40,"char":4}} │ │ ├─ {"id":1981,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":85,"char":4}} │ │ └─ {"id":78763,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":93,"char":4}} │ └─ {"id":78753,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":40,"char":4}} ├─ Compare types 231496 and 231488 (15440ms) │ └─ Compare types 231496 and 231485 (15435ms) │ ├─ {"id":231496,"kind":"AliasedIntersection","name":"CSS","aliasTypeArguments":[1938,1986,1983,44],"count":5,"types":[231489,1975,231491,231493,231495],"location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":18,"char":1}} │ │ ├─ {"id":1938,"kind":"TypeParameter","name":"Media","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":19,"char":2}} │ │ ├─ {"id":1986,"kind":"TypeParameter","name":"Theme","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":20,"char":2}} │ │ ├─ {"id":1983,"kind":"TypeParameter","name":"ThemeMap","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":21,"char":2}} │ │ ├─ {"id":44,"kind":"TypeParameter"} │ │ ├─ {"id":231489,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":25,"char":4}} │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ ├─ {"id":231491,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":40,"char":4}} │ │ ├─ {"id":231493,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":85,"char":4}} │ │ └─ {"id":231495,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":93,"char":4}} │ └─ {"id":231485,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":85,"char":4}} ├─ Compare types 155144 and 155154 (15072ms) │ └─ Compare types 155144 and 155149 (14981ms) │ ├─ {"id":155144,"kind":"AliasedIntersection","name":"CSS","aliasTypeArguments":[1938,1986,43,1979],"count":5,"types":[155135,155137,155139,155141,155143],"location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":18,"char":1}} │ │ ├─ {"id":1938,"kind":"TypeParameter","name":"Media","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":19,"char":2}} │ │ ├─ {"id":1986,"kind":"TypeParameter","name":"Theme","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":20,"char":2}} │ │ ├─ {"id":43,"kind":"TypeParameter"} │ │ ├─ {"id":1979,"kind":"TypeParameter","name":"Utils","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":22,"char":2}} │ │ ├─ {"id":155135,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":25,"char":4}} │ │ ├─ {"id":155137,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ ├─ {"id":155139,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":40,"char":4}} │ │ ├─ {"id":155141,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":85,"char":4}} │ │ └─ {"id":155143,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":93,"char":4}} │ └─ {"id":155149,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":40,"char":4}} ├─ Compare types 155154 and 155144 (14572ms) │ └─ Compare types 155154 and 155139 (14300ms) │ ├─ {"id":155154,"kind":"AliasedIntersection","name":"CSS","aliasTypeArguments":[1938,1986,44,1979],"count":5,"types":[155145,155147,155149,155151,155153],"location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":18,"char":1}} │ │ ├─ {"id":1938,"kind":"TypeParameter","name":"Media","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":19,"char":2}} │ │ ├─ {"id":1986,"kind":"TypeParameter","name":"Theme","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":20,"char":2}} │ │ ├─ {"id":44,"kind":"TypeParameter"} │ │ ├─ {"id":1979,"kind":"TypeParameter","name":"Utils","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":22,"char":2}} │ │ ├─ {"id":155145,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":25,"char":4}} │ │ ├─ {"id":155147,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ ├─ {"id":155149,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":40,"char":4}} │ │ ├─ {"id":155151,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":85,"char":4}} │ │ └─ {"id":155153,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":93,"char":4}} │ └─ {"id":155139,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":40,"char":4}} ├─ Compare types 21391 and 21397 (600ms) │ └─ Compare types 21391 and 21394 (599ms) │ └─ Compare types 1975 and 21394 (599ms) │ └─ Compare types 25830 and 21397 (594ms) │ ├─ {"id":25830,"kind":"Union","count":428,"types":[25402,25403,25404,25405,25406,25407,25408,25409,25410,25411,25412,25413,25414,25415,25416,25417,25418,25419,25420,25421,25422,25423,25424,25425,25426,25427,25428,25429,25430,25431,25432,25433,25434,25435,25436,25437,25438,25439,25440,25441,25442,25443,25444,25445,25446,25447,25448,25449,25450,25451,25452,25453,25454,25455,25456,25457,25458,25459,25460,25461,25462,25463,25464,25465,25466,25467,25468,25469,25470,25471,25472,25473,25474,25475,25476,25477,25478,25479,25480,25481,25482,25483,25484,25485,25486,25487,25488,25489,25490,25491,25492,25493,25494,25495,25496,25497,25498,25499,25500,25501,25502,25503,25504,25505,25506,25507,25508,25509,25510,25511,25512,25513,25514,25515,25516,25517,25518,25519,25520,25521,25522,25523,25524,25525,25526,25527,25528,25529,25530,25531,25532,25533,25534,25535,25536,25537,25538,25539,25540,25541,25542,25543,25544,25545,25546,25547,25548,25549,25550,25551,25552,25553,25554,25555,25556,25557,25558,25559,25560,25561,25562,25563,25564,25565,25566,25567,25568,25569,25570,25571,25572,25573,25574,25575,25576,25577,25578,25579,25580,25581,25582,25583,25584,25585,25586,25587,25588,25589,25590,25591,25592,25593,25594,25595,25596,25597,25598,25599,25600,25601,25602,25603,25604,25605,25606,25607,25608,25609,25610,25611,25612,25613,25614,25615,25616,25617,25618,25619,25620,25621,25622,25623,25624,25625,25626,25627,25628,25629,25630,25631,25632,25633,25634,25635,25636,25637,25638,25639,25640,25641,25642,25643,25644,25645,25646,25647,25648,25649,25650,25651,25652,25653,25654,25655,25656,25657,25658,25659,25660,25661,25662,25663,25664,25665,25666,25667,25668,25669,25670,25671,25672,25673,25674,25675,25676,25677,25678,25679,25680,25681,25682,25683,25684,25685,25686,25687,25688,25689,25690,25691,25692,25693,25694,25695,25696,25697,25698,25699,25700,25701,25702,25703,25704,25705,25706,25707,25708,25709,25710,25711,25712,25713,25714,25715,25716,25717,25718,25719,25720,25721,25722,25723,25724,25725,25726,25727,25728,25729,25730,25731,25732,25733,25734,25735,25736,25737,25738,25739,25740,25741,25742,25743,25744,25745,25746,25747,25748,25749,25750,25751,25752,25753,25754,25755,25756,25757,25758,25759,25760,25761,25762,25763,25764,25765,25766,25767,25768,25769,25770,25771,25772,25773,25774,25775,25776,25777,25778,25779,25780,25781,25782,25783,25784,25785,25786,25787,25788,25789,25790,25791,25792,25793,25794,25795,25796,25797,25798,25799,25800,25801,25802,25803,25804,25805,25806,25807,25808,25809,25810,25811,25812,25813,25814,25815,25816,25817,25818,25819,25820,25821,25822,25823,25824,25825,25826,25827,25828,25829]} │ │ ├─ {"id":25402,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24972} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24972,"kind":"Intersection","count":3,"types":[21393,1378,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1378,"kind":"StringLiteral","value":"\"alignContent\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25403,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24973} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24973,"kind":"Intersection","count":3,"types":[21393,1379,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1379,"kind":"StringLiteral","value":"\"alignItems\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25404,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24974} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24974,"kind":"Intersection","count":3,"types":[21393,1380,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1380,"kind":"StringLiteral","value":"\"alignSelf\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25405,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24975} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24975,"kind":"Intersection","count":3,"types":[21393,1381,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1381,"kind":"StringLiteral","value":"\"alignTracks\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25406,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24976} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24976,"kind":"Intersection","count":3,"types":[21393,1382,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1382,"kind":"StringLiteral","value":"\"animationDelay\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25407,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24977} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24977,"kind":"Intersection","count":3,"types":[21393,1383,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1383,"kind":"StringLiteral","value":"\"animationDirection\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25408,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24978} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24978,"kind":"Intersection","count":3,"types":[21393,1384,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1384,"kind":"StringLiteral","value":"\"animationDuration\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25409,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24979} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24979,"kind":"Intersection","count":3,"types":[21393,1385,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1385,"kind":"StringLiteral","value":"\"animationFillMode\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25410,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24980} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24980,"kind":"Intersection","count":3,"types":[21393,1386,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1386,"kind":"StringLiteral","value":"\"animationIterationCount\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25411,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24981} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24981,"kind":"Intersection","count":3,"types":[21393,1387,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1387,"kind":"StringLiteral","value":"\"animationName\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25412,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24982} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24982,"kind":"Intersection","count":3,"types":[21393,1388,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1388,"kind":"StringLiteral","value":"\"animationPlayState\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25413,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24983} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24983,"kind":"Intersection","count":3,"types":[21393,1389,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1389,"kind":"StringLiteral","value":"\"animationTimingFunction\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25414,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24984} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24984,"kind":"Intersection","count":3,"types":[21393,1390,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1390,"kind":"StringLiteral","value":"\"appearance\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25415,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24985} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24985,"kind":"Intersection","count":3,"types":[21393,1391,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1391,"kind":"StringLiteral","value":"\"aspectRatio\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25416,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24986} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24986,"kind":"Intersection","count":3,"types":[21393,1392,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1392,"kind":"StringLiteral","value":"\"backdropFilter\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25417,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24987} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24987,"kind":"Intersection","count":3,"types":[21393,1393,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1393,"kind":"StringLiteral","value":"\"backfaceVisibility\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25418,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24988} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24988,"kind":"Intersection","count":3,"types":[21393,1394,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1394,"kind":"StringLiteral","value":"\"backgroundAttachment\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25419,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24989} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24989,"kind":"Intersection","count":3,"types":[21393,1395,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1395,"kind":"StringLiteral","value":"\"backgroundBlendMode\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25420,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24990} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24990,"kind":"Intersection","count":3,"types":[21393,1396,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1396,"kind":"StringLiteral","value":"\"backgroundClip\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25421,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24991} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24991,"kind":"Intersection","count":3,"types":[21393,1397,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1397,"kind":"StringLiteral","value":"\"backgroundColor\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25422,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24992} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24992,"kind":"Intersection","count":3,"types":[21393,1398,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1398,"kind":"StringLiteral","value":"\"backgroundImage\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25423,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24993} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24993,"kind":"Intersection","count":3,"types":[21393,1399,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1399,"kind":"StringLiteral","value":"\"backgroundOrigin\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25424,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24994} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} │ │ │ └─ {"id":24994,"kind":"Intersection","count":3,"types":[21393,1400,21395]} │ │ │ ├─ {"id":21393,"kind":"Other"} │ │ │ ├─ {"id":1400,"kind":"StringLiteral","value":"\"backgroundPositionX\""} │ │ │ └─ {"id":21395,"kind":"TypeParameter","name":"K","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":26,"char":4}} │ │ ├─ {"id":25425,"kind":"IndexedAccess","indexedAccessObjectType":1975,"indexedAccessIndexType":24995} │ │ │ ├─ {"id":1975,"kind":"AnonymousType","location":{"path":"/node_modules/@stitches/react/types/css-util.d.ts","line":29,"char":4}} ```
Component code ```tsx import Box from '@components/ui/Box' import Flex from '@components/ui/Flex' import Spinner from '@components/ui/Spinner' import { styled, theme } from '@src/stitches.config' import * as React from 'react' const StyledButton = styled('button', { // styles here }) export interface ButtonProps extends React.ComponentProps { as?: keyof JSX.IntrinsicElements loading?: boolean } const Button: React.FC = React.forwardRef( ( { children, loading = false, size, variant = 'solid', onClick, ...remainingProps }: ButtonProps, ref, ) => ( {children} {loading ? ( ) : null} ), ) Button.displayName = 'Button' export default Button ```
EvHaus commented 2 years ago

@EvHaus Have you tried using performance tracing to isolate a repro?

Here's the output I got:

See trace analysis ``` $ tsc --noEmit --generateTrace tracing || yarn analyze-trace tracing <--- Last few GCs ---> [28:0x5d9fb10] 62608 ms: Scavenge (reduce) 1020.8 (1041.2) -> 1020.2 (1041.2) MB, 4.3 / 0.0 ms (average mu = 0.137, current mu = 0.007) allocation failure [28:0x5d9fb10] 62617 ms: Scavenge (reduce) 1020.8 (1041.2) -> 1020.2 (1041.4) MB, 3.1 / 0.0 ms (average mu = 0.137, current mu = 0.007) allocation failure [28:0x5d9fb10] 63840 ms: Mark-sweep (reduce) 1021.1 (1041.4) -> 1020.0 (1041.7) MB, 1218.5 / 0.0 ms (average mu = 0.113, current mu = 0.086) allocation failure scavenge might not succeed <--- JS stacktrace ---> FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory 1: 0xb09980 node::Abort() [/usr/local/bin/node] 2: 0xa1c235 node::FatalError(char const*, char const*) [/usr/local/bin/node] 3: 0xcf784e v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node] 4: 0xcf7bc7 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node] 5: 0xeaf465 [/usr/local/bin/node] 6: 0xeaff46 [/usr/local/bin/node] 7: 0xebe46e [/usr/local/bin/node] 8: 0xebeeb0 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/usr/local/bin/node] 9: 0xec1e2e v8::internal::Heap::AllocateRawWithRetryOrFailSlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/usr/local/bin/node] 10: 0xe8336a v8::internal::Factory::NewFillerObject(int, bool, v8::internal::AllocationType, v8::internal::AllocationOrigin) [/usr/local/bin/node] 11: 0x11fc0b6 v8::internal::Runtime_AllocateInYoungGeneration(int, unsigned long*, v8::internal::Isolate*) [/usr/local/bin/node] 12: 0x15f0b19 [/usr/local/bin/node] Aborted (core dumped) $ /srv/node_modules/.bin/analyze-trace tracing Trace ended unexpectedly > checkSourceFile: {"path":"/srv/client/node_modules/@babel/types/lib/index.d.ts"} Hot Spots ├─ Check file /srv/client/node_modules/@babel/types/lib/index.d.ts (18168ms) │ ├─ Compare types 316395 and 315095 (17137ms) │ │ └─ Compare types 318628 and 315095 (16964ms) │ │ ├─ Compare types 318625 and 315095 (2515ms) │ │ ├─ Compare types 318622 and 315095 (1430ms) │ │ ├─ Compare types 318627 and 315095 (1[286](https://github.com/myrepo/runs/5957928826?check_suite_focus=true#step:2:286)ms) │ │ │ └─ Compare types 318627 and 314202 (1219ms) │ │ ├─ Compare types 318501 and 315095 (699ms) │ │ └─ Compare types 318597 and 315095 (589ms) │ │ └─ Compare types 318597 and 314048 (393ms) │ │ └─ Compare types 316618 and 314048 (392ms) │ │ └─ Compare types 317[307](https://github.com/myrepo/runs/5957928826?check_suite_focus=true#step:2:307) and [314](https://github.com/myrepo/runs/5957928826?check_suite_focus=true#step:2:314)048 (392ms) │ └─ Compare types [315](https://github.com/myrepo/runs/5957928826?check_suite_focus=true#step:2:315)391 and 315095 (881ms) ├─ Check file /srv/packages/kraken-markdown/src/plugins/remark-github-emoji.ts (2148ms) │ └─ Check deferred node from (line 36, char 10) to (line 88, char 4) (2134ms) │ └─ Check expression from (line 37, char 5) to (line 87, char 7) (2134ms) ├─ Check file /srv/node_modules/@types/react/index.d.ts (1452ms) │ └─ Compare types 10850 and 10860 (574ms) │ └─ Compare types 11081 and 10860 (392ms) ├─ Check file /srv/node_modules/@emotion/serialize/types/index.d.ts (1431ms) └─ Check file /srv/node_modules/csstype/index.d.ts (678ms) Duplicate packages ├─ @types/express-serve-static-core │ ├─ Version 4.17.28 from /srv/node_modules/@types/express-serve-static-core │ └─ Version 4.17.26 from /srv/node_modules/@types/express/node_modules/@types/express-serve-static-core ├─ @types/history │ ├─ Version 4.7.11 from /srv/node_modules/@types/history │ └─ Version 4.7.9 from /srv/node_modules/@types/react-router-dom/node_modules/@types/react-router/node_modules/@types/history └─ csstype ├─ Version 2.6.19 from /srv/node_modules/@emotion/serialize/node_modules/csstype └─ Version 3.0.10 from /srv/node_modules/csstype ```
amcasey commented 2 years ago

@EvHaus If it were me, I'd try to eliminate that version mismatch for csstype. Those types can get pretty big and forcing the compiler to compare similar types structurally is a recipe for problems.

Without the corresponding types file, it's hard to be more specific about which types/packages are causing slowdowns. (I'm not sure why you didn't get that output - maybe it gets skipped if the trace is incomplete.) You can use the print-trace-types script to pretty-print them after the fact.

mtt87 commented 2 years ago

My issue (slowness with CSS types) doesn't happen with latest 4.7 beta npm i typescript@beta 👀

EvHaus commented 2 years ago

Unfortunately removing the duplicate csstype didn't help, but now I'm getting new details in the tracing:

See trace analysis ``` $ tsc --noEmit --generateTrace tracing || yarn analyze-trace tracing <--- Last few GCs ---> [28:0x4f4fb10] 64621 ms: Mark-sweep (reduce) 1020.9 (1041.7) -> 1020.0 (1041.7) MB, 1303.9 / 0.0 ms (average mu = 0.115, current mu = 0.007) allocation failure scavenge might not succeed [28:0x4f4fb10] 66002 ms: Mark-sweep (reduce) 1021.3 (1041.7) -> 1020.0 (1041.7) MB, 1320.4 / 0.0 ms (average mu = 0.079, current mu = 0.044) allocation failure scavenge might not succeed <--- JS stacktrace ---> FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory 1: 0xb09980 node::Abort() [/usr/local/bin/node] 2: 0xa1c235 node::FatalError(char const*, char const*) [/usr/local/bin/node] 3: 0xcf784e v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node] 4: 0xcf7bc7 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node] 5: 0xeaf465 [/usr/local/bin/node] 6: 0xeaff46 [/usr/local/bin/node] 7: 0xebe46e [/usr/local/bin/node] 8: 0xebeeb0 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/usr/local/bin/node] 9: 0xec1e2e v8::internal::Heap::AllocateRawWithRetryOrFailSlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/usr/local/bin/node] 10: 0xe830a2 v8::internal::Factory::AllocateRaw(int, v8::internal::AllocationType, v8::internal::AllocationAlignment) [/usr/local/bin/node] 11: 0xe7d9bc v8::internal::FactoryBase::AllocateRawArray(int, v8::internal::AllocationType) [/usr/local/bin/node] 12: 0xe7da95 v8::internal::FactoryBase::NewFixedArrayWithFiller(v8::internal::Handle, int, v8::internal::Handle, v8::internal::AllocationType) [/usr/local/bin/node] 13: 0x10e631e v8::internal::MaybeHandle v8::internal::OrderedHashTable::Allocate(v8::internal::Isolate*, int, v8::internal::AllocationType) [/usr/local/bin/node] 14: 0x10e63d3 v8::internal::MaybeHandle v8::internal::OrderedHashTable::Rehash(v8::internal::Isolate*, v8::internal::Handle, int) [/usr/local/bin/node] 15: 0x11f24e5 v8::internal::Runtime_MapGrow(int, unsigned long*, v8::internal::Isolate*) [/usr/local/bin/node] 16: 0x15f0b19 [/usr/local/bin/node] Aborted (core dumped) $ /srv/node_modules/.bin/analyze-trace tracing Trace ended unexpectedly > checkSourceFile: {"path":"/srv/node_modules/@babel/types/lib/index.d.ts"} Hot Spots ├─ Check file /srv/node_modules/@babel/types/lib/index.d.ts (16210ms) │ ├─ Compare types 335994 and 332482 (2569ms) │ │ └─ Compare types 335994 and 331395 (1304ms) │ ├─ Compare types 335989 and 332482 (1434ms) │ ├─ Compare types 335976 and 332482 (877ms) │ ├─ Compare types 33[277](https://github.com/myrepo/runs/6030330434?check_suite_focus=true#step:2:277)9 and 332482 (821ms) │ └─ Compare types 335902 and 332482 (522ms) ├─ Check file /srv/node_modules/@emotion/serialize/types/index.d.ts (2475ms) ├─ Check file /srv/packages/kraken-markdown/src/plugins/remark-github-emoji.ts (2067ms) │ └─ Check deferred node from (line 36, char 10) to (line 88, char 4) (2053ms) │ └─ Check expression from (line 37, char 5) to (line 87, char 7) (2053ms) └─ Check file /srv/node_modules/@types/react/index.d.ts (1680ms) └─ Compare types 10878 and 10888 (780ms) └─ Compare types 11109 and 10888 (506ms) No duplicate packages found ```
amcasey commented 2 years ago

@EvHaus That's a very long time to spend checking the babel types and I'd be interested to know which version you're on. Having said that, it seems like there's little benefit in checking them yourself, so I'd probably build with skipLibCheck.

EvHaus commented 2 years ago

@amcasey We're using @babel/types version 7.17.0 and I've ensured the package is deduplicated. I tried with skipLibCheck and that fixed the issue 🎉. Looking at the docs for the skipLibCheck makes me a bit nervous about turning it off. Are we going to lose some type safety as a result of disabling it?

Any ideas what could have changed between 4.5 and 4.6 that could explain this problem? I'm trying to evaluate if it's better to stick to 4.5 or to move to 4.6 with skipLibCheck on.

amcasey commented 2 years ago

@EvHaus skipLibCheck can alert you to conflicts between your dependencies, but I generally turn it off myself, since it doesn't find problems in the code I'm working on. If you're concerned, you can try skipping the checks locally and running them in CI.

Notable exception: If you hand-author .d.ts files, you probably do not want skipLibCheck.

Without knowing the specifics, my guess would be that 4.6 does more checking (i.e. catches more bugs) than 4.5 in a way that affects one or more of your dependencies. If you can share an example, I can look for a more specific explanation. If your code isn't available, it's usually possible to isolate a repro using analyze-trace, though that's obviously more work.

EvHaus commented 2 years ago

Not sure what you guys did, but typescript@4.8.2 fixed my memory issues. No more OOM failures, and in general I'm seeing TypeScript running MUCH faster. Nice work! 🎉

abenhamdine commented 1 year ago

Also experiencing this with typescript@4.9.4, after switching my machine from a MacBookPro 2019 (16 Go), to a Windows 11 PC (16 Go also) (nothing else changed : same code base, same command, etc). We don't use Zod but we have a very large codebase. We were surprised because it's the first time we see an OOM error with tsc, in 5 years.

cullylarson commented 1 year ago

I'm seeing this with:

  • typescript: 4.9.4
  • zod: 3.21.4

Downgrading to zod: 3.21.2 resolves the issue. Upgrading to typescript: 4.9.5 doesn't make a difference.

joao-moonward commented 1 year ago

Hello, everyone! I'm getting the same error. I had a legacy project and just started changing some js files to Typescript. My tsconfig:

{
  "compilerOptions": {
    "module": "commonjs",
    "declaration": true,
    "removeComments": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "allowSyntheticDefaultImports": true,
    "target": "es2017",
    "sourceMap": true,
    "incremental": true,
    "skipLibCheck": true,
    "strictNullChecks": true,
    "noImplicitAny": true,
    "strictBindCallApply": false,
    "forceConsistentCasingInFileNames": false,
    "noFallthroughCasesInSwitch": false,
    "noUncheckedIndexedAccess": true,
    "allowJs": true,
    "outDir": "./dist",
    "checkJs": false,
  },
}

In my Mac mini (Monterey, M1 2020, 8GB). When I started the build process, I realised the node consumption exceeded 100% CPU usage.

PID    COMMAND      %CPU  TIME     #TH    #WQ  #PORT MEM    PURG
20928  node         160.0 00:04.77 7/1    0    18    740M+  0B

It builds with success, though. Otherwise, in my EC2 instance (Ubuntu 22.04.1 LTS, Intel(R) Xeon(R) CPU E5-2676 v3 @ 2.40GHz) shows me this error:

<--- Last few GCs --->

[1173:0x6634210]    15930 ms: Mark-sweep (reduce) 481.4 (493.8) -> 481.1 (491.0) MB, 440.3 / 0.0 ms  (+ 3.7 ms in 4 steps since start of marking, biggest step 1.7 ms, walltime since start of marking 457 ms) (average mu = 0.283, current mu = 0.279) finaliz[1173:0x6634210]    16090 ms: Scavenge (reduce) 482.2 (491.0) -> 481.4 (491.0) MB, 7.7 / 0.0 ms  (average mu = 0.283, current mu = 0.279) allocation failure; 

<--- JS stacktrace --->

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
 1: 0xbbf330 node::Abort() [node]
 2: 0xad464e  [node]
 3: 0xda4320 v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, v8::OOMDetails const&) [node]
 4: 0xda46d6 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, v8::OOMDetails const&) [node]
 5: 0xfa1b65  [node]
 6: 0xfa2116 v8::internal::Heap::RecomputeLimits(v8::internal::GarbageCollector) [node]
 7: 0xfb371d  [node]
 8: 0xfb4235 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [node]
 9: 0xfb69d8 v8::internal::Heap::HandleGCRequest() [node]
10: 0xf306f7 v8::internal::StackGuard::HandleInterrupts() [node]
11: 0x137441f v8::internal::Runtime_StackGuardWithGap(int, unsigned long*, v8::internal::Isolate*) [node]
12: 0x17fb2f9  [node]
Aborted (core dumped)
    PID USER      PR  NI    VIRT    RES    SHR S  %CPU  %MEM     TIME+ COMMAND                                                                   
   1933 ubuntu    20   0  790632 234228  29876 R  93.7  23.7   0:03.81 node             

I tried to increase the --max_old_space_size, but it seems stuck. Node version: v14.21.3

I tried typescript version 4.2.4 and the latest, 4.9.5.

Am I doing something wrong?

pascalporedda commented 1 year ago

Hello, everyone! I'm getting the same error. I had a legacy project and just started changing some js files to Typescript. My tsconfig:

{
  "compilerOptions": {
    "module": "commonjs",
    "declaration": true,
    "removeComments": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "allowSyntheticDefaultImports": true,
    "target": "es2017",
    "sourceMap": true,
    "incremental": true,
    "skipLibCheck": true,
    "strictNullChecks": true,
    "noImplicitAny": true,
    "strictBindCallApply": false,
    "forceConsistentCasingInFileNames": false,
    "noFallthroughCasesInSwitch": false,
    "noUncheckedIndexedAccess": true,
    "allowJs": true,
    "outDir": "./dist",
    "checkJs": false,
  },
}

In my Mac mini (Monterey, M1 2020, 8GB). When I started the build process, I realised the node consumption exceeded 100% CPU usage.

PID    COMMAND      %CPU  TIME     #TH    #WQ  #PORT MEM    PURG
20928  node         160.0 00:04.77 7/1    0    18    740M+  0B

It builds with success, though. Otherwise, in my EC2 instance (Ubuntu 22.04.1 LTS, Intel(R) Xeon(R) CPU E5-2676 v3 @ 2.40GHz) shows me this error:

<--- Last few GCs --->

[1173:0x6634210]    15930 ms: Mark-sweep (reduce) 481.4 (493.8) -> 481.1 (491.0) MB, 440.3 / 0.0 ms  (+ 3.7 ms in 4 steps since start of marking, biggest step 1.7 ms, walltime since start of marking 457 ms) (average mu = 0.283, current mu = 0.279) finaliz[1173:0x6634210]    16090 ms: Scavenge (reduce) 482.2 (491.0) -> 481.4 (491.0) MB, 7.7 / 0.0 ms  (average mu = 0.283, current mu = 0.279) allocation failure; 

<--- JS stacktrace --->

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
 1: 0xbbf330 node::Abort() [node]
 2: 0xad464e  [node]
 3: 0xda4320 v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, v8::OOMDetails const&) [node]
 4: 0xda46d6 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, v8::OOMDetails const&) [node]
 5: 0xfa1b65  [node]
 6: 0xfa2116 v8::internal::Heap::RecomputeLimits(v8::internal::GarbageCollector) [node]
 7: 0xfb371d  [node]
 8: 0xfb4235 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [node]
 9: 0xfb69d8 v8::internal::Heap::HandleGCRequest() [node]
10: 0xf306f7 v8::internal::StackGuard::HandleInterrupts() [node]
11: 0x137441f v8::internal::Runtime_StackGuardWithGap(int, unsigned long*, v8::internal::Isolate*) [node]
12: 0x17fb2f9  [node]
Aborted (core dumped)
    PID USER      PR  NI    VIRT    RES    SHR S  %CPU  %MEM     TIME+ COMMAND                                                                   
   1933 ubuntu    20   0  790632 234228  29876 R  93.7  23.7   0:03.81 node             

I tried to increase the --max_old_space_size, but it seems stuck. Node version: v14.21.3

I tried typescript version 4.2.4 and the latest, 4.9.5.

Am I doing something wrong?

Experiencing the same here on my MBP with M2 Pro.

armtuk commented 1 year ago

Having this (or similar) issue with zod 3.20.6 and typescript 4.8.2

karlhorky commented 1 year ago

I guess there's another issue about JavaScript heap out of memory errors over here (about 4.9.3):

stephenasuncionDEV commented 1 year ago

Still getting this issue. I'm getting the following error:

FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory

when running tsc --pretty --noEmit even if I set the space size like the following:

cross-env NODE_OPTIONS=--max-old-space-size=10240 tsc --pretty --noEmit
LironHazan commented 1 year ago

I've also had an issue with moving to typescript ~5.1 (or even ~5.0 TBH) in a React components library (it uses mui), Here's how I resolved the TS2590: Expression produces a union type that is too complex to represent error:

tsx files:


// Changed
<StyledChip variant={variant} {...otherProps}>
// To
<StyledChip
    variant={variant as TChipVariants}
    {...(otherProps as React.HTMLAttributes<HTMLDivElement>)}
>

And

// Changed
{...otherProps}
// To
const { sx, ...restProps } = otherProps
...
<StyledRadioGroup {...restProps} >

But had to increase max-old-space-size dramatically to 16384 in order to get the relevant errors.. I hope it helps anyone..

deannabosschert commented 3 months ago

If anyone needs a quick/temp fix: downgrading to 4.2.4 fixed the problem for me.

earthjan commented 1 month ago

Using MUI (I'm using MUI v5.14.16) may give the heap-out-of-memory error. Upgrading the TS to 4.2.4 [reference] solves the problem if I continue using the SxProps of MUI. (After playing with setting the heap, tried upgrading to the latest TS version, but no luck.)

I have a util type CreateComponentProps that's used when creating a component prop type, and it's used throughout my React codebase. After adding the SxProps from MUI, I'm encountering the heap error, so I tried to remove it just to check if it's the root cause, and it is.

This may also seem related to the issue when using Zod.

export type CreateComponentProps<T = {}> = T & ComponentTestKit & MuiBaseComponent;
export interface MuiBaseComponent {
  className?: string;
  sx?: SxProps;
}

Environment

  • TypeScript: 5.2.2
  • React: v18.2.0
  • MUI: v5.14.16