René's URL Explorer Experiment

{"@context":"https://schema.org","@type":"DiscussionForumPosting","headline":"BridgeJS: Declarative JS interop","articleBody":"## Motivation\n\nCurrent JS interop system, [JavaScriptKit](https://github.com/swiftwasm/JavaScriptKit), has two main issues:\n\n* It's based on dynamic, string-based method calls and properties access.\n    * It's not type-safe and can easily lead to runtime errors even if the JS side is written with types (like TypeScript).\n    * There are non-trivial performance penalties due to the dynamism.\n* There is no easy way to expose Swift functionalities to JS side.\n    * Developer productivity\n    * We need to write so many boilerplates to set up closures and type conversions for each exposed function.\n    * Has some performance penalties too.\n\n## Current Status\n\nTry on our playground https://swiftwasm.org/JavaScriptKit/PlayBridgeJS/\n\n## High-level API\n\nGiven the following interface:\n\n```\n// bridge.d.ts\nexport interface CanvasContext {\n  drawRect(x: number, y: number, width: number, height: number) =\u003e void;\n}\n\n// App.swift\npublic struct App {\n    let context: CanvasContext\n    @ExposeToJS\n    init(context: CanvasContext) {\n        self.context = context\n    }\n\n    struct PointerEvent {\n        let x: Int\n        let y: Int\n        let pointerId: Int\n    }\n\n    @ExposeToJS\n    func feedPointerEvents(_ events: [PointerEvent]) {\n        ...\n        context.drawRect(...)\n    }\n}\n```\n\nThen SwiftPM Build Plugin or standalone CLI tool should generate:\n1. Swift and JS bridging glue code to expose `CanvasContext` to Swift\n2. Swift and JS/TS bridging glue code to expose `App` methods to JS/TS\n\n\n## Breakdown\n\n- [x] Produce ES Module package with some instantiation JS code and .wasm\n  - [x] Check if the current SwiftPM Plugin API has enough capability to produce a JS package\n  - [x] https://github.com/swiftwasm/JavaScriptKit/pull/288\n- [x] Prototype a tool to expose Swift interface to TS/JS\n  - [x] Check if we can process it without swift-syntax dependency (to avoid longer build time)\n  - [x] Performance benchmark\n- [x] Prototype a tool to import TS interface to Swift\n  - [x] Check if TypeScript Compiler API can handle third-party JS packages\n  - [x] Performance benchmark\n\n## Other Languages\n\n* https://learn.microsoft.com/en-us/aspnet/core/client-side/dotnet-interop?view=aspnetcore-9.0\n* https://kotlinlang.org/docs/js-to-kotlin-interop.html\n* https://rescript-lang.org/docs/manual/v11.0.0/interop-cheatsheet\n* https://github.com/rustwasm/wasm-bindgen/\n* https://github.com/siefkenj/tsify\n* https://github.com/ocsigen/ts2ocaml\n\n\n","author":{"url":"https://github.com/kateinoigakukun","@type":"Person","name":"kateinoigakukun"},"datePublished":"2025-03-10T08:23:37.000Z","interactionStatistic":{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":0},"url":"https://github.com/290/JavaScriptKit/issues/290"}