Genom Framework — Portfolio

System Design

Five-Layer Architecture

Every layer has a single purpose. The native shell disappears — the user's application is all that matters.

🌐

Web Application

HTML/CSS/JS — game engine, clinic system, AI assistant, media gallery

Any SPA / PWA

↕ postMessage

💉

Injected Polyfills

Notification Bridge · Download Interceptor · AudioContext Lifecycle Manager

Transparent

↕ onMessage

⚛️

App.tsx — React Native Bridge

Message Router (60+ types) · AppState lifecycle · WebView configuration

TypeScript

↕ NativeModules

☕

GenomModule.java — 2,400+ lines

File I/O · Media · Downloads · Vibration · Notifications · PiP · Streaming

Java

↕ Android Services

🔧

Android Services + Embedded HTTP Server

ContinuousWorkService · MusicService · NanoHTTPD (127.0.0.1, dynamic port, 70+ MIME types)

SDK 24–34

bridge.js — Canonical Native Communication Layer

// Every web app running inside Genom uses this exact pattern.
// The entire 80+ API surface is accessible through one function.

export function send(type, payload = {}) {
    if (window.ReactNativeWebView) {
        window.ReactNativeWebView.postMessage(JSON.stringify({ type, ...payload }));
    }
}

// Background persistence — keeps WebView alive even when app is backgrounded
export function startCW(title, body) { send('startContinuousWork', { title, body }); }

// Persistent key-value store — reads/writes to native sandbox via embedded HTTP server
export const dataStore = {
    write: (key, data) => fetch(`http://127.0.0.1:${port}/_data/${key}`, { method: 'POST', body: data }),
    read:  (key) => fetch(`http://127.0.0.1:${port}/_data/${key}`).then(r => r.json()),
    list:  (dir) => fetch(`http://127.0.0.1:${port}/_data/${dir}`).then(r => r.json()),
    delete: (key) => fetch(`http://127.0.0.1:${port}/_data/${key}`, { method: 'DELETE' })
};
        

Built on Genom

Applications

Each application demonstrates a different dimension of Genom's capability — from GPU-accelerated games to on-device AI to enterprise management systems.

Naomi AI

On-Device AI Assistant

Sequential multi-model AI pipeline running entirely on-device. Permanent text model (Gemma 3 1B), on-demand vision analysis (SmolVLM2), semantic search via embeddings. The sequencing logic runs in JavaScript — the bridge provides atomic load/infer/unload primitives.

llama.cpp Gemma 3 1B SmolVLM2 Embeddings RAG

Genom Clinic

Clinic Management System

Full-featured clinic management — patient records, appointment scheduling, billing, and reporting — running inside the Genom runtime. Deployed via OTA update pipeline with a custom SYNCED loader that animates in sync with the loading progress.

Genom Runtime OTA Updates Offline-First Custom Loader

Modern Server

Server Management Platform

Cross-platform Python desktop application for managing Nginx, PHP, and custom server processes. Features real-time analytics, encrypted update delivery (AES-256 machine-bound keys), built-in terminal emulator, and live process monitoring.

Python WebView2 AES-256 Nginx Analytics

🎮

I Identify as a Horse

Custom 3D Game

A fully custom 3D game distributed as a white-label Genom APK. Demonstrates GPU-accelerated WebGL rendering at 60fps through the hardware-composited WebView. Built with PlayCanvas and wrapped via the Genom build pipeline.

WebGL 60fps PlayCanvas White-Label

Noir Audio Studio

Professional Audio Workstation

Professional audio workstation with waveform visualization and multi-track editing. Uses Genom's native file APIs for full filesystem access and the background audio service for uninterrupted playback even when backgrounded.

Web Audio API MusicService Waveform File I/O

Noir GIF Studio

Professional GIF Editor

Professional-grade, browser-based GIF editor featuring a cinematic dark aesthetic. Provides a CapCut-style multi-track timeline interface optimized for creating, editing, and exporting animated GIFs with unprecedented speed.

Vite gifenc IndexedDB Canvas API Timeline

X-Local

Media Gallery & File Manager

Full device media browser using Genom's scanDeviceMedia, getVideoThumbnail, and streamFileChunk APIs. Supports image viewing, video playback, audio browsing, and MediaStore grouped scanning — all at native speed.

MediaStore Chunk Streaming Thumbnails Gallery

The Bridge

80+ Native APIs

All accessible from JavaScript via a single postMessage contract.

📂 File System

browseDirectoryList directory contents

readFileRead file with encoding control

writeFileWrite data to any path

streamFileChunkSeek + chunk streaming via RandomAccessFile

searchFilesRecursive filesystem search

moveFile / copyFileNative file operations

🎬 Media & Streaming

scanDeviceMediaScan gallery, audio, video

scanMediaGroupedMediaStore grouped by folder

getVideoThumbnailNative frame extraction

getVideoMetadataDuration, resolution, codec

startMusicNotificationBackground audio bypass service

shareMultipleFilesNative Android share sheet

🔔 Services & Notifications

startContinuousWorkForeground service + WakeLock

updateContinuousWorkLive notification update

showHeadsUpNotificationHigh-priority alert

showProgressNotificationProgress bar notification

startDataSyncServiceNamed sync foreground service

enterPiPPicture-in-Picture mode

🤖 Haptics & System

vibratePatternCustom timing + amplitude arrays

vibrateContinuousSustained amplitude vibration

setThemeColorDynamic status/nav bar color

setStatusBar / setNavBarShow/hide system bars

checkStorage / requestStorageRuntime permission management

loadAI / generateTextOn-device LLM inference streaming

Not a Weekend Project

6 Months of Continuous Development

88 versioned build snapshots totaling 22 GB of compressed archives — one committed developer, one obsessive framework.

January 2026

Foundation

Core React Native bridge architecture established. Initial WebView-to-Java message routing. First white-label APK build pipeline.

3 snapshots · ~200 MB each

February 2026

Native Module Expansion

File system APIs, media scanning, download manager integration. First application (audio studio) deployed via the pipeline.

16 snapshots

March 2026

Performance Overhaul & Boot v1

GPU compositing layer tuned. Zero-flash boot sequence v1 implemented. Embedded NanoHTTPD server added for CORS-free local asset serving.

21 snapshots

April 2026

Custom Loader API v3 + Naomi AI

Complete Fade-Through-Black boot doctrine implemented. Three-mode custom loader system (BRAINLESS/SYNCED/EXTENDED). Naomi AI on-device LLM pipeline integrated with llama.cpp JNI bridge. Security architecture finalized.

30 snapshots — most active month

May 2026

Windows Platform + AES-256 + Continuous Work Engine

Full Windows shell built with Python + WebView2. AES-256-CBC machine-bound file encryption with in-memory decryption serving. Continuous Work Engine replacing DataSync service. Smart notification retry system for Android 13+.

23 snapshots · up to 416 MB each

Technical Stack

Skills Demonstrated

☕

Java / Android SDK

2,400+ line native module. Foreground services, NanoHTTPD, MediaStore, JNI bridge to llama.cpp.

⚛️

TypeScript / React Native

60+ message type router in App.tsx. 208KB ManagerHTML.ts distribution SPA.

🔐

Cryptography

AES-256-CBC, PBKDF2-HMAC-SHA256 (100k iterations), SHA-256 file obfuscation, in-memory decryption.

🤖

On-Device AI

Sequential LLM pipeline. Text + vision + embedding models. Streaming token output via JNI.

🏗️

System Architecture

5-layer hybrid architecture. Zero-glitch boot doctrine. White-label deployment pipeline.

🔧

DevOps / Build Pipeline

Automated Gradle + Metro builds. AST-level package renaming. Corruption detection and auto-repair.

🐍

Python Backend

Asyncio microservices. PyInstaller packaging. Encrypted update delivery. Real-time analytics.

🌐

Web Fundamentals

Vanilla JS/TS, no frameworks. Custom component lifecycle. Event delegation. WebGL. Web Audio API.

An InvisibleSuperstructure

Five-Layer Architecture

Applications

80+ Native APIs

6 Months of Continuous Development

Skills Demonstrated

An Invisible
Superstructure