GraphQL voyager breaks with large schemas

[pmantica1]

When I try to use GraphQL voyager with a schema that is about 4500 lines long it breaks, (it just displays a blank screen). It seems though that this schema is just big enough to cause this issue. (If I only include half of the schema object types, it works out perfectly). Do you have any suggestions on how I could, (maybe temporarily), deal with this issue?

[IvanGoncharov]

@pmantica1 It's an issue with hardcoded buffer and stack size for graph rendering
https://github.com/APIs-guru/graphql-voyager/blob/ce68069ec8f10d745293256c20dd0cb76e447985/src/utils/index.ts#L29-L30
We can't increase this limit too much since this memory is fully allocated during Voyager initialization.
We are working on a long term solution, which requires us to switch some of code to WASM.

Do you have any suggestions on how I could, (maybe temporarily), deal with this issue?

If you have the possibility to build Voayger you can manually increase those hardcode values.

[pmantica1]

Thank you very much for the info. I think the fix doesn't work for me. I tried increasing the memory multiplier from 16 to 128 and then following all of the commands in the README.md in the example directory. (I am using my own schema by just modifying the schema.js file in the example directory).

[IvanGoncharov]

@pmantica1 Did you increase both numbers? (the bigger one is heap size and smaller is stack size). Also, please check the browser console it can say what wrong.

If it says that maximum call size exceeded that means you hit browser limitation on recursion and only our planned JS conversion to WASM can help.

[pmantica1]

Yes I did increase both numbers. Will check. Thank you.

[matystl]

@pmantica1 FYI i try schema with 1,172,059 lines and voyager parsed it correctly but will not show anything as rendering is too big for him. Small hack you can try limit how many nodes it is showing. in src\graph\type-graph.ts > getTypeGraph add this line

    for (var i = 0; i < typeIds.length; ++i) {
+++  if (nodes.length > 20) break; +++
      var id = typeIds[i];
      if (typeIds.indexOf(id) < i) continue;

      var type = types[id];

      nodes.push(type);
      typeIds.push(...getEdgeTargets(type));
    }
    return {
      rootId,
      nodes: hideRoot ? _.omit(_.keyBy(nodes, 'id'), [rootId]) : _.keyBy(nodes, 'id'),
    };

It should render at least something. Navigation will be kind of broken but you can play with number of nodes and change rootType and explore at least something.

[kolharsam]

So in light of this issue, have you considered changing the visualization library that you use, instead of viz.js? Do you plan to do it anytime in the near future?