build: add font subsetting for WASM and fix DataSaverState

Author: FunnySaltyFish

composeApp/build.gradle.kts

@@ -12,6 +12,35 @@ plugins {
     alias(libs.plugins.compose.compiler)
 }
 
+val subsetFontCommand = if (System.getProperty("os.name").startsWith("Windows", ignoreCase = true)) {
+    listOf("cmd", "/c", "python", "scripts/subset_wasm_font.py")
+} else {
+    listOf("python3", "scripts/subset_wasm_font.py")
+}
+
+val subsetWasmFont by tasks.registering(Exec::class) {
+    group = "compose"
+    description = "Generate the wasm subset font from Compose string resources."
+    workingDir = rootDir
+    commandLine(subsetFontCommand)
+    inputs.file(rootProject.file("scripts/font-source/NotoSansSC_VF.ttf"))
+    inputs.files(
+        project.file("src/commonMain/composeResources/values/strings.xml"),
+        project.file("src/commonMain/composeResources/values-zh/strings.xml")
+    )
+    outputs.file(project.file("src/wasmJsMain/composeResources/font/NotoSansSC_WasmSubset.ttf"))
+}
+
+listOf(
+    "generateResourceAccessorsForWasmJsMain",
+    "copyNonXmlValueResourcesForWasmJsMain",
+    "prepareComposeResourcesTaskForWasmJsMain"
+).let { taskNames ->
+    tasks.matching { it.name in taskNames }.configureEach {
+        dependsOn(subsetWasmFont)
+    }
+}
+
 kotlin {
     targets.configureEach {
         compilations.configureEach {

composeApp/src/wasmJsMain/composeResources/font/NotoSansSC_WasmSubset.ttf

@@ -11,7 +11,7 @@ import androidx.compose.ui.platform.LocalFontFamilyResolver
 import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.window.ComposeViewport
 import com.funny.data_saver.ui.App
-import composedatasaver.composeapp.generated.resources.NotoSansSC_VF
+import composedatasaver.composeapp.generated.resources.NotoSansSC_WasmSubset
 import composedatasaver.composeapp.generated.resources.Res
 import kotlinx.browser.document
 import org.jetbrains.compose.resources.ExperimentalResourceApi
@@ -21,7 +21,7 @@ import org.jetbrains.compose.resources.preloadFont
 fun main() {
     ComposeViewport(document.body!!) {
         val fontResolver = LocalFontFamilyResolver.current
-        val fallbackFont by preloadFont(Res.font.NotoSansSC_VF)
+        val fallbackFont by preloadFont(Res.font.NotoSansSC_WasmSubset)
         var fallbackFontReady by remember { mutableStateOf(false) }
 
         LaunchedEffect(fallbackFont) {

composeApp/src/wasmJsMain/kotlin/com/funny/data_saver/main.kt

@@ -7,7 +7,7 @@
     <link type="text/css" rel="stylesheet" href="styles.css">
     <link
             rel="preload"
-            href="./composeResources/composedatasaver.composeapp.generated.resources/font/NotoSansSC_VF.ttf"
+            href="./composeResources/composedatasaver.composeapp.generated.resources/font/NotoSansSC_WasmSubset.ttf"
             as="fetch"
             type="font/ttf"
             crossorigin

composeApp/src/wasmJsMain/resources/index.html

@@ -192,24 +192,24 @@ inline fun <reified T> rememberDataSaverState(
 ): DataSaverMutableState<T> {
     val saverInterface = getLocalDataSaverInterface()
     val valueType = typeOf<T>()
-    var state: DataSaverMutableState<T>? = null
-    val restorer by remember(initialValue, typeConverter) {
-        lazy {
-            resolveRestorer(typeConverter, valueType, initialValue)
-        }
+    val restorer = remember(initialValue, typeConverter, valueType) {
+        resolveRestorer(typeConverter, valueType, initialValue)
+    }
+    val state = remember(saverInterface, key, initialValue, typeConverter, savePolicy, async, coroutineScope) {
+        mutableDataSaverStateOf(saverInterface, key, initialValue, typeConverter, savePolicy, async, coroutineScope)
     }
 
-    LaunchedEffect(key1 = senseExternalDataChange) {
-        if (!senseExternalDataChange || state == null) return@LaunchedEffect
+    LaunchedEffect(saverInterface, key, senseExternalDataChange, state, restorer) {
+        if (!senseExternalDataChange) return@LaunchedEffect
         if (!saverInterface.senseExternalDataChange) {
             Log.e("ComposeDataSaver", "to enable senseExternalDataChange, you should set `senseExternalDataChange` to true in DataSaverInterface")
             return@LaunchedEffect
         }
         saverInterface.externalDataChangedFlow?.collect { pair ->
             val (k, v) = pair
             Log.i("ComposeDataSaver", "externalDataChangedFlow: $key -> $v")
-            if (k == key && v != state?.value) {
-                val d = if (v != null) {
+            if (k == key) {
+                val restoredValue = if (v != null) {
                     if (v is String) {
                         val restore = restorer ?: unsupportedType(initialValue, "restore")
                         restore(v) as T
@@ -219,29 +219,27 @@ inline fun <reified T> rememberDataSaverState(
                 } else {
                     // if the value is null
                     // and the type is nullable
-                    if (typeOf<T>().isMarkedNullable) v as T
+                    if (valueType.isMarkedNullable) v as T
                     else initialValue
                 }
-                // to avoid duplicate save
-                state?.setValueWithoutSave(d)
+                if (restoredValue != state.value) {
+                    // to avoid duplicate save
+                    state.setValueWithoutSave(restoredValue)
+                }
             }
         }
     }
 
-    DisposableEffect(key, savePolicy) {
+    DisposableEffect(key, savePolicy, state) {
         onDispose {
             Log.i("ComposeDataSaver", "rememberDataSaverState: state of key=\"$key\" onDisposed!")
-            if (savePolicy == SavePolicy.DISPOSED && state != null && state!!.valueChangedSinceInit()) {
-                state!!.saveData()
+            if (savePolicy == SavePolicy.DISPOSED && state.valueChangedSinceInit()) {
+                state.saveData()
             }
         }
     }
 
-    return remember(saverInterface, key, initialValue, typeConverter, savePolicy, async, coroutineScope) {
-        mutableDataSaverStateOf(saverInterface, key, initialValue, typeConverter, savePolicy, async, coroutineScope).also {
-            state = it
-        }
-    }
+    return state
 }
 
 /**

data-saver-core/src/commonMain/kotlin/com/funny/data_saver/core/DataSaverState.kt

@@ -1,6 +1,9 @@
 package com.funny.data_saver.core
 
 import kotlinx.browser.localStorage
+import kotlinx.browser.window
+import kotlinx.coroutines.flow.MutableSharedFlow
+import org.w3c.dom.StorageEvent
 import org.w3c.dom.get
 import org.w3c.dom.set
 
@@ -12,10 +15,40 @@ open class DataSaverLocalStorage(
     private val keyPrefix: String = "DataSaver_",
     senseExternalDataChange: Boolean = false
 ) : DataSaverInterface(senseExternalDataChange) {
+    private companion object {
+        private val sharedFlows = mutableMapOf<String, MutableSharedFlow<Pair<String, Any?>>>()
+        private var storageListenerRegistered = false
+
+        private fun flowForPrefix(keyPrefix: String): MutableSharedFlow<Pair<String, Any?>> {
+            return sharedFlows.getOrPut(keyPrefix) {
+                MutableSharedFlow(replay = 1)
+            }
+        }
+
+        private fun ensureStorageListener() {
+            if (storageListenerRegistered) return
+            storageListenerRegistered = true
+            window.addEventListener("storage") { event ->
+                val storageEvent = event as? StorageEvent ?: return@addEventListener
+                val changedKey = storageEvent.key ?: return@addEventListener
+                sharedFlows.forEach { (prefix, flow) ->
+                    if (changedKey.startsWith(prefix)) {
+                        flow.tryEmit(changedKey.removePrefix(prefix) to storageEvent.newValue)
+                    }
+                }
+            }
+        }
+    }
+
+    init {
+        if (senseExternalDataChange) {
+            externalDataChangedFlow = flowForPrefix(keyPrefix)
+            ensureStorageListener()
+        }
+    }
 
-    // localStorage doesn't support listener by default, so we manually notify the listener
     private fun notifyExternalDataChanged(key: String, value: Any?) {
-        if (senseExternalDataChange) externalDataChangedFlow?.tryEmit(key to value)
+        externalDataChangedFlow?.tryEmit(key to value)
     }
 
     private fun getPrefixedKey(key: String) = keyPrefix + key
@@ -72,4 +105,4 @@ open class DataSaverLocalStorage(
 
 val DefaultDataSaverLocalStorage by lazy(LazyThreadSafetyMode.PUBLICATION) {
     DataSaverLocalStorage()
-} 
+} 

data-saver-core/src/wasmJsMain/kotlin/com/funny/data_saver/core/DataSaverLocalStorage.kt

@@ -1,5 +1,9 @@
 package com.funny.data_saver.core
 
+import kotlinx.coroutines.async
+import kotlinx.coroutines.flow.first
+import kotlinx.coroutines.test.runTest
+import kotlinx.coroutines.withTimeout
 import kotlin.test.AfterTest
 import kotlin.test.BeforeTest
 import kotlin.test.Test
@@ -272,4 +276,31 @@ class DataSaverLocalStorageTest : DataSaverInterfaceTest() {
         // 清理
         dataSaverLocalStorage.remove(key)
     }
-} 
+
+    @Test
+    fun testExternalChangeFlowSharedAcrossInstances() = runTest {
+        val first = DataSaverLocalStorage(
+            keyPrefix = "shared_",
+            senseExternalDataChange = true
+        )
+        val second = DataSaverLocalStorage(
+            keyPrefix = "shared_",
+            senseExternalDataChange = true
+        )
+        val key = "shared_key"
+        val value = "shared_value"
+
+        val event = async {
+            withTimeout(5_000) {
+                second.externalDataChangedFlow!!.first { (changedKey, changedValue) ->
+                    changedKey == key && changedValue == value
+                }
+            }
+        }
+
+        first.saveData(key, value)
+
+        assertEquals(key to value, event.await())
+        second.remove(key)
+    }
+} 

data-saver-core/src/wasmJsTest/kotlin/com/funny/data_saver/core/DataSaverLocalStorageTest.kt

@@ -0,0 +1,148 @@
+from __future__ import annotations
+
+import argparse
+import sys
+import xml.etree.ElementTree as ET
+from pathlib import Path
+
+try:
+    from fontTools import subset
+    from fontTools.ttLib import TTFont
+except ImportError as exc:
+    raise SystemExit(
+        "Missing dependency: fonttools. Install it with `python -m pip install fonttools`."
+    ) from exc
+
+
+PROJECT_ROOT = Path(__file__).resolve().parent.parent
+DEFAULT_SOURCE_FONT = PROJECT_ROOT / "scripts" / "font-source" / "NotoSansSC_VF.ttf"
+DEFAULT_OUTPUT_FONT = (
+    PROJECT_ROOT
+    / "composeApp"
+    / "src"
+    / "wasmJsMain"
+    / "composeResources"
+    / "font"
+    / "NotoSansSC_WasmSubset.ttf"
+)
+DEFAULT_STRING_FILES = (
+    PROJECT_ROOT / "composeApp" / "src" / "commonMain" / "composeResources" / "values" / "strings.xml",
+    PROJECT_ROOT / "composeApp" / "src" / "commonMain" / "composeResources" / "values-zh" / "strings.xml",
+)
+ASCII_PRINTABLE = "".join(chr(code_point) for code_point in range(0x20, 0x7F))
+
+
+def parse_args() -> argparse.Namespace:
+    parser = argparse.ArgumentParser(
+        description="Generate a wasm-only subset font from Compose string resources."
+    )
+    parser.add_argument(
+        "--source-font",
+        type=Path,
+        default=DEFAULT_SOURCE_FONT,
+        help="Path to the original font file.",
+    )
+    parser.add_argument(
+        "--output-font",
+        type=Path,
+        default=DEFAULT_OUTPUT_FONT,
+        help="Path of the generated subset font.",
+    )
+    parser.add_argument(
+        "--strings",
+        type=Path,
+        nargs="+",
+        default=list(DEFAULT_STRING_FILES),
+        help="String resource XML files to scan.",
+    )
+    parser.add_argument(
+        "--extra-chars",
+        default="",
+        help="Extra characters to force-include.",
+    )
+    return parser.parse_args()
+
+
+def extract_strings(xml_file: Path) -> list[str]:
+    tree = ET.parse(xml_file)
+    root = tree.getroot()
+    texts: list[str] = []
+    for element in root.iter():
+        if element.tag not in {"string", "item"}:
+            continue
+        if element.text:
+            texts.append(element.text)
+    return texts
+
+
+def build_charset(string_files: list[Path], extra_chars: str) -> str:
+    characters = set(ASCII_PRINTABLE)
+    for string_file in string_files:
+        for text in extract_strings(string_file):
+            characters.update(text)
+    characters.update(extra_chars)
+    return "".join(sorted(characters))
+
+
+def subset_font(source_font: Path, output_font: Path, text: str) -> None:
+    options = subset.Options()
+    options.ignore_missing_glyphs = True
+    options.layout_features = ["*"]
+    options.name_IDs = ["*"]
+    options.name_languages = ["*"]
+    options.notdef_outline = True
+    options.recommended_glyphs = True
+    options.symbol_cmap = True
+    options.legacy_cmap = True
+    options.hinting = False
+    options.desubroutinize = True
+
+    font = TTFont(source_font)
+    subsetter = subset.Subsetter(options=options)
+    subsetter.populate(text=text)
+    subsetter.subset(font)
+
+    output_font.parent.mkdir(parents=True, exist_ok=True)
+    font.save(output_font)
+
+
+def format_size(size: int) -> str:
+    units = ("B", "KB", "MB", "GB")
+    current = float(size)
+    for unit in units:
+        if current < 1024 or unit == units[-1]:
+            return f"{current:.2f} {unit}"
+        current /= 1024
+    return f"{size} B"
+
+
+def main() -> int:
+    args = parse_args()
+    source_font = args.source_font.resolve()
+    output_font = args.output_font.resolve()
+    string_files = [path.resolve() for path in args.strings]
+
+    missing_files = [path for path in [source_font, *string_files] if not path.exists()]
+    if missing_files:
+        missing = "\n".join(f" - {path}" for path in missing_files)
+        print(f"Missing required file(s):\n{missing}", file=sys.stderr)
+        return 1
+
+    charset = build_charset(string_files, args.extra_chars)
+    subset_font(source_font, output_font, charset)
+
+    source_size = source_font.stat().st_size
+    output_size = output_font.stat().st_size
+    reduction = 0.0 if source_size == 0 else (1 - output_size / source_size) * 100
+
+    print(f"Source font : {source_font}")
+    print(f"Output font : {output_font}")
+    print(f"Glyph chars : {len(set(charset))}")
+    print(f"Source size : {format_size(source_size)}")
+    print(f"Output size : {format_size(output_size)}")
+    print(f"Reduction   : {reduction:.2f}%")
+    return 0
+
+
+if __name__ == "__main__":
+    raise SystemExit(main())