Grepedia
PO

PocketJS

A portable application runtime that compiles component code into native pixels for radically different hardware, from classic handhelds to modern desktops.

Score1
About

PocketJS is a portable application runtime designed to transform modern component-based JavaScript and TypeScript code into native pixel output across a wide array of hardware. Created as a non-VC-backed project by Pocket Lab, it provides developers with familiar reactive component models while offloading heavy rendering and layout work to a compact, platform-agnostic Rust core. By avoiding browser engines, WebViews, and traditional CSS systems, PocketJS ensures that applications perform with extreme efficiency, making it suitable for everything from modern desktops to performance-constrained legacy handheld consoles.

The system is built on a framework-agnostic architecture, supporting Solid, Vue Vapor, and Octane. These frameworks target the same unified native tree and HostOps surface, meaning that developers can switch their reactive layer without altering the underlying rendering pipeline or styling logic. The system uses a build-time Tailwind-subset compiler that parses utility classes into binary style tables, completely eliminating runtime CSS parsing. Furthermore, text is handled through pre-baked font atlases generated at build time, ensuring that the runtime never needs to perform expensive glyph rasterization.

Some of the key features are:

  • Cross-Platform Portability: Deploy the same codebase to targets ranging from the Sony PSP and PS Vita to desktop environments and microcontrollers like the ESP32-P4.
  • Framework Flexibility: Build apps using Solid, Vue Vapor, or Octane while targeting the same highly efficient native tree architecture.
  • Optimized Rendering: Leverages a compact Rust-based core to handle layout via Taffy and generate DrawLists for native GPU backends.
  • No-Browser Overhead: Bypasses the standard DOM and CSS engine to run directly on native metal, ensuring minimal memory and CPU consumption.
  • Deterministic Performance: Offers precise frame timing with a fixed 60Hz tick rate, allowing for byte-exact simulation and robust testing workflows.
  • Build-Time Compilation: Pre-bakes styles, font glyphs, and assets into optimized bundles, reducing startup time and runtime resource usage.

Operating as a highly efficient guest-host system, PocketJS utilizes QuickJS as the JavaScript interpreter, while the native Rust core manages the retained node tree, flexbox layout, and animation tracks. This separation allows the system to be extremely lightweight; for instance, a full-featured application can operate within just 8 MB of memory on a 333 MHz handheld. By treating the frame counter as the primary source of truth, the runtime ensures that UI interactions remain deterministic, preventing common flaky test scenarios and enabling sophisticated time-travel debugging capabilities.

Some common use cases include:

  • Legacy Hardware Revival: Developing modern, reactive user interfaces and games for vintage handheld devices like the Sony PSP or PS Vita.
  • Performance-Critical UI: Creating high-performance desktop companion widgets or digital characters that require minimal system resources.
  • Embedded Systems: Building feature-rich graphical interfaces for embedded hardware platforms with constrained memory and processing power.
  • Deterministic Testing: Using headless simulation and byte-perfect rendering to test complex interactive interfaces with absolute consistency.