perf: await wasm task

src/components/SearchCard.vue

@@ -4,7 +4,7 @@ import { errorTry, errorWrap } from '@/utils/error';
 import { getNodeLabel } from '@/utils/node';
 import { buildEmptyFn, copy } from '@/utils/others';
 import type { Selector } from '@/utils/selector';
-import { parseSelector } from '@/utils/selector';
+import { parseSelector, wasmLoadTask } from '@/utils/selector';
 import { githubJpgStorage, githubZipStorage } from '@/utils/storage';
 import type { RawNode, Snapshot } from '@/utils/types';
 import { githubUrlToSelfUrl } from '@/utils/url';
@@ -142,6 +142,7 @@ const searchBySelector = errorTry(() => {
 });
 
 onMounted(async () => {
+  await wasmLoadTask;
   let count = 0;
   if (route.query.gkd) {
     count += searchSelector(base64url.decode(route.query.gkd as string)) || 0;

src/utils/selector.ts

@@ -9,17 +9,17 @@ import matchesWasmUrl from '@gkd-kit/wasm_matches/dist/mod.wasm?url';
 import store from './store';
 import { settingsStorage } from './storage';
 
-let wasmSupported = false;
-matchesInstantiate(fetch(matchesWasmUrl))
+export const wasmLoadTask = matchesInstantiate(fetch(matchesWasmUrl))
   .then((mod) => {
     const toMatches = mod.exports.toMatches;
     updateWasmToMatches(toMatches as any);
-    wasmSupported = true;
+    store.wasmSupported = true;
     if (import.meta.env.PROD) {
       console.log('use wasm matches');
     }
   })
   .catch((e) => {
+    store.wasmSupported = false;
     console.error(e);
     if (import.meta.env.PROD) {
       console.log('use js matches');
@@ -61,7 +61,7 @@ export type ConnectKeyType = '+' | '-' | '>' | '<' | '<<';
 export const parseSelector = (source: string): Selector => {
   const ms = MultiplatformSelector.Companion.parse(source);
   for (const [name, operator, type] of ms.binaryExpressions) {
-    if (operator == '~=' && !wasmSupported) {
+    if (operator == '~=' && !store.wasmSupported) {
       if (!settingsStorage.ignoreWasmWarn) {
         store.wasmErrorDlgVisible = true;
       }

src/utils/store.ts

@@ -4,6 +4,7 @@ const store = reactive({
   networkErrorDlgVisible: false,
   githubErrorDlgVisible: false,
   wasmErrorDlgVisible: false,
+  wasmSupported: undefined as boolean | undefined,
 });
 
 export default store;