use localStorage

src/api/strings.ts

 import axios from "axios";
 
+export async function initStrings() {
+  const strings = (
+    await axios.get<string>(`ygopro-database/locales/zh-CN/strings.conf`)
+  ).data;
+  localStorage.setItem("ygo-strings", strings);
+}
+
 export async function fetchStrings(
   region: string,
   id: number

src/ui/Duel/main.tsx

-import React from "react";
+import React, { useEffect, useRef } from "react";
 import { Engine, Scene } from "react-babylonjs";
 import { ReactReduxContext, Provider } from "react-redux";
 import * as BABYLON from "@babylonjs/core";
@@ -20,9 +20,26 @@ import OptionModal from "./optionModal";
 import Phase from "./phase";
 import CheckCardModalV2 from "./checkCardModalV2";
 import ExtraDeck from "./extraDeck";
+import { initStrings } from "../../api/strings";
 
 // Ref: https://github.com/brianzinn/react-babylonjs/issues/126
-const NeosDuel = () => (
+const NeosDuel = () => {
+  // 应该用更优雅的方式处理`useEffect`执行两次的问题
+  const initialRender = useRef(true);
+  useEffect(() => {
+    const init = async () => {
+      await initStrings();
+    };
+
+    if (initialRender.current) {
+      initialRender.current = false;
+      return;
+    }
+
+    init();
+  }, []);
+
+  return (
     <>
       <ReactReduxContext.Consumer>
         {({ store }) => (
@@ -56,7 +73,8 @@ const NeosDuel = () => (
       <OptionModal />
       <CheckCardModalV2 />
     </>
-);
+  );
+};
 
 const Camera = () => (
   <freeCamera