Review suggestions

ts/@live-compositor/web/package.json → ts/@live-compositor/web-wasm/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "@live-compositor/web",
+  "name": "@live-compositor/web-wasm",
   "version": "0.1.0-rc.0",
   "description": "",
   "main": "dist/index.js",

ts/@live-compositor/web/src/compositor.ts → ts/@live-compositor/web-wasm/src/compositor.ts

@@ -25,6 +25,10 @@ export default class LiveCompositor {
     this.options = options;
   }
 
+  /*
+   * Initializes LiveCompositor instance. It needs to be called before any resource is registered.
+   * Outputs won't produce any results until `start()` is called.
+   */
   public async init(): Promise<void> {
     this.renderer = await Renderer.create({
       streamFallbackTimeoutMs: this.options.streamFallbackTimeoutMs ?? 500,
@@ -66,10 +70,16 @@ export default class LiveCompositor {
     await this.renderer!.registerFont(fontUrl);
   }
 
+  /**
+   * Starts processing pipeline. Any previously registered output will start producing video data.
+   */
   public async start(): Promise<void> {
     await this.coreCompositor?.start();
   }
 
+  /**
+   * Stops processing pipeline.
+   */
   public stop(): void {
     this.instance?.stop();
   }

ts/@live-compositor/web/src/input/input.ts → ts/@live-compositor/web-wasm/src/input/input.ts

@@ -6,11 +6,13 @@ import InputSource from './source';
 import { RegisterInputRequest } from '@live-compositor/core';
 
 /**
- * Represents frame produced by decoder. All `InputFrame`s have to be manually freed.
+ * Represents frame produced by decoder.
+ * `InputFrame` has to be manually freed from the memory by calling `free()` method. Once freed it no longer can be used.
+ * `Queue` on tick pulls `InputFrame` for each input and once render finishes, manually frees `InputFrame`s.
  */
 export type InputFrame = Frame & {
   /**
-   * Frees InputFrame from memory. InputFrame can not be used after `free()`.
+   * Frees `InputFrame` from memory. `InputFrame` can not be used after `free()`.
    */
   free: () => void;
 };

ts/@live-compositor/web/src/input/mp4/demuxer.ts → ts/@live-compositor/web-wasm/src/input/mp4/demuxer.ts

@@ -37,7 +37,7 @@ export class MP4Demuxer {
 
   private onReady(info: MP4Info) {
     if (info.videoTracks.length == 0) {
-      throw 'No video tracks';
+      throw new Error('No video tracks');
     }
 
     const videoTrack = info.videoTracks[0];
@@ -67,12 +67,12 @@ export class MP4Demuxer {
   }
 
   private getCodecDescription(trackId: number): Uint8Array {
-    const trak = this.file.getTrackById(trackId);
-    if (!trak) {
-      throw 'Track does not exist';
+    const track = this.file.getTrackById(trackId);
+    if (!track) {
+      throw new Error('Track does not exist');
     }
 
-    for (const entry of trak.mdia.minf.stbl.stsd.entries) {
+    for (const entry of track.mdia.minf.stbl.stsd.entries) {
       const box = entry.avcC || entry.hvcC || entry.vpcC || entry.av1C;
       if (box) {
         const stream = new DataStream(undefined, 0, DataStream.BIG_ENDIAN);
@@ -81,6 +81,6 @@ export class MP4Demuxer {
       }
     }
 
-    throw 'Codec description not found';
+    throw new Error('Codec description not found');
   }
 }

ts/@live-compositor/web/src/manager/wasmInstance.ts → ts/@live-compositor/web-wasm/src/manager/wasmInstance.ts

@@ -48,9 +48,9 @@ class WasmInstance implements CompositorManager {
     } else if (route.type === 'image') {
       await this.handleImageRequest(route.id, route.operation, request.body);
     } else if (route.type === 'shader') {
-      throw 'Shaders are not supported';
+      throw new Error('Shaders are not supported');
     } else if (route.type === 'web-renderer') {
-      throw 'Web renderers are not supported';
+      throw new Error('Web renderers are not supported');
     }
 
     return {};
@@ -62,12 +62,13 @@ class WasmInstance implements CompositorManager {
 
   private start() {
     if (this.stopQueue) {
-      throw 'Compositor is already running';
+      throw new Error('Compositor is already running');
     }
     this.stopQueue = this.queue.start();
   }
 
   public stop() {
+    // TODO(noituri): Clean all remaining `InputFrame`s
     if (this.stopQueue) {
       this.stopQueue();
       this.stopQueue = undefined;

ts/examples/vite-browser-render/package.json

@@ -12,7 +12,7 @@
   },
   "dependencies": {
     "@live-compositor/browser-render": "0.1.0-rc.4",
-    "@live-compositor/web": "0.1.0-rc.0",
+    "@live-compositor/web-wasm": "0.1.0-rc.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1"
   },

ts/examples/vite-browser-render/src/examples/MP4Player.tsx

@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useState } from 'react';
-import { LiveCompositor } from '@live-compositor/web';
+import { LiveCompositor } from '@live-compositor/web-wasm';
 import { InputStream, Text, useInputStreams, View } from 'live-compositor';
 
 const BUNNY_URL = 'https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4';