From fccf8ea3a209873d346d081dffb50f0190e6b0be Mon Sep 17 00:00:00 2001 From: meloalright Date: Thu, 25 Apr 2024 00:12:11 +0800 Subject: [PATCH 1/7] chore: recover the lock at package ci --- vue-playground/package-ci.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/vue-playground/package-ci.json b/vue-playground/package-ci.json index 7d41acc..439246a 100644 --- a/vue-playground/package-ci.json +++ b/vue-playground/package-ci.json @@ -12,7 +12,7 @@ "core-js": "^3.8.3", "prism-themes": "^1.9.0", "prismjs": "^1.29.0", - "vue": "3.3.4", + "vue": "^3.2.13", "vue-live": "^2.5.4", "vue-skia": "0.0.9" }, From e767acf06f09ce6bd86c793374d2b0593fe1cd8d Mon Sep 17 00:00:00 2001 From: meloalright Date: Thu, 25 Apr 2024 01:09:53 +0800 Subject: [PATCH 2/7] feat: add batch draw implement and draw call at vue skia surface and plugin --- vue-skia-framework/plugin/index.ts | 2 ++ vue-skia-framework/surface/index.ts | 28 ++++++++++++++++++---------- vue-skia-framework/type.ts | 1 + 3 files changed, 21 insertions(+), 10 deletions(-) diff --git a/vue-skia-framework/plugin/index.ts b/vue-skia-framework/plugin/index.ts index 6113218..8e3182b 100644 --- a/vue-skia-framework/plugin/index.ts +++ b/vue-skia-framework/plugin/index.ts @@ -113,6 +113,7 @@ const VSKNode = (name: string) => { ( parent as ComponentInternalInstanceWithSoftSkiaWASM )._ssw_grouped?.(instance); + root._ssw_batchDraw?.() }); onUpdated(() => { @@ -123,6 +124,7 @@ const VSKNode = (name: string) => { } const core = root.ssw; updateInstance(core, name, instance, attrs); + root._ssw_batchDraw?.() }); /** diff --git a/vue-skia-framework/surface/index.ts b/vue-skia-framework/surface/index.ts index 1220893..419847c 100644 --- a/vue-skia-framework/surface/index.ts +++ b/vue-skia-framework/surface/index.ts @@ -33,27 +33,35 @@ export default { const ssw = window.ssw; const rootID = SelfIncreaseCount.count; const core = new ssw.SoftSkiaWASM(rootID); + + let waitingForDraw = false; + instance.ssw = core; // Save on component instance instance._ssw_id = rootID; core.setAttrBySerde(rootID, { attr: { R: { x: 0, y: 0, width: attrs.width, height: attrs.height, color: 'transparent', style: "fill" } } }) + // batch draw func + function batchDraw() { + if (!waitingForDraw) { + waitingForDraw = true; + window.requestAnimationFrame(() => { + const base64 = core.toBase64(); + container.value.setAttribute("src", base64); + waitingForDraw = false; + }); + } + } + instance._ssw_batchDraw = () => batchDraw(); onMounted(() => { - const base64 = core.toBase64(); - container.value.setAttribute("src", base64); + batchDraw(); }); onUpdated(() => { - const base64 = core.toBase64(); - // console.log(core.toDebug?.()) - container.value.setAttribute("src", base64); + batchDraw(); }); - onBeforeUnmount(() => { - // const instance = getCurrentInstance() as ComponentInternalInstanceWithSoftSkiaWASM; - // const core = instance.ssw; - // core.free(); - }); + onBeforeUnmount(() => {}); return () => h('img', { ref: container }, slots.default?.()); diff --git a/vue-skia-framework/type.ts b/vue-skia-framework/type.ts index 36a5c16..82a975a 100644 --- a/vue-skia-framework/type.ts +++ b/vue-skia-framework/type.ts @@ -7,6 +7,7 @@ export type ComponentInternalInstanceWithSoftSkiaWASM = ComponentInternalInstanc ssw: SoftSkiaWASM; _ssw_id: number; _ssw_grouped?: (instance: ComponentInternalInstanceWithSoftSkiaWASM) => void; + _ssw_batchDraw?: () => void; } declare global { From 41d3d0b68be82444b006404d4f882ef00915a019 Mon Sep 17 00:00:00 2001 From: meloalright Date: Thu, 25 Apr 2024 01:53:10 +0800 Subject: [PATCH 3/7] feat: update launch func of vue skia framework --- vue-skia-framework/launch.ts | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/vue-skia-framework/launch.ts b/vue-skia-framework/launch.ts index 4039f8c..7572f86 100644 --- a/vue-skia-framework/launch.ts +++ b/vue-skia-framework/launch.ts @@ -8,12 +8,13 @@ const launch = function () { if (SSWInitialHelper.initialStatus === 0) { SSWInitialHelper.initialStatus = 1; const wasm = import("soft-skia-wasm/soft_skia_wasm.js"); - wasm.then((ssw) => { - window.ssw = ssw; - while (SSWInitialHelper.initialSucceedCallbackQueue.length) { - SSWInitialHelper.initialSucceedCallbackQueue.pop()(); - } - resolve(void 0) + wasm.then(async (ssw) => { + await ssw.default(); + window.ssw = ssw; + while (SSWInitialHelper.initialSucceedCallbackQueue.length) { + SSWInitialHelper.initialSucceedCallbackQueue.pop()(); + } + resolve(void 0) }) } else if (SSWInitialHelper.initialStatus === 1) { SSWInitialHelper.initialSucceedCallbackQueue.push(() => resolve(void 0)); From f5abcb927a4cf81791901c7a545bdfec66e7f696 Mon Sep 17 00:00:00 2001 From: meloalright Date: Thu, 25 Apr 2024 02:00:40 +0800 Subject: [PATCH 4/7] test: vue playground without softlink use 0.0.10-dev.3 vue-skia --- vue-playground/package-ci.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/vue-playground/package-ci.json b/vue-playground/package-ci.json index 439246a..77ff63d 100644 --- a/vue-playground/package-ci.json +++ b/vue-playground/package-ci.json @@ -14,7 +14,7 @@ "prismjs": "^1.29.0", "vue": "^3.2.13", "vue-live": "^2.5.4", - "vue-skia": "0.0.9" + "vue-skia": "0.0.10-dev.3" }, "devDependencies": { "@types/node": "^20.5.0", From 65de135cede62c338459fc323c5a978641d117df Mon Sep 17 00:00:00 2001 From: meloalright Date: Thu, 25 Apr 2024 02:09:13 +0800 Subject: [PATCH 5/7] feat: upd check yml of workflow --- .github/workflows/check.yml | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/.github/workflows/check.yml b/.github/workflows/check.yml index 280b6c6..d905877 100644 --- a/.github/workflows/check.yml +++ b/.github/workflows/check.yml @@ -67,3 +67,11 @@ jobs: name: soft-skia-wasm path: | soft-skia-wasm/pkg + + - name: Archive vue-playground in monorepo artifacts + uses: actions/upload-artifact@v3 + with: + name: vue-playground + path: | + vue-playground + !vue-playground/node_modules From 8d877230e666d7fb352c4262ef7008390334f289 Mon Sep 17 00:00:00 2001 From: meloalright Date: Thu, 25 Apr 2024 02:15:06 +0800 Subject: [PATCH 6/7] Revert "test: vue playground without softlink use 0.0.10-dev.3 vue-skia" This reverts commit f5abcb927a4cf81791901c7a545bdfec66e7f696. --- vue-playground/package-ci.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/vue-playground/package-ci.json b/vue-playground/package-ci.json index 77ff63d..439246a 100644 --- a/vue-playground/package-ci.json +++ b/vue-playground/package-ci.json @@ -14,7 +14,7 @@ "prismjs": "^1.29.0", "vue": "^3.2.13", "vue-live": "^2.5.4", - "vue-skia": "0.0.10-dev.3" + "vue-skia": "0.0.9" }, "devDependencies": { "@types/node": "^20.5.0", From b053a56edd8d4cfe81ae56ebcd06ef53cb1346ed Mon Sep 17 00:00:00 2001 From: meloalright Date: Thu, 25 Apr 2024 02:18:40 +0800 Subject: [PATCH 7/7] feat: upd vue-playground-without-softlink artifact --- .github/workflows/playground_without_softlink.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/playground_without_softlink.yml b/.github/workflows/playground_without_softlink.yml index d21c9bb..7d500fc 100644 --- a/.github/workflows/playground_without_softlink.yml +++ b/.github/workflows/playground_without_softlink.yml @@ -34,7 +34,7 @@ jobs: - name: Archive vue-playground results uses: actions/upload-artifact@v3 with: - name: vue-playground-use-latest + name: vue-playground-without-softlink path: | vue-playground !vue-playground/node_modules \ No newline at end of file