perf: improve performance when spec lint [INS-3724] (#7374)

* perf: spec lint

* Move ruleset loading to main

* fix: solve todo

* fix: solve todo

* feat: open nodeIntegrationInWorker option

* fix: need save spectralRun ipc

* feat: add worker plugin

* put the default ruleset handling in loadSpectralRuleset

* make sure we check for latest id

* fix: postMessage and ipc can not transfer special objects

* move logic to new place and clean up main

* fix race condition and cleanup code

* fix: worker build

* add necessary worker ternminate and more logs

* use fs require in worker

* rename file and add reject

* fix typo

* remove unused console log in loader

* leave note about GC

---------

Co-authored-by: gatzjames <jamesgatzos@gmail.com>
Co-authored-by: jackkav <jackkav@gmail.com>

Author: 3 people

package-lock.json

@@ -58,6 +58,7 @@ export default async function build(options: Options) {
       '.node': 'copy',
     },
   });
+
   const main = esbuild.build({
     entryPoints: ['./src/main.development.ts'],
     outfile: path.join(outdir, 'main.min.js'),

packages/insomnia/esbuild.main.ts

@@ -46,10 +46,6 @@
     "@seald-io/nedb": "^4.0.4",
     "@segment/analytics-node": "2.1.0",
     "@sentry/electron": "^3.0.7",
-    "@stoplight/spectral-core": "^1.18.3",
-    "@stoplight/spectral-formats": "^1.6.0",
-    "@stoplight/spectral-ruleset-bundler": "1.5.2",
-    "@stoplight/spectral-rulesets": "^1.18.1",
     "apiconnect-wsdl": "1.8.31",
     "aws4": "^1.12.0",
     "chai": "^4.3.4",
@@ -87,6 +83,10 @@
     "yaml-source-map": "^2.1.1"
   },
   "devDependencies": {
+    "@stoplight/spectral-core": "^1.18.3",
+    "@stoplight/spectral-formats": "^1.6.0",
+    "@stoplight/spectral-rulesets": "^1.18.1",
+    "@stoplight/spectral-ruleset-bundler": "1.5.2",
     "@develohpanda/fluent-builder": "^2.1.2",
     "@fortawesome/fontawesome-svg-core": "^6.5.2",
     "@fortawesome/free-brands-svg-icons": "^6.5.2",

packages/insomnia/package.json

@@ -22,7 +22,6 @@ export type HandleChannels =
   | 'restoreBackup'
   | 'showOpenDialog'
   | 'showSaveDialog'
-  | 'spectralRun'
   | 'webSocket.event.findMany'
   | 'webSocket.event.send'
   | 'webSocket.open'

packages/insomnia/src/main/ipc/electron.ts

@@ -1,10 +1,4 @@
-import type { ISpectralDiagnostic } from '@stoplight/spectral-core';
-import type { RulesetDefinition } from '@stoplight/spectral-core';
-import { Spectral } from '@stoplight/spectral-core';
-// @ts-expect-error - This is a bundled file not sure why it's not found
-import { bundleAndLoadRuleset } from '@stoplight/spectral-ruleset-bundler/with-loader';
-import { oas } from '@stoplight/spectral-rulesets';
-import { app, BrowserWindow, IpcRendererEvent, net, shell } from 'electron';
+import { app, BrowserWindow, IpcRendererEvent, shell } from 'electron';
 import fs from 'fs';
 
 import type { HiddenBrowserWindowBridgeAPI } from '../../hidden-window';
@@ -28,7 +22,6 @@ export interface RendererToMainBridgeAPI {
   manualUpdateCheck: () => void;
   backup: () => Promise<void>;
   restoreBackup: (version: string) => Promise<void>;
-  spectralRun: (options: { contents: string; rulesetPath: string }) => Promise<ISpectralDiagnostic[]>;
   authorizeUserInWindow: typeof authorizeUserInWindow;
   setMenuBarVisibility: (visible: boolean) => void;
   installPlugin: typeof installPlugin;
@@ -109,31 +102,4 @@ export function registerMainHandlers() {
       shell.openExternal(href);
     }
   });
-
-  ipcMainHandle('spectralRun', async (_, { contents, rulesetPath }: {
-    contents: string;
-    rulesetPath?: string;
-  }) => {
-    const spectral = new Spectral();
-
-    if (rulesetPath) {
-      try {
-        const ruleset = await bundleAndLoadRuleset(rulesetPath, {
-          fs,
-          fetch: net.fetch,
-        });
-
-        spectral.setRuleset(ruleset);
-      } catch (err) {
-        console.log('Error while parsing ruleset:', err);
-        spectral.setRuleset(oas as RulesetDefinition);
-      }
-    } else {
-      spectral.setRuleset(oas as RulesetDefinition);
-    }
-
-    const diagnostics = await spectral.run(contents);
-
-    return diagnostics;
-  });
 }

packages/insomnia/src/main/ipc/main.ts

@@ -204,6 +204,7 @@ export function createWindow(): ElectronBrowserWindow {
       preload: path.join(__dirname, 'preload.js'),
       zoomFactor: getZoomFactor(),
       nodeIntegration: true,
+      nodeIntegrationInWorker: true,
       webviewTag: true,
       // TODO: enable context isolation
       contextIsolation: false,

packages/insomnia/src/main/window-utils.ts

@@ -50,7 +50,6 @@ const main: Window['main'] = {
   backup: () => ipcRenderer.invoke('backup'),
   restoreBackup: options => ipcRenderer.invoke('restoreBackup', options),
   authorizeUserInWindow: options => ipcRenderer.invoke('authorizeUserInWindow', options),
-  spectralRun: options => ipcRenderer.invoke('spectralRun', options),
   setMenuBarVisibility: options => ipcRenderer.send('setMenuBarVisibility', options),
   installPlugin: options => ipcRenderer.invoke('installPlugin', options),
   curlRequest: options => ipcRenderer.invoke('curlRequest', options),

packages/insomnia/src/preload.ts

@@ -7,7 +7,7 @@ import { GraphQLInfoOptions } from 'codemirror-graphql/info';
 import { ModifiedGraphQLJumpOptions } from 'codemirror-graphql/jump';
 import deepEqual from 'deep-equal';
 import { JSONPath } from 'jsonpath-plus';
-import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
+import React, { forwardRef, memo, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import { Button, Menu, MenuItem, MenuTrigger, Popover } from 'react-aria-components';
 import { useMount, useUnmount } from 'react-use';
 import vkBeautify from 'vkbeautify';
@@ -137,8 +137,9 @@ export interface CodeEditorHandle {
   focusEnd: () => void;
   getCursor: () => CodeMirror.Position | undefined;
   setCursorLine: (lineNumber: number) => void;
+  tryToSetOption: (key: keyof EditorConfiguration, value: any) => void;
 }
-export const CodeEditor = forwardRef<CodeEditorHandle, CodeEditorProps>(({
+export const CodeEditor = memo(forwardRef<CodeEditorHandle, CodeEditorProps>(({
   autoPrettify,
   className,
   defaultValue,
@@ -526,6 +527,7 @@ export const CodeEditor = forwardRef<CodeEditorHandle, CodeEditorProps>(({
   useEffect(() => tryToSetOption('hintOptions', hintOptions), [hintOptions]);
   useEffect(() => tryToSetOption('info', infoOptions), [infoOptions]);
   useEffect(() => tryToSetOption('jump', jumpOptions), [jumpOptions]);
+  // This line will trigger codeMirror lint
   useEffect(() => tryToSetOption('lint', lintOptions), [lintOptions]);
   useEffect(() => tryToSetOption('mode', !handleRender ? normalizeMimeType(mode) : { name: 'nunjucks', baseMode: normalizeMimeType(mode) }), [handleRender, mode]);
 
@@ -551,6 +553,7 @@ export const CodeEditor = forwardRef<CodeEditorHandle, CodeEditorProps>(({
     setCursorLine: (lineNumber: number) => {
       codeMirror.current?.setCursor(lineNumber);
     },
+    tryToSetOption,
   }), []);
 
   const showFilter = readOnly && (mode?.includes('json') || mode?.includes('xml'));
@@ -715,5 +718,5 @@ export const CodeEditor = forwardRef<CodeEditorHandle, CodeEditorProps>(({
       }
     </div >
   );
-});
+}));
 CodeEditor.displayName = 'CodeEditor';

packages/insomnia/src/ui/components/codemirror/code-editor.tsx

@@ -24,6 +24,7 @@ import { VCSInstance } from '../../sync/vcs/insomnia-sync';
 import { insomniaFetch } from '../../ui/insomniaFetch';
 import { invariant } from '../../utils/invariant';
 import { SegmentEvent } from '../analytics';
+import { SpectralRunner } from '../worker/spectral-run';
 
 // Project
 export const createNewProjectAction: ActionFunction = async ({ request, params }) => {
@@ -733,7 +734,10 @@ export const generateCollectionFromApiSpecAction: ActionFunction = async ({
     `version-control/git/${workspaceMeta?.gitRepositoryId}/other/.spectral.yaml`,
   );
 
-  const results = (await window.main.spectralRun({ contents: apiSpec.contents, rulesetPath })).filter(isLintError);
+  const spectralRunner = new SpectralRunner();
+
+  const results = (await spectralRunner.runDiagnostics({ contents: apiSpec.contents, rulesetPath })).filter(isLintError);
+  spectralRunner.terminate();
   if (apiSpec.contents && results && results.length) {
     throw new Error('Error Generating Configuration');
   }
@@ -772,7 +776,10 @@ export const generateCollectionAndTestsAction: ActionFunction = async ({ params
     `version-control/git/${workspaceMeta?.gitRepositoryId}/other/.spectral.yaml`,
   );
 
-  const results = (await window.main.spectralRun({ contents: apiSpec.contents, rulesetPath })).filter(isLintError);
+  const spectralRunner = new SpectralRunner();
+
+  const results = (await spectralRunner.runDiagnostics({ contents: apiSpec.contents, rulesetPath })).filter(isLintError);
+  spectralRunner.terminate();
   if (apiSpec.contents && results && results.length) {
     throw new Error('Error Generating Configuration');
   }