Optimize WASM frontend performance

[eddmann]

Description

Review and optimize the WASM frontend to improve performance, reduce latency, and ensure smooth 60 FPS gameplay in the browser.

Tasks

• Profile current WASM performance bottlenecks
• Measure frame time and identify slowest components
• Optimize PHP-WASM runtime configuration
• Review JIT settings and PHP compilation flags
• Optimize JavaScript-PHP interop layer
• Reduce memory allocations and garbage collection
• Optimize frame rendering pipeline
• Implement WebGL rendering if beneficial
• Add performance metrics/FPS counter
• Test on various browsers and devices
• Compare with other WASM emulators

Areas to Investigate

• PHP-WASM JIT optimization settings
• Memory management and object pooling
• JavaScript rendering performance (Canvas 2D vs WebGL)
• Input handling efficiency
• Audio buffer management
• File system operations (ROM loading, save states)

Acceptance Criteria

• Maintains 60 FPS on modern browsers
• Startup time is acceptable (<3 seconds)
• Input latency is minimal
• Works on mobile devices at reasonable speed
• Memory usage is stable over time

Performance Targets

• Frame time: <16.67ms (60 FPS)
• Input latency: <50ms
• ROM load time: <2s for typical ROMs
• Memory usage: <100MB for typical games

References

• Current bundler: bin/bundle-wasm.php
• Web frontend: web/ directory

[eddmann]

Current Implementation Status: ✅ Core Complete, 🔄 Performance Work Needed

What's Already Implemented

The WASM frontend is fully functional with these features:

✅ Complete WASM Bundler (bin/bundle-wasm.php)

• Bundles all 69 PHP source files into single WASM-compatible file
• PHP 8.2 compatibility transformations
• Automatic namespace conversion

✅ Browser Frontend (web/)

• Full HTML5 interface with Canvas 2D rendering (160x144)
• FPS counter and performance monitoring built-in
• Speed controls, pause/resume, savestate support
• Screenshot capability
• JavaScript-PHP bridge using php-wasm

✅ PHP-WASM Configuration

• JIT enabled: opcache.jit=1255, opcache.jit_buffer_size=100M
• Batch rendering: Processes 4 frames per render to reduce overhead
• Non-blocking rendering loop

Performance Status

⚠️ Known Performance Issues:

• README notes: "WASM frontend has significant performance overhead"
• Current rendering uses Canvas 2D only (not hardware-accelerated WebGL)
• Struggles to maintain 60 FPS on most browsers

Tasks Remaining

High Priority:

• Profile current WASM performance bottlenecks ✅ FPS counter implemented
• Implement WebGL renderer (main performance win)
• Optimize JavaScript-PHP interop layer
• Add performance metrics dashboard (basic FPS exists)

Medium Priority:

• Test on various browsers and devices
• Memory profiling and optimization
• Compare with other WASM emulators

Low Priority:

• Optimize PHP-WASM JIT settings (already configured)
• ROM load time optimization

Next Steps

1. WebGL Renderer: Moving from Canvas 2D to WebGL would provide hardware acceleration - this is likely the biggest performance win
2. Profiling: Use browser DevTools to identify JavaScript/WASM bottlenecks
3. Memory Management: Profile memory allocations during gameplay

References

• Bundler: bin/bundle-wasm.php
• Web frontend: web/ directory
• Current FPS counter: web/js/phpboy.js