Runtime Bridge

RelScript, manifest-driven packages, and RAVADY's hybrid renderer working as one system. Build polished interfaces with web-grade layout, native services, and explicit capability control.

Critical Integration Points

Essential bridges between RelScript and WebNative technologies

RelScript Runtime

Modern system language tooling compiled into efficient runtime targets for packaged native apps

relscript → transpile → runtime-managed execution

WebNative Services

HTML/CSS layout, motion, and canvas rendering delivered through native Ravady surfaces

HTML/CSS surfaces → hybrid renderer → native windows

Capability Bridge

Manifest-declared permissions and package contracts bound directly to trusted system services

manifest → capability bridge → trusted services

RelScript Integration

Modern language features powering RAVADY OS applications

Key RelScript Features

  • ✓
    Modern Syntax: Clean, readable code with advanced language features
  • ✓
    Type Safety: Optional typing with compile-time verification
  • ✓
    Performance: Compiled to efficient bytecode for native execution
  • ✓
    Capability Aware: System APIs are bound through manifests, policies, and explicit launcher permissions 
// RelScript Example - Native Surface + Services
import { readDirectory, notify } from '@ravady/system'

async function WorkspacePanel() {
    const files = await readDirectory('/workspace/projects')

    notify({
        title: 'Workspace indexed',
        body: `${files.length} files available`
    })

    return {
        surface: 'window',
        title: 'Workspace',
        view: `
            

                
RAVADY Workspace

                
${files.length} files ready for review.

            

        `
    }
}

export default WorkspacePanel

Hybrid UI Engine

Web-grade layout and animation composed into native Ravady surfaces

// Hybrid UI Surface Integration
class HybridSurface {
    constructor(manifest) {
        this.surface = RavadySurface.createWindow(manifest.window)
        this.capabilities = CapabilityBroker.attach(manifest.permissions)
        this.dom = new SurfaceDOM(this.surface)
    }

    async mount(component) {
        const tree = await component.render({
            services: this.capabilities
        })

        this.dom.commit(tree)
        this.surface.present()
    }

    snapshot() {
        return this.surface.captureState()
    }
}

WebNative Capabilities

  • GPU Acceleration: Hardware-accelerated graphics and rendering Designed to grow with richer visual experiences over time.
  • ✓
    Web-Grade Layout: HTML, CSS, and motion primitives adapted for native interface surfaces
  • ✓
    Surface Integration: Windowing, input, and rendering tied directly into the Ravady GUI engine
  • ✓
    Capability Binding: System APIs are surfaced through policy-aware runtime bridges instead of unrestricted browser globals

Application Composition

Ravady-native surfaces, packaged modules, and controlled compatibility layers

RelScript View Layer

✓ Declarative surface composition
✓ Async state and task orchestration
✓ Manifest-aware packaging and launch
✓ Direct bindings to trusted OS services 
// RelScript view composition
function App(state) {
    return {
        surface: 'window',
        title: 'Control Center',
        view: `
            

                
${state.user}

                
${state.summary}

            

        `
    }
}

Package Composition

✓ HTML/CSS assets bundled beside runtime code
✓ Metadata contracts for install, update, and trust
✓ Compatibility shims where they add practical value
✓ No framework lock-in required for premium UI 
// Package manifest excerpt
{
  "name": "control-center",
  "entry": "main.rel",
  "permissions": ["fs.read", "notifications.send"],
  "assets": ["ui/shell.html", "ui/theme.css"],
  "dependencies": ["@ravady/charts"]
}

Package Interoperability

Practical reuse of external packages through metadata mapping, policy checks, and runtime shims

Ravady is designed to make familiar packages feel natural inside one thoughtful environment, with clear boundaries and a dependable experience.

Interoperability Features

  • ✓
    Metadata Mapping: Package metadata is normalized into Ravady manifests and install policies
  • ✓
    Dependency Resolution: Conflict handling, version control, and declared runtime selection
  • ✓
    Security Scanning: Trust evaluation, policy checks, and permission review before launch
  • ✓
    Build Hooks: Toolchain adapters can reshape third-party code into Ravady-friendly artifacts when justified 
// Package interoperability in RAVADY OS
$ rav add @ravady/charts date-fns

import chart from '@ravady/charts'
import { format } from 'date-fns'
import { openWindow, fetchJSON } from '@ravady/system'

async function launchDashboard() {
    const records = await fetchJSON('/services/metrics')

    return openWindow({
        title: 'Metrics',
        view: chart.render(records.map(item => ({
            label: format(item.date, 'MMM d'),
            value: item.value
        })))
    })
}
Signed
Manifest Flow
Install and launch stay policy-aware
Practical
Reuse
Adopt packages that fit the runtime model
No
Framework Lock-In
Premium UI without making a browser framework the platform

Live Integration Demo

See RelScript, hybrid surfaces, and system services working together

RelScript Source

// dashboard.rel
import { fetchJSON, notify } from '@ravady/system'

async function Dashboard() {
    const metrics = await fetchJSON('/services/runtime/metrics')

    notify({ title: 'Runtime ready', body: 'Metrics service connected' })

    return {
        surface: 'window',
        title: 'Runtime Dashboard',
        view: `<main class="hybrid-app"><h1>RAVADY Runtime Demo</h1></main>`,
        data: metrics
    }
}

Compilation Process

1
RelScript → AST
2
Manifest merge
3
Capability binding
4
Hybrid surface build
5
Runtime launch

Performance Metrics

Cold start: <120ms target
Surface commit: Single-pass
Policy checks: Manifest-scoped
Memory profile: Predictable
Recovery state: Snapshot-ready