Merge branch 'dev' into refactor-state-mgmt

# Conflicts:
#	packages/webgal/package.json
#	packages/webgal/public/game/template/template.json
#	packages/webgal/public/webgal-engine.json
#	packages/webgal/src/Core/Modules/scene.ts
#	packages/webgal/src/Core/controller/gamePlay/scriptExecutor.ts
#	packages/webgal/src/Core/gameScripts/vocal/index.ts

Author: MakinoharaShoko

.github/workflows/release.yml

@@ -5,14 +5,56 @@ on:
     tags:
       - '*.*'
 
+permissions:
+  contents: write
+
 jobs:
+  build-webgal-static-webpage:
+    name: Build WebGAL Static Webpage
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v2
+        with:
+          persist-credentials: false
+
+      - name: Setup Node.js environment
+        uses: actions/setup-node@v3
+        with:
+          node-version-file: package.json
+          cache: 'yarn'
+
+      - name: Install
+        run: npm install yarn -g && yarn install
+
+      - name: Build
+        run: yarn build
+
+      - name: Package WebGAL Engine Web
+        run: |
+          cd packages/webgal/dist
+          zip -r "$GITHUB_WORKSPACE/webgal-engine-web.zip" .
+
+      - name: Upload WebGAL Engine Artifact
+        uses: actions/upload-artifact@v4
+        with:
+          name: webgal-engine-web
+          path: webgal-engine-web.zip
+          if-no-files-found: error
+
   release:
     name: Release
     runs-on: ubuntu-latest
+    needs: build-webgal-static-webpage
     steps:
       - name: Checkout
         uses: actions/checkout@v2
 
+      - name: Download WebGAL Engine Artifact
+        uses: actions/download-artifact@v4
+        with:
+          name: webgal-engine-web
+
       - name: Create Release
         id: create_release
         uses: actions/create-release@v1
@@ -24,3 +66,13 @@ jobs:
           body_path: releasenote.md
           draft: true
           prerelease: false
+
+      - name: Upload WebGAL Engine Web
+        uses: actions/upload-release-asset@v1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          upload_url: ${{ steps.create_release.outputs.upload_url }}
+          asset_path: webgal-engine-web.zip
+          asset_name: WebGAL-${{ github.ref_name }}-web.zip
+          asset_content_type: application/zip

packages/parser/rollup.config.js

@@ -40,6 +40,7 @@ export default [
         tsconfigOverride: {
           compilerOptions: {
             sourceMap: !isProd,
+            rootDir: "src",
             declarationDir: "build/cjs"
           }, include: ["src"]
         }
@@ -61,6 +62,7 @@ export default [
         tsconfigOverride: {
           compilerOptions: {
             sourceMap: !isProd,
+            rootDir: "src",
             declarationDir: "build/types"
           }, include: ["src"]
         }

packages/parser/src/sceneParser.ts

@@ -38,12 +38,13 @@ export const sceneParser = (
   let assetsList: Array<IAsset> = []; // 场景资源列表
   let subSceneList: Array<string> = []; // 子场景列表
   const sentenceList: Array<ISentence> = rawSentenceListWithoutEmpty.map(
-    (sentence) => {
+    (sentence, index) => {
       const returnSentence: ISentence = scriptParser(
         sentence,
         assetSetter,
         ADD_NEXT_ARG_LIST,
         SCRIPT_CONFIG_MAP,
+        index,
       );
       // 在这里解析出语句可能携带的资源和场景，合并到 assetsList 和 subSceneList
       assetsList = [...assetsList, ...returnSentence.sentenceAssets];

packages/parser/src/scriptParser/assetsScanner.ts

@@ -12,6 +12,7 @@ export const assetsScanner = (
   command: commandType,
   content: string,
   args: Array<arg>,
+  lineNumber: number,
 ): Array<IAsset> => {
   let hasVocalArg = false;
   const returnAssetsList: Array<IAsset> = [];
@@ -22,7 +23,7 @@ export const assetsScanner = (
         returnAssetsList.push({
           name: e.value as string,
           url: e.value as string,
-          lineNumber: 0,
+          lineNumber,
           type: fileType.vocal,
         });
       }
@@ -36,39 +37,39 @@ export const assetsScanner = (
     returnAssetsList.push({
       name: content,
       url: content,
-      lineNumber: 0,
+      lineNumber,
       type: fileType.background,
     });
   }
   if (command === commandType.changeFigure) {
     returnAssetsList.push({
       name: content,
       url: content,
-      lineNumber: 0,
+      lineNumber,
       type: fileType.figure,
     });
   }
   if (command === commandType.miniAvatar) {
     returnAssetsList.push({
       name: content,
       url: content,
-      lineNumber: 0,
+      lineNumber,
       type: fileType.figure,
     });
   }
   if (command === commandType.video) {
     returnAssetsList.push({
       name: content,
       url: content,
-      lineNumber: 0,
+      lineNumber,
       type: fileType.video,
     });
   }
   if (command === commandType.bgm) {
     returnAssetsList.push({
       name: content,
       url: content,
-      lineNumber: 0,
+      lineNumber,
       type: fileType.bgm,
     });
   }

packages/parser/src/scriptParser/scriptParser.ts

@@ -24,6 +24,7 @@ export const scriptParser = (
   assetSetter: any,
   ADD_NEXT_ARG_LIST: commandType[],
   SCRIPT_CONFIG_MAP: ConfigMap,
+  lineNumber = 0,
 ): ISentence => {
   let command: commandType; // 默认为对话
   let content: string; // 语句内容
@@ -105,7 +106,7 @@ export const scriptParser = (
   }
 
   content = contentParser(newSentenceRaw.trim(), command, assetSetter); // 将语句内容里的文件名转为相对或绝对路径
-  sentenceAssets = assetsScanner(command, content, args); // 扫描语句携带资源
+  sentenceAssets = assetsScanner(command, content, args, lineNumber); // 扫描语句携带资源
   subScene = subSceneScanner(command, content); // 扫描语句携带子场景
   return {
     command: command, // 语句类型

packages/parser/test/parser.test.ts

@@ -49,7 +49,7 @@ test("args", async () => {
       { key: "left", value: true },
       { key: "next", value: true }
     ],
-    sentenceAssets: [{ name: "m2.png", url: 'm2.png', type: fileType.figure, lineNumber: 0 }],
+    sentenceAssets: [{ name: "m2.png", url: 'm2.png', type: fileType.figure, lineNumber: 24 }],
     subScene: [],
     inlineComment: ""
   };

packages/webgal/index.html

@@ -320,16 +320,68 @@
     <script>
       (() => {
         const isIOS = window.__WEBGAL_DEVICE_INFO__?.isIOS ?? false;
-        if ('serviceWorker' in navigator && !isIOS) {
-          navigator.serviceWorker
-            .register('./webgal-serviceworker.js')
-            .then((reg) => {
-              console.log('Registration succeeded. Scope is ' + reg.scope);
-            })
-            .catch((error) => {
-              console.log('Registration failed with ' + error);
-            });
+        const localHostnames = ['localhost', '127.0.0.1', '::1'];
+        const isLocalPreview = localHostnames.includes(window.location.hostname) || window.location.protocol === 'file:';
+        const isElectron = Boolean(window.electronFuncs) || /Electron/i.test(navigator.userAgent || '');
+        const shouldBypassServiceWorker = isIOS || isLocalPreview || isElectron;
+        const webgalServiceWorkerUrl = new URL('./webgal-serviceworker.js', window.location.href).href;
+        const bypassReloadKey = 'webgal-sw-bypass-reloaded';
+        const isWebGALRegistration = (registration) => {
+          const workers = [registration.active, registration.installing, registration.waiting];
+          return workers.some((worker) => worker?.scriptURL === webgalServiceWorkerUrl);
+        };
+        const markBypassReload = () => {
+          try {
+            if (sessionStorage.getItem(bypassReloadKey) === 'true') {
+              return false;
+            }
+            sessionStorage.setItem(bypassReloadKey, 'true');
+            return true;
+          } catch {
+            return false;
+          }
+        };
+        const clearBypassReloadMark = () => {
+          try {
+            sessionStorage.removeItem(bypassReloadKey);
+          } catch {}
+        };
+        const clearWebGALServiceWorker = async () => {
+          try {
+            const registrations = await navigator.serviceWorker.getRegistrations();
+            const webgalRegistrations = registrations.filter(isWebGALRegistration);
+            const hasWebGALController = navigator.serviceWorker.controller?.scriptURL === webgalServiceWorkerUrl;
+            await Promise.all(webgalRegistrations.map((registration) => registration.unregister()));
+            if ('caches' in window) {
+              const cacheKeys = await caches.keys();
+              await Promise.all(cacheKeys.filter((key) => key.startsWith('webgal-')).map((key) => caches.delete(key)));
+            }
+            if ((webgalRegistrations.length > 0 || hasWebGALController) && navigator.serviceWorker.controller && markBypassReload()) {
+              window.location.reload();
+            }
+          } catch (error) {
+            console.warn('Failed to clear WebGAL Service Worker cache', error);
+          }
+        };
+        if (!('serviceWorker' in navigator)) {
+          return;
+        }
+        if (shouldBypassServiceWorker) {
+          clearWebGALServiceWorker();
+          return;
         }
+        if (!window.isSecureContext) {
+          return;
+        }
+        clearBypassReloadMark();
+        navigator.serviceWorker
+          .register('./webgal-serviceworker.js')
+          .then((reg) => {
+            console.log('Registration succeeded. Scope is ' + reg.scope);
+          })
+          .catch((error) => {
+            console.log('Registration failed with ' + error);
+          });
       })();
     </script>
     <!-- 首屏加载 -->

packages/webgal/public/webgal-serviceworker.js

@@ -1,7 +1,7 @@
-const CACHE_NAME = 'webgal-critical-assets-v3';
-const GAME_PREFIX = '/game/';
-const CRITICAL_PATHS = ['/game/background/', '/game/figure/', '/game/bgm/', '/game/vocal/', '/game/video/'];
+const CACHE_PREFIX = 'webgal-';
+const CACHE_NAME = 'webgal-build-assets-v1';
 const LOG_PREFIX = '[WebGAL SW]';
+const HASHED_BUILD_ASSET_RE = /(^|\/)assets\/[^/?#]+-[A-Za-z0-9_-]{8,}\.(?:js|css|ttf|woff|woff2)$/;
 const loggedKeys = new Set();
 
 function logOnce(key, ...args) {
@@ -20,66 +20,41 @@ self.addEventListener('activate', (event) => {
   event.waitUntil(
     (async () => {
       const keys = await caches.keys();
-      await Promise.all(keys.filter((key) => key !== CACHE_NAME).map((key) => caches.delete(key)));
+      await Promise.all(keys.filter((key) => key.startsWith(CACHE_PREFIX) && key !== CACHE_NAME).map((key) => caches.delete(key)));
       await self.clients.claim();
     })(),
   );
 });
 
-function isCriticalGameRequest(request) {
+function isHashedBuildAssetRequest(request) {
   if (request.method !== 'GET') return false;
   const url = new URL(request.url);
   if (url.origin !== self.location.origin) return false;
-  if (!url.pathname.startsWith(GAME_PREFIX)) return false;
-  return CRITICAL_PATHS.some((prefix) => url.pathname.startsWith(prefix));
+  return HASHED_BUILD_ASSET_RE.test(url.pathname);
 }
 
-// Stale-while-revalidate: return cached response immediately, then update cache in background.
-async function staleWhileRevalidate(request) {
+async function cacheFirst(request) {
   const cache = await caches.open(CACHE_NAME);
-  const cached = await cache.match(request.url);
-
-  const fetchAndUpdate = async () => {
-    try {
-      const response = await fetch(request);
-      if (response.ok) {
-        await cache.put(request.url, response.clone());
-      }
-      return response;
-    } catch (e) {
-      return null;
-    }
-  };
-
+  const cached = await cache.match(request);
   if (cached) {
-    logOnce(`hit:${request.url}`, 'cache hit (revalidating):', new URL(request.url).pathname);
-    // Revalidate in background — don't await
-    fetchAndUpdate();
+    logOnce(`hit:${request.url}`, 'cache hit:', new URL(request.url).pathname);
     return cached;
   }
 
-  // No cache — must wait for network
   const response = await fetch(request);
-  if (response.ok) {
-    await cache.put(request.url, response.clone());
+  if (response.ok && response.status === 200) {
+    await cache.put(request, response.clone());
     logOnce(`cache:${request.url}`, 'cached:', new URL(request.url).pathname);
   }
   return response;
 }
 
 self.addEventListener('fetch', (event) => {
   const { request } = event;
-  if (!isCriticalGameRequest(request)) return;
-
-  // Audio/video range requests are passed through to avoid partial-content edge cases.
-  if (request.headers.has('range')) {
-    logOnce(`range:${request.url}`, 'range passthrough:', new URL(request.url).pathname);
-    event.respondWith(fetch(request));
-    return;
-  }
+  if (!isHashedBuildAssetRequest(request)) return;
 
   event.respondWith(
-    staleWhileRevalidate(request).catch(() => {
+    cacheFirst(request).catch(() => {
       return fetch(request);
     }),
   );

packages/webgal/src/Core/Modules/scene.ts

@@ -24,8 +24,8 @@ export const initSceneData = {
 };
 
 export class SceneManager {
-  public settledScenes: Array<string> = [];
-  public settledAssets: Array<string> = [];
+  public settledScenes: Set<string> = new Set();
+  public settledAssets: Set<string> = new Set();
   public sceneData: ISceneData = cloneDeep(initSceneData);
   public lockSceneWrite = false;
   public sceneWritePromise: Promise<void> | null = null;
@@ -35,5 +35,7 @@ export class SceneManager {
     this.sceneData.sceneStack = [];
     this.sceneData.currentScene = cloneDeep(initSceneData.currentScene);
     this.sceneWritePromise = null;
+    this.settledScenes.clear();
+    this.settledAssets.clear();
   }
 }

packages/webgal/src/Core/controller/gamePlay/scriptExecutor.ts

@@ -11,6 +11,7 @@ import { WebGAL } from '@/Core/WebGAL';
 import { getBooleanArgByKey, getStringArgByKey } from '@/Core/util/getSentenceArg';
 import { stageStateManager } from '@/Core/Modules/stage/stageStateManager';
 import { jumpToLabel } from '@/Core/gameScripts/label/jumpToLabel';
+import { prefetchCurrentSceneByProgress } from '@/Core/util/prefetcher/progressPrefetcher';
 
 const MAX_FORWARD_SCRIPT_EXECUTION = 10000;
 
@@ -44,6 +45,7 @@ export const scriptExecutor = (depth = 0) => {
     return;
   }
 
+  prefetchCurrentSceneByProgress();
   // 超过总语句数量，则从场景栈拿出一个需要继续的场景，然后继续流程。若场景栈清空，则停止流程
   if (
     WebGAL.sceneManager.sceneData.currentSentenceId >