buildSchemaSync increases build time on every build

[tzarger]

Describe the Bug
I am using NextJS API Routes with a graphql server. I use buildSchemaSync ... and it seems that every time NextJS rebuilds the server, when it calls buildSchemaSync to get the schema, slowness increases every time. For example:

First build: 53 ms
Second build: 103ms
Third build: 155ms
Fourth build 202ms
Fifth build: 284ms
Sixth build: 453ms

And keeps increasing until a full 7 seconds and and still rising. I end up having to kill the process and start over. Every new page visited intiial rebuilds the server since using SSR.

To Reproduce
NextJS v12.1.1 using API Routes.

Expected Behavior
Simply rebuild the schema at the 53ms build time every time.

Logs
None

Environment (please complete the following information):

• OS: Mac OS
• Node: 16.14.0
• Package version: 1.2.0-rc.1
• TypeScript version: 4.6.2

[MichalLytek]

The generated schema object should be cached and not generated on every page call.

[tzarger]

You can put your schema into global object (or now globalThis), so that it will use the existing schema when built previously. Same trick works with serveless and others.

If I use globalThis then that would mean in order to pick up changes, I would need to kill the next process and call yarn dev once again, correct. Since the globalThis process would be the static initial build.

As a side note, this is not an issue when building and deployed, since the api routes are not rebuilt every time (when deploying with Docker vs. a serverless deployment).

[MichalLytek]

Maybe NextJS expose some hook/trigger, like HMR used to do? So that you can intercept that and react and rebuild the server.

[tzarger]

@MichalLytek I followed your getMetadataStorage and added the buildSchemaSync({...}) to global and that prevents it from building again, but the Metadata storage is still being called, where as the build() are not. This method below is still incrementing.

Overall performance is better since returning the original global, but I think this code below would almost be like a memory-leak when developing locally when it keeps increasing on every page.

 collectMutationHandlerMetadata(definition) {
        this.mutations.push(definition);
    }

This first page load, I have some comments and I see this output:

!!global.ApolloSchema false
getSchema() => Building

every subsequent, I see this (no getSchema() => Building):

!!global.ApolloSchema true

So I am pretty sure it is pulling the schema out of the global.ApolloSchema

In regard to the NextJS hook/trigger, I will take a look. Thanks for that.

[tzarger]

Hi @MichalLytek I ended up modifying the metadata-storage.js directly in node_modules to test out my theory... doing this works. This works with NextJS and does not require a global variable and also picks up changes when the server side has changes.

    collectQueryHandlerMetadata(definition) {
        const index = this.queries.findIndex(item => item.schemaName === definition.schemaName);
        if( index >= 0) {
            this.queries[index] = definition;
        } else {
            this.queries.push(definition);
        }
    }
    collectMutationHandlerMetadata(definition) {
        const index = this.mutations.findIndex(item => item.target.name === definition.target.name && item.schemaName === definition.schemaName);
        if( index >= 0) {
            this.mutations[index] = definition;
        } else {
            this.mutations.push(definition);
        }
    }
    collectSubscriptionHandlerMetadata(definition) {
        const index = this.subscriptions.findIndex(item => item.target.name === definition.target.name && item.methodName === definition.methodName && item.schemaName === definition.schemaName);
        if( index >= 0) {
            this.subscriptions[index] = definition;
        } else {
            this.subscriptions.push(definition);
        }
    }
    collectFieldResolverMetadata(definition) {
        const index = this.fieldResolvers.findIndex(item => item.target.name === definition.target.name && item.schemaName === definition.schemaName );
        if( index >= 0) {
            this.fieldResolvers[index] = definition;
        } else {
            this.fieldResolvers.push(definition);
        }
    }
    collectObjectMetadata(definition) {
        const index = this.objectTypes.findIndex(item => item.target.name === definition.target.name && item.name === definition.name);
        if( index >= 0) {
            this.objectTypes[index] = definition;
        } else {
            this.objectTypes.push(definition);
        }
    }
    collectInputMetadata(definition) {
        const index = this.inputTypes.findIndex(item => item.target.name === definition.target.name && item.name === definition.name);
        if( index >= 0) {
            this.inputTypes[index] = definition;
        } else {
            this.inputTypes.push(definition);
        }
    }
    collectArgsMetadata(definition) {
        const index = this.argumentTypes.findIndex(item =>  item.name === definition.name);
        if( index >= 0) {
            this.argumentTypes[index] = definition;
        } else {
            this.argumentTypes.push(definition);
        }
    }
    collectInterfaceMetadata(definition) {
        const index = this.interfaceTypes.findIndex(item => item.target.name === definition.target.name && item.name === definition.name );
        if( index >= 0) {
            this.interfaceTypes[index] = definition;
        } else {
            this.interfaceTypes.push(definition);
        }
    }
    collectAuthorizedFieldMetadata(definition) {
        const index = this.authorizedFields.findIndex(item => item.target.name === definition.target.name && item.fieldName === definition.fieldName);
        if( index >= 0) {
            this.authorizedFields[index] = definition;
        } else {
            this.authorizedFields.push(definition);
        }
    }
    collectEnumMetadata(definition) {
        const index = this.enums.findIndex(item => item.name === definition.name);
        if( index >= 0) {
            this.enums[index] = definition;
        } else {
            this.enums.push(definition);
        }
    }
    collectUnionMetadata(definition) {
        const unionSymbol = Symbol(definition.name);
        const union = {
            ...definition,
            symbol: unionSymbol,
        };

        const index = this.unions.findIndex(item => item.name === definition.name);
        if( index >= 0) {
            this.unions[index] = union;
        } else {
            this.unions.push(union);
        }
        return unionSymbol;
    }
    collectMiddlewareMetadata(definition) {
        const index = this.middlewares.findIndex(item => item.target.name === definition.target.name && item.fieldName === definition.fieldName);
        if( index >= 0) {
            this.middlewares[index] = definition;
        } else {
            this.middlewares.push(definition);
        }
    }
    collectResolverClassMetadata(definition) {
        const index = this.resolverClasses.findIndex(item => item.target.name === definition.target.name);
        if( index >= 0) {
            this.resolverClasses[index] = definition;
        } else {
            this.resolverClasses.push(definition);
        }
    }
    collectClassFieldMetadata(definition) {
        const index = this.fields.findIndex(item => item.target.name === definition.target.name && item.schemaName === definition.schemaName);
        if( index >= 0) {
            this.fields[index] = definition;
        } else {
            this.fields.push(definition);
        }
    }
    collectHandlerParamMetadata(definition) {
        const index = this.params.findIndex(item => item.target.name === definition.target.name && item.methodName === definition.methodName && item.kind === definition.kind && item.name === definition.name && item.index === definition.index);
        if( index >= 0) {
            this.params[index] = definition;
        } else {
            this.params.push(definition);
        }
    }
    collectDirectiveClassMetadata(definition) {
        const index = this.classDirectives.findIndex(item => item.target.name === definition.target.name && item.directive.nameOrDefinition === definition.directive.nameOrDefinition);
        if( index >= 0) {
            this.classDirectives[index] = definition;
        } else {
            this.classDirectives.push(definition);
        }
    }
    collectDirectiveFieldMetadata(definition) {
        const index = this.fieldDirectives.findIndex(item => item.target.name === definition.target.name && item.directive.nameOrDefinition === definition.directive.nameOrDefinition && item.fieldName === definition.fieldName);
        if( index >= 0) {
            this.fieldDirectives[index] = definition;
        } else {
            this.fieldDirectives.push(definition);
        }
    }
    collectExtensionsClassMetadata(definition) {
        const index = this.fieldDirectives.findIndex(item => item.target.name === definition.target.name && item.extensions.nameOrDefinition === definition.extensions.nameOrDefinition);
        if( index >= 0) {
            this.classExtensions[index] = definition;
        } else {
            this.classExtensions.push(definition);
        }
    }
    collectExtensionsFieldMetadata(definition) {
        const index = this.fieldExtensions.findIndex(item => item.target.name === definition.target.name && item.extensions.nameOrDefinition === definition.extensions.nameOrDefinition && item.fieldName === definition.fieldName);
        if( index >= 0) {
            this.fieldExtensions[index] = definition;
        } else {
            this.fieldExtensions.push(definition);
        }
    }

You might know of a better way to do this, but so far it really has not affected the performance as it returns in anywhere from 30ms - 55ms and before the first render was always in the low 50s ms like 53 ms ...

Is this something that you might consider for a PR?

[MichalLytek]

You need to check by modifying the source code in this repo and running all the tests.