create-milost-app

Create MiLost apps with WASM and SharedArrayBuffer support out of the box

create-milost-app

Create MiLost applications with WebAssembly, WebGL, and SharedArrayBuffer support out of the box.

Installation

You don't need to install this package globally. Use npx:

npx create-milost-app my-app

Usage

Create a console application

npx create-milost-app my-app

Create a web application with WebGL UI

npx create-milost-app my-app --ui

What You Get

Every MiLost app created includes:

Performance Features (Automatic)

  • WebAssembly acceleration - 10-100x performance boost
  • SIMD support - 1.7-4.5x additional speedup
  • SharedArrayBuffer threading - Multi-threading support
  • WebGL rendering - Hardware-accelerated UI
  • Web Workers - Automatic parallelization
  • Hot reload - Instant feedback during development

Project Structure

my-app/
├── src/
│   ├── main.ts              # Application entry point
│   ├── internal/
│   │   └── bootstrap.ts     # WASM/WebGL initialization
│   └── views/
│       └── MainView.ts      # UI components (--ui mode)
├── public/
│   └── index.html           # HTML template (--ui mode)
├── package.json
└── tsconfig.json

Development Commands

npm run dev        # Start dev server with hot reload
npm run build      # Build for production
npm run start      # Start production server
npm run type-check # TypeScript type checking
npm run clean      # Clean build artifacts

Development Server

UI applications automatically use milost-dev-server which provides:

  • Automatic CORS headers for SharedArrayBuffer
  • WebSocket-based hot reload
  • WASM streaming compilation
  • Proper MIME types for all assets
  • Zero configuration required

Browser Support

  • Basic WASM: 100% of modern browsers
  • SIMD acceleration: 85%+ of browsers
  • SharedArrayBuffer: ~70% of browsers (with proper headers)
  • WebGL: 98%+ of browsers
  • Automatic fallbacks ensure 100% compatibility

Examples

Simple Console App

import { Vec, Option, Result } from 'milost';

const numbers = Vec.from([1, 2, 3, 4, 5]);
const doubled = numbers.batchMap(x => x * 2);
console.log('Doubled:', doubled.toArray());

WebGL UI App

import { MiLostUI, View, Text, VStack } from 'milost/ui';

export class MainView extends View {
  build() {
    return VStack([
      Text('Hello from WebGL!').fontSize(24),
      Text('Powered by MiLost').color('#667eea')
    ]).padding(20);
  }
}

Requirements

  • Node.js >= 16.0.0
  • Modern browser with WebAssembly support

License

MIT

Links