diff --git a/src/App.tsx b/src/App.tsx
index d4f6b38..4b8a8be 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -21,6 +21,7 @@ import {
   loadSettingsFromStorage,
   saveSettingsToStorage,
 } from './utils/settingsStorage';
+import { clampWasmThreadsForDevice } from './utils/hardwareThreads';
 
 // Singleton instances
 let audioEngine: AudioEngine | null = null;
@@ -228,12 +229,22 @@ const App: Component = () => {
   const persistedSettings = loadSettingsFromStorage();
   const persistedGeneral = persistedSettings.general;
   const persistedAudio = persistedSettings.audio;
-  const persistedModelId = persistedSettings.model?.selectedModelId;
+  const persistedModel = persistedSettings.model;
+  const persistedModelId = persistedModel?.selectedModelId;
   const persistedUi = persistedSettings.ui;
 
   if (persistedModelId && MODELS.some((model) => model.id === persistedModelId)) {
     appStore.setSelectedModelId(persistedModelId);
   }
+  if (persistedModel?.backend !== undefined) {
+    appStore.setModelBackendMode(persistedModel.backend);
+  }
+  if (persistedModel?.encoderQuant !== undefined) {
+    appStore.setEncoderQuant(persistedModel.encoderQuant);
+  }
+  if (persistedModel?.decoderQuant !== undefined) {
+    appStore.setDecoderQuant(persistedModel.decoderQuant);
+  }
   if (persistedGeneral?.energyThreshold !== undefined) {
     appStore.setEnergyThreshold(persistedGeneral.energyThreshold);
   }
@@ -249,6 +260,12 @@ const App: Component = () => {
   if (persistedGeneral?.streamingWindow !== undefined) {
     appStore.setStreamingWindow(persistedGeneral.streamingWindow);
   }
+  if (persistedGeneral?.frameStride !== undefined) {
+    appStore.setFrameStride(persistedGeneral.frameStride);
+  }
+  if (persistedGeneral?.wasmThreads !== undefined) {
+    appStore.setWasmThreads(clampWasmThreadsForDevice(persistedGeneral.wasmThreads));
+  }
   if (persistedUi?.debugPanel?.visible !== undefined) {
     appStore.setShowDebugPanel(persistedUi.debugPanel.visible);
   }
@@ -297,6 +314,26 @@ const App: Component = () => {
     }
   });
 
+  // Keep quantization presets aligned with the backend mode (parakeet.js demo behavior).
+  let lastBackendMode: 'webgpu-hybrid' | 'wasm' | null = null;
+  createEffect(() => {
+    const backendMode = appStore.modelBackendMode();
+    if (lastBackendMode === null) {
+      lastBackendMode = backendMode;
+      return;
+    }
+    if (backendMode === lastBackendMode) return;
+
+    if (backendMode.startsWith('webgpu')) {
+      if (appStore.encoderQuant() !== 'fp32') appStore.setEncoderQuant('fp32');
+      if (appStore.decoderQuant() !== 'int8') appStore.setDecoderQuant('int8');
+    } else {
+      if (appStore.encoderQuant() !== 'int8') appStore.setEncoderQuant('int8');
+      if (appStore.decoderQuant() !== 'int8') appStore.setDecoderQuant('int8');
+    }
+    lastBackendMode = backendMode;
+  });
+
   let dragStart = { x: 0, y: 0 };
   let posStart = { x: 0, y: 0 };
 
@@ -364,9 +401,14 @@ const App: Component = () => {
         v4InferenceIntervalMs: appStore.v4InferenceIntervalMs(),
         v4SilenceFlushSec: appStore.v4SilenceFlushSec(),
         streamingWindow: appStore.streamingWindow(),
+        frameStride: appStore.frameStride(),
+        wasmThreads: appStore.wasmThreads(),
       },
       model: {
         selectedModelId: appStore.selectedModelId(),
+        backend: appStore.modelBackendMode(),
+        encoderQuant: appStore.encoderQuant(),
+        decoderQuant: appStore.decoderQuant(),
       },
       audio: {
         selectedDeviceId,
@@ -425,6 +467,7 @@ const App: Component = () => {
       appStore.setModelProgress(p.progress);
       appStore.setModelMessage(p.message || '');
       if (p.file) appStore.setModelFile(p.file);
+      if (p.backend) appStore.setBackend(p.backend);
     };
 
     workerClient.onModelStateChange = (s) => {
@@ -642,6 +685,7 @@ const App: Component = () => {
         features: features.features,
         T: features.T,
         melBins: features.melBins,
+        frameStride: appStore.frameStride(),
         timeOffset,
         endTime: window.endFrame / 16000,
         segmentId: `v4_${Date.now()}`,
@@ -1040,11 +1084,20 @@ const App: Component = () => {
 
   const loadSelectedModel = async () => {
     if (!workerClient) return;
-    if (appStore.modelState() === 'ready') return;
     if (appStore.modelState() === 'loading') return;
+    if (appStore.recordingState() === 'recording') {
+      console.warn('[App] Model reload blocked while recording is active');
+      return;
+    }
     setShowContextPanel(true);
     try {
-      await workerClient.initModel(appStore.selectedModelId());
+      await workerClient.initModel({
+        modelId: appStore.selectedModelId(),
+        cpuThreads: appStore.wasmThreads(),
+        backend: appStore.modelBackendMode(),
+        encoderQuant: appStore.encoderQuant(),
+        decoderQuant: appStore.decoderQuant(),
+      });
     } catch (e) {
       console.error('Failed to load model:', e);
       appStore.setModelState('error');
@@ -1078,7 +1131,10 @@ const App: Component = () => {
     if (!workerClient) return;
     setShowContextPanel(true);
     try {
-      await workerClient.initLocalModel(files);
+      await workerClient.initLocalModel(files, {
+        cpuThreads: appStore.wasmThreads(),
+        backend: appStore.modelBackendMode(),
+      });
     } catch (e) {
       console.error('Failed to load local model:', e);
     }
diff --git a/src/components/SettingsPanel.tsx b/src/components/SettingsPanel.tsx
index c4cd1ea..72e00f9 100644
--- a/src/components/SettingsPanel.tsx
+++ b/src/components/SettingsPanel.tsx
@@ -2,6 +2,7 @@ import { Component, For, Show } from 'solid-js';
 import { appStore } from '../stores/appStore';
 import { getModelDisplayName, MODELS } from './ModelLoadingOverlay';
 import type { AudioEngine } from '../lib/audio/types';
+import { getMaxHardwareThreads } from '../utils/hardwareThreads';
 
 const formatInterval = (ms: number) => {
   if (ms >= 1000) return `${(ms / 1000).toFixed(1)}s`;
@@ -34,6 +35,7 @@ export interface SettingsContentProps {
 export const SettingsContent: Component<SettingsContentProps> = (props) => {
   const isV4 = () => appStore.transcriptionMode() === 'v4-utterance';
   const isV3 = () => appStore.transcriptionMode() === 'v3-streaming';
+  const maxWasmThreads = () => getMaxHardwareThreads();
 
   const expandUp = () => props.expandUp?.() ?? false;
   const section = () => props.section ?? 'full';
@@ -65,11 +67,11 @@ export const SettingsContent: Component<SettingsContentProps> = (props) => {
             <button
               type="button"
               onClick={props.onLoadModel}
-              disabled={appStore.modelState() === 'ready' || appStore.modelState() === 'loading'}
+              disabled={appStore.modelState() === 'loading'}
               class="flex items-center gap-1.5 px-3 py-1.5 text-sm font-medium text-[var(--color-earthy-muted-green)] hover:bg-[var(--color-earthy-sage)]/20 transition-colors disabled:opacity-50 disabled:cursor-not-allowed shrink-0"
             >
               <span class="material-symbols-outlined text-lg">power_settings_new</span>
-              {appStore.modelState() === 'ready' ? 'Loaded' : appStore.modelState() === 'loading' ? '...' : 'Load'}
+              {appStore.modelState() === 'ready' ? 'Reload' : appStore.modelState() === 'loading' ? '...' : 'Load'}
             </button>
             <Show when={props.onLocalLoad}>
               <label class="flex items-center gap-1.5 px-3 py-1.5 text-sm font-medium text-[var(--color-earthy-soft-brown)] hover:bg-[var(--color-earthy-sage)]/20 transition-colors cursor-pointer shrink-0">
@@ -92,6 +94,59 @@ export const SettingsContent: Component<SettingsContentProps> = (props) => {
           <p class="text-xs text-[var(--color-earthy-soft-brown)]">
             {appStore.modelState() === 'ready' ? getModelDisplayName(appStore.selectedModelId()) : appStore.modelState()}
           </p>
+          <div class="grid grid-cols-2 gap-x-4 gap-y-3 pt-1">
+            <div class="space-y-1">
+              <span class="text-[10px] font-bold uppercase tracking-widest text-[var(--color-earthy-soft-brown)]">Backend</span>
+              <select
+                class="w-full text-sm bg-transparent border-b border-[var(--color-earthy-sage)]/40 px-0 py-1.5 text-[var(--color-earthy-dark-brown)] focus:outline-none focus:border-[var(--color-earthy-muted-green)]"
+                value={appStore.modelBackendMode()}
+                onInput={(e) => appStore.setModelBackendMode((e.target as HTMLSelectElement).value as 'webgpu-hybrid' | 'wasm')}
+                disabled={appStore.modelState() === 'loading'}
+              >
+                <option value="webgpu-hybrid">WebGPU</option>
+                <option value="wasm">WASM</option>
+              </select>
+            </div>
+            <div class="space-y-1">
+              <span class="text-[10px] font-bold uppercase tracking-widest text-[var(--color-earthy-soft-brown)]">Stride</span>
+              <input
+                type="number"
+                min="1"
+                max="4"
+                step="1"
+                value={appStore.frameStride()}
+                onInput={(e) => {
+                  const next = Number((e.target as HTMLInputElement).value);
+                  if (Number.isFinite(next)) appStore.setFrameStride(Math.max(1, Math.min(4, Math.round(next))));
+                }}
+                class="w-full text-sm bg-transparent border-b border-[var(--color-earthy-sage)]/40 px-0 py-1.5 text-[var(--color-earthy-dark-brown)] focus:outline-none focus:border-[var(--color-earthy-muted-green)]"
+              />
+            </div>
+            <div class="space-y-1">
+              <span class="text-[10px] font-bold uppercase tracking-widest text-[var(--color-earthy-soft-brown)]">Encoder</span>
+              <select
+                class="w-full text-sm bg-transparent border-b border-[var(--color-earthy-sage)]/40 px-0 py-1.5 text-[var(--color-earthy-dark-brown)] focus:outline-none focus:border-[var(--color-earthy-muted-green)]"
+                value={appStore.encoderQuant()}
+                onInput={(e) => appStore.setEncoderQuant((e.target as HTMLSelectElement).value as 'int8' | 'fp32')}
+                disabled={appStore.modelState() === 'loading'}
+              >
+                <option value="fp32">fp32</option>
+                <option value="int8">int8</option>
+              </select>
+            </div>
+            <div class="space-y-1">
+              <span class="text-[10px] font-bold uppercase tracking-widest text-[var(--color-earthy-soft-brown)]">Decoder</span>
+              <select
+                class="w-full text-sm bg-transparent border-b border-[var(--color-earthy-sage)]/40 px-0 py-1.5 text-[var(--color-earthy-dark-brown)] focus:outline-none focus:border-[var(--color-earthy-muted-green)]"
+                value={appStore.decoderQuant()}
+                onInput={(e) => appStore.setDecoderQuant((e.target as HTMLSelectElement).value as 'int8' | 'fp32')}
+                disabled={appStore.modelState() === 'loading'}
+              >
+                <option value="int8">int8</option>
+                <option value="fp32">fp32</option>
+              </select>
+            </div>
+          </div>
           <Show when={appStore.modelState() === 'loading'}>
             <div class="space-y-1">
               <div class="flex justify-between text-xs">
@@ -134,6 +189,26 @@ export const SettingsContent: Component<SettingsContentProps> = (props) => {
 
         <Show when={showSliders()}>
           <section class="grid grid-cols-2 gap-x-4 gap-y-3">
+          <div class="space-y-1.5 min-w-0">
+            <div class="flex justify-between items-center gap-2">
+              <span class="text-[10px] font-bold uppercase tracking-widest text-[var(--color-earthy-soft-brown)]">WASM threads</span>
+              <span class="text-sm text-[var(--color-earthy-dark-brown)] tabular-nums shrink-0">{appStore.wasmThreads()} / {maxWasmThreads()}</span>
+            </div>
+            <input
+              type="range"
+              min="1"
+              max={maxWasmThreads()}
+              step="1"
+              value={Math.min(appStore.wasmThreads(), maxWasmThreads())}
+              onInput={(e) => {
+                const next = parseInt(e.currentTarget.value, 10);
+                appStore.setWasmThreads(Math.max(1, Math.min(maxWasmThreads(), next)));
+              }}
+              class="debug-slider w-full h-2 rounded-full appearance-none cursor-pointer bg-[var(--color-earthy-sage)]/30"
+            />
+            <div class="text-[9px] text-[var(--color-earthy-soft-brown)]">Applied on next model load/reload.</div>
+          </div>
+
           <div class="space-y-1.5 min-w-0">
             <div class="flex justify-between items-center gap-2">
               <span class="text-[10px] font-bold uppercase tracking-widest text-[var(--color-earthy-soft-brown)]">Energy threshold</span>
diff --git a/src/lib/transcription/ModelManager.ts b/src/lib/transcription/ModelManager.ts
index b9875f9..77efcb5 100644
--- a/src/lib/transcription/ModelManager.ts
+++ b/src/lib/transcription/ModelManager.ts
@@ -9,9 +9,10 @@
 import type {
   ModelState,
   BackendType,
-  ModelConfig,
   ModelProgress,
-  ModelManagerCallbacks
+  ModelManagerCallbacks,
+  ModelBackendMode,
+  QuantizationMode,
 } from './types';
 
 // Default model configuration (Parakeet TDT 0.6B)
@@ -71,8 +72,18 @@ export class ModelManager {
   /**
    * Load the model with WebGPU/WASM fallback
    */
-  async loadModel(config: { modelId?: string } = {}): Promise<void> {
+  async loadModel(config: {
+    modelId?: string;
+    cpuThreads?: number;
+    backend?: ModelBackendMode;
+    encoderQuant?: QuantizationMode;
+    decoderQuant?: QuantizationMode;
+  } = {}): Promise<void> {
     const modelId = config.modelId || DEFAULT_MODEL_ID;
+    const cpuThreads = this._normalizeCpuThreads(config.cpuThreads);
+    const requestedBackend = this._normalizeRequestedBackend(config.backend);
+    const encoderQuant = this._normalizeQuantization(config.encoderQuant, 'int8');
+    const decoderQuant = this._normalizeQuantization(config.decoderQuant, 'int8');
 
     this._setState('loading');
 
@@ -83,14 +94,15 @@ export class ModelManager {
     });
 
     try {
-      // 1. Detect WebGPU support
-      const hasWebGPU = await this._detectWebGPU();
-      this._backend = hasWebGPU ? 'webgpu' : 'wasm';
+      const { effectiveBackend, runtimeBackend } = await this._resolveBackend(requestedBackend);
+      this._backend = runtimeBackend;
+      const resolvedEncoderQuant = this._resolveEncoderQuantForBackend(runtimeBackend, encoderQuant, modelId);
 
       this._setProgress({
         stage: 'backend',
         progress: 10,
-        message: `Using ${this._backend.toUpperCase()} backend`
+        message: `Using ${effectiveBackend.toUpperCase()} backend`,
+        backend: this._backend,
       });
 
       // 2. Import parakeet.js dynamically
@@ -101,12 +113,13 @@ export class ModelManager {
 
       const createModelFromAssets = async (assets: ResolvedModelAssets): Promise<any> => {
         const preprocessorBackend = assets.preprocessorBackend || 'js';
-        console.log(`[ModelManager] Loading model with backend=${this._backend}, preprocessorBackend=${preprocessorBackend}`);
+        console.log(`[ModelManager] Loading model with backend=${effectiveBackend}, preprocessorBackend=${preprocessorBackend}, encoderQuant=${resolvedEncoderQuant}, decoderQuant=${decoderQuant}, cpuThreads=${cpuThreads ?? 'default'}`);
         return ParakeetModel.fromUrls({
           ...assets.urls,
           filenames: assets.filenames,
           preprocessorBackend,
-          backend: this._backend === 'webgpu' ? 'webgpu-hybrid' : 'wasm',
+          backend: runtimeBackend,
+          cpuThreads,
           verbose: false,
         });
       };
@@ -119,7 +132,9 @@ export class ModelManager {
       });
 
       const modelAssets = await getParakeetModel(modelId, {
-        backend: this._backend,
+        backend: runtimeBackend,
+        encoderQuant: resolvedEncoderQuant,
+        decoderQuant,
         preprocessorBackend: 'js', // Use pure JS mel — faster, no ONNX download needed
         progress: (p: any) => {
           // Map parakeet.js progress to our UI
@@ -158,7 +173,9 @@ export class ModelManager {
 
         const directAssets = this._buildDirectModelAssets(
           modelId,
-          this._backend,
+          runtimeBackend,
+          resolvedEncoderQuant,
+          decoderQuant,
           getModelConfig as ModelConfigResolver
         );
 
@@ -198,7 +215,12 @@ export class ModelManager {
   /**
    * Side-load model from local files
    */
-  async loadLocalModel(files: FileList): Promise<void> {
+  async loadLocalModel(
+    files: FileList | File[],
+    options: { cpuThreads?: number; backend?: ModelBackendMode } = {}
+  ): Promise<void> {
+    const cpuThreads = this._normalizeCpuThreads(options.cpuThreads);
+    const requestedBackend = this._normalizeRequestedBackend(options.backend);
     this._setState('loading');
     this._setProgress({
       stage: 'init',
@@ -229,8 +251,15 @@ export class ModelManager {
         throw new Error(`Missing required files: ${missing.join(', ')}`);
       }
 
-      const hasWebGPU = await this._detectWebGPU();
-      this._backend = hasWebGPU ? 'webgpu' : 'wasm';
+      const { effectiveBackend, runtimeBackend } = await this._resolveBackend(requestedBackend);
+      this._backend = runtimeBackend;
+
+      this._setProgress({
+        stage: 'backend',
+        progress: 10,
+        message: `Using ${effectiveBackend.toUpperCase()} backend`,
+        backend: this._backend,
+      });
 
       this._setProgress({ stage: 'import', progress: 20, message: 'Initialising parakeet.js...' });
       const { ParakeetModel } = await import(
@@ -259,7 +288,8 @@ export class ModelManager {
           decoder: assets.decoder.name
         },
         preprocessorBackend: useOnnxPreprocessor ? 'onnx' : 'js',
-        backend: this._backend === 'webgpu' ? 'webgpu-hybrid' : 'wasm',
+        backend: runtimeBackend,
+        cpuThreads,
         verbose: false,
       });
 
@@ -325,6 +355,36 @@ export class ModelManager {
     this._callbacks.onProgress?.(progress);
   }
 
+  private _normalizeCpuThreads(value?: number): number | undefined {
+    if (!Number.isFinite(value)) return undefined;
+    const maxThreads = typeof navigator !== 'undefined' && Number.isFinite(navigator.hardwareConcurrency)
+      ? Math.max(1, Math.floor(navigator.hardwareConcurrency))
+      : 16;
+    return Math.min(maxThreads, Math.max(1, Math.floor(value as number)));
+  }
+
+  private _normalizeRequestedBackend(value?: ModelBackendMode): ModelBackendMode {
+    return value === 'wasm' ? 'wasm' : 'webgpu-hybrid';
+  }
+
+  private _normalizeQuantization(value: QuantizationMode | undefined, fallback: QuantizationMode): QuantizationMode {
+    return value === 'fp32' || value === 'int8' ? value : fallback;
+  }
+
+  private async _resolveBackend(requestedBackend: ModelBackendMode): Promise<{ effectiveBackend: ModelBackendMode; runtimeBackend: BackendType }> {
+    if (requestedBackend === 'wasm') {
+      return { effectiveBackend: 'wasm', runtimeBackend: 'wasm' };
+    }
+
+    const hasWebGPU = await this._detectWebGPU();
+    if (!hasWebGPU) {
+      console.warn('[ModelManager] Requested WebGPU backend is not available; falling back to WASM');
+      return { effectiveBackend: 'wasm', runtimeBackend: 'wasm' };
+    }
+
+    return { effectiveBackend: 'webgpu-hybrid', runtimeBackend: 'webgpu' };
+  }
+
   /**
    * Clear cached model data
    */
@@ -348,6 +408,20 @@ export class ModelManager {
     this._progress = 0;
   }
 
+  private _resolveEncoderQuantForBackend(
+    backend: BackendType,
+    encoderQuant: QuantizationMode,
+    modelId: string
+  ): QuantizationMode {
+    if (backend === 'webgpu' && encoderQuant === 'int8') {
+      console.warn(
+        `[ModelManager] Encoder quantization overridden for ${modelId}: requested=${encoderQuant}, effective=fp32 (WebGPU encoder requires fp32)`
+      );
+      return 'fp32';
+    }
+    return encoderQuant;
+  }
+
   private _isRecoverableFetchError(error: unknown): boolean {
     if (!(error instanceof Error)) {
       return false;
@@ -359,12 +433,14 @@ export class ModelManager {
   private _buildDirectModelAssets(
     modelId: string,
     backend: BackendType,
+    encoderQuant: QuantizationMode,
+    decoderQuant: QuantizationMode,
     getModelConfig: ModelConfigResolver
   ): ResolvedModelAssets {
     const repoId = getModelConfig?.(modelId)?.repoId || modelId;
     const revision = 'main';
-    const encoderName = backend === 'webgpu' ? 'encoder-model.onnx' : 'encoder-model.int8.onnx';
-    const decoderName = 'decoder_joint-model.int8.onnx';
+    const encoderName = encoderQuant === 'int8' ? 'encoder-model.int8.onnx' : 'encoder-model.onnx';
+    const decoderName = decoderQuant === 'int8' ? 'decoder_joint-model.int8.onnx' : 'decoder_joint-model.onnx';
     const baseUrl = `https://huggingface.co/${repoId}/resolve/${revision}`;
 
     return {
diff --git a/src/lib/transcription/TranscriptionWorkerClient.ts b/src/lib/transcription/TranscriptionWorkerClient.ts
index 1a88f34..2da9ded 100644
--- a/src/lib/transcription/TranscriptionWorkerClient.ts
+++ b/src/lib/transcription/TranscriptionWorkerClient.ts
@@ -7,7 +7,14 @@
  * Supports both v3 (token-stream) and v4 (utterance-based) pipelines.
  */
 
-import { ModelState, ModelProgress, TranscriptionResult, TranscriptionServiceConfig } from './types';
+import type {
+    ModelState,
+    ModelProgress,
+    TranscriptionResult,
+    TranscriptionServiceConfig,
+    ModelBackendMode,
+    QuantizationMode,
+} from './types';
 import { TokenStreamResult, TokenStreamConfig } from './TokenStreamTranscriber';
 import type { MergerResult, UtteranceBasedMergerConfig } from './UtteranceBasedMerger';
 
@@ -40,10 +47,23 @@ export interface V4IncrementalCache {
     prefixSeconds: number;
 }
 
+export interface InitModelOptions {
+    modelId?: string;
+    cpuThreads?: number;
+    backend?: ModelBackendMode;
+    encoderQuant?: QuantizationMode;
+    decoderQuant?: QuantizationMode;
+}
+
+export interface InitLocalModelOptions {
+    cpuThreads?: number;
+    backend?: ModelBackendMode;
+}
+
 /** Valid message types for the worker bridge */
 export interface WorkerMessageMap {
-    INIT_MODEL: { payload: { modelId?: string }; response: void };
-    LOAD_LOCAL_MODEL: { payload: File[]; response: void };
+    INIT_MODEL: { payload: InitModelOptions; response: void };
+    LOAD_LOCAL_MODEL: { payload: { files: File[]; cpuThreads?: number; backend?: ModelBackendMode }; response: void };
     INIT_SERVICE: { payload: { config: TranscriptionServiceConfig }; response: void };
     INIT_V3_SERVICE: { payload: { config: TokenStreamConfig }; response: void };
     PROCESS_CHUNK: { payload: Float32Array; response: TranscriptionResult };
@@ -67,6 +87,7 @@ export interface WorkerMessageMap {
             features: Float32Array;
             T: number;
             melBins: number;
+            frameStride?: number;
             timeOffset?: number;
             endTime?: number;
             segmentId?: string;
@@ -154,13 +175,25 @@ export class TranscriptionWorkerClient {
         return transferOwnership === false ? [] : [buffer as ArrayBuffer];
     }
 
+    private normalizeCpuThreads(cpuThreads?: number): number | undefined {
+        if (!Number.isFinite(cpuThreads)) return undefined;
+        return Math.max(1, Math.floor(cpuThreads as number));
+    }
+
     // API Methods
-    async initModel(modelId?: string): Promise<void> {
-        return this.sendRequest('INIT_MODEL', { modelId });
+    async initModel(options: InitModelOptions = {}): Promise<void> {
+        return this.sendRequest('INIT_MODEL', {
+            ...options,
+            cpuThreads: this.normalizeCpuThreads(options.cpuThreads),
+        });
     }
 
-    async initLocalModel(files: FileList | File[]): Promise<void> {
-        return this.sendRequest('LOAD_LOCAL_MODEL', Array.from(files));
+    async initLocalModel(files: FileList | File[], options: InitLocalModelOptions = {}): Promise<void> {
+        return this.sendRequest('LOAD_LOCAL_MODEL', {
+            files: Array.from(files),
+            cpuThreads: this.normalizeCpuThreads(options.cpuThreads),
+            backend: options.backend,
+        });
     }
 
     async initService(config: TranscriptionServiceConfig): Promise<void> {
@@ -241,6 +274,7 @@ export class TranscriptionWorkerClient {
         features: Float32Array;
         T: number;
         melBins: number;
+        frameStride?: number;
         timeOffset?: number;
         endTime?: number;
         segmentId?: string;
diff --git a/src/lib/transcription/transcription.worker.ts b/src/lib/transcription/transcription.worker.ts
index 9310c47..6c49065 100644
--- a/src/lib/transcription/transcription.worker.ts
+++ b/src/lib/transcription/transcription.worker.ts
@@ -70,8 +70,10 @@ self.onmessage = async (e: MessageEvent) => {
                 if (!modelManager) {
                     modelManager = new ModelManager(modelCallbacks);
                 }
-                // FileList can't be easily sent, but File can be part of Transferable or just sent as is
-                await modelManager.loadLocalModel(payload);
+                await modelManager.loadLocalModel(payload.files, {
+                    cpuThreads: payload.cpuThreads,
+                    backend: payload.backend,
+                });
                 postMessage({ type: 'INIT_MODEL_DONE', id });
                 break;
 
@@ -224,6 +226,7 @@ self.onmessage = async (e: MessageEvent) => {
                         T: payload.T,
                         melBins: payload.melBins,
                     },
+                    frameStride: payload.frameStride ?? 1,
                     returnTimestamps: true,
                     enableProfiling: false,
                     timeOffset: payload.timeOffset || 0,
diff --git a/src/lib/transcription/types.ts b/src/lib/transcription/types.ts
index d337072..02d66f1 100644
--- a/src/lib/transcription/types.ts
+++ b/src/lib/transcription/types.ts
@@ -6,13 +6,23 @@
 export type ModelState = 'unloaded' | 'loading' | 'ready' | 'error';
 /** Inference backend name. */
 export type BackendType = 'webgpu' | 'wasm';
+/** User-selectable model backend mode. */
+export type ModelBackendMode = 'webgpu-hybrid' | 'wasm';
+/** ONNX quantization option for encoder/decoder assets. */
+export type QuantizationMode = 'int8' | 'fp32';
 
 /** Model selection/configuration payload. */
 export interface ModelConfig {
   /** Selected model identifier or key. */
   modelId: string;
   /** Optional backend override. */
-  backend?: BackendType;
+  backend?: ModelBackendMode;
+  /** Optional ORT WASM thread count for CPU-side kernels/decoder. */
+  cpuThreads?: number;
+  /** Optional encoder quantization override. */
+  encoderQuant?: QuantizationMode;
+  /** Optional decoder quantization override. */
+  decoderQuant?: QuantizationMode;
 }
 
 
@@ -26,6 +36,8 @@ export interface ModelProgress {
   message?: string;
   /** Optional active filename. */
   file?: string;
+  /** Optional resolved runtime backend. */
+  backend?: BackendType;
 }
 
 /** Word-level transcription token with optional confidence. */
diff --git a/src/stores/appStore.ts b/src/stores/appStore.ts
index fe801d0..aef8217 100644
--- a/src/stores/appStore.ts
+++ b/src/stores/appStore.ts
@@ -8,6 +8,7 @@
 import { createSignal, createMemo, createRoot, onCleanup } from 'solid-js';
 import type { RecordingState, ModelState, BackendType } from '../types';
 import type { V4SentenceEntry } from '../lib/transcription/TranscriptionWorkerClient';
+import { getMaxHardwareThreads } from '../utils/hardwareThreads';
 
 export interface DebugToken {
   /** Stable token identifier used by debug token rendering. */
@@ -68,6 +69,11 @@ export interface V4MergerStats {
 
 /** Creates the root application store with state signals, setters, and UI actions. */
 export function createAppStore() {
+  const hardwareThreads = getMaxHardwareThreads();
+  const defaultWasmThreads = hardwareThreads <= 2
+    ? 1
+    : Math.min(4, Math.max(2, hardwareThreads - 2));
+
   // Recording state
   const [recordingState, setRecordingState] = createSignal<RecordingState>('idle');
   const [sessionDuration, setSessionDuration] = createSignal(0);
@@ -79,6 +85,9 @@ export function createAppStore() {
   // Model state
   const [modelState, setModelState] = createSignal<ModelState>('unloaded');
   const [selectedModelId, setSelectedModelId] = createSignal('parakeet-tdt-0.6b-v2');
+  const [modelBackendMode, setModelBackendMode] = createSignal<'webgpu-hybrid' | 'wasm'>('webgpu-hybrid');
+  const [encoderQuant, setEncoderQuant] = createSignal<'int8' | 'fp32'>('fp32');
+  const [decoderQuant, setDecoderQuant] = createSignal<'int8' | 'fp32'>('int8');
   const [modelProgress, setModelProgress] = createSignal(0);
   const [modelMessage, setModelMessage] = createSignal('');
   const [modelFile, setModelFile] = createSignal('');
@@ -155,6 +164,7 @@ export function createAppStore() {
   const [energyThreshold, setEnergyThreshold] = createSignal(0.08);
   // Decoder frame stride: 1 = full precision, 2 = halves decoder steps (faster, coarser timestamps)
   const [frameStride, setFrameStride] = createSignal(1);
+  const [wasmThreads, setWasmThreads] = createSignal(defaultWasmThreads);
 
   // v4 Pipeline config
   const [v4InferenceIntervalMs, setV4InferenceIntervalMs] = createSignal(480); // Transcription tick frequency in ms (320-8000)
@@ -306,6 +316,9 @@ export function createAppStore() {
     sessionDuration,
     modelState,
     selectedModelId,
+    modelBackendMode,
+    encoderQuant,
+    decoderQuant,
     modelProgress,
     modelMessage,
     modelFile,
@@ -333,6 +346,7 @@ export function createAppStore() {
     triggerInterval,
     energyThreshold,
     frameStride,
+    wasmThreads,
     // v4 config
     v4InferenceIntervalMs,
     v4SilenceFlushSec,
@@ -354,6 +368,9 @@ export function createAppStore() {
     setSelectedDeviceId,
     setModelState,
     setSelectedModelId,
+    setModelBackendMode,
+    setEncoderQuant,
+    setDecoderQuant,
     setModelProgress,
     setModelMessage,
     setModelFile,
@@ -377,6 +394,7 @@ export function createAppStore() {
     setTriggerInterval,
     setEnergyThreshold,
     setFrameStride,
+    setWasmThreads,
     // UI setters
     setShowDebugPanel,
     // v4 setters
diff --git a/src/utils/hardwareThreads.ts b/src/utils/hardwareThreads.ts
new file mode 100644
index 0000000..3fe6ab4
--- /dev/null
+++ b/src/utils/hardwareThreads.ts
@@ -0,0 +1,10 @@
+export const getMaxHardwareThreads = (): number => {
+  if (typeof navigator === 'undefined' || !Number.isFinite(navigator.hardwareConcurrency)) {
+    return 4;
+  }
+  return Math.max(1, Math.floor(navigator.hardwareConcurrency));
+};
+
+export const clampWasmThreadsForDevice = (value: number): number =>
+  Math.max(1, Math.min(getMaxHardwareThreads(), Math.floor(value)));
+
diff --git a/src/utils/settingsStorage.test.ts b/src/utils/settingsStorage.test.ts
index db79a4d..8132874 100644
--- a/src/utils/settingsStorage.test.ts
+++ b/src/utils/settingsStorage.test.ts
@@ -23,8 +23,15 @@ describe('settingsStorage', () => {
         v4InferenceIntervalMs: 9000,
         v4SilenceFlushSec: -4,
         streamingWindow: 1.2,
+        frameStride: 99,
+        wasmThreads: 999,
+      },
+      model: {
+        selectedModelId: 'parakeet-tdt-0.6b-v2',
+        backend: 'invalid',
+        encoderQuant: 'fp32',
+        decoderQuant: 'int8',
       },
-      model: { selectedModelId: 'parakeet-tdt-0.6b-v2' },
       audio: { selectedDeviceId: 'device-1', selectedDeviceLabel: 'Mic 1' },
       ui: {
         widgetPosition: { x: 12, y: 18 },
@@ -40,7 +47,12 @@ describe('settingsStorage', () => {
     expect(loaded.general?.v4InferenceIntervalMs).toBe(8000);
     expect(loaded.general?.v4SilenceFlushSec).toBe(0.3);
     expect(loaded.general?.streamingWindow).toBe(2);
+    expect(loaded.general?.frameStride).toBe(4);
+    expect(loaded.general?.wasmThreads).toBe(64);
     expect(loaded.model?.selectedModelId).toBe('parakeet-tdt-0.6b-v2');
+    expect(loaded.model?.backend).toBeUndefined();
+    expect(loaded.model?.encoderQuant).toBe('fp32');
+    expect(loaded.model?.decoderQuant).toBe('int8');
     expect(loaded.audio?.selectedDeviceId).toBe('device-1');
     expect(loaded.ui?.widgetPosition).toEqual({ x: 12, y: 18 });
     expect(loaded.ui?.debugPanel?.visible).toBe(true);
diff --git a/src/utils/settingsStorage.ts b/src/utils/settingsStorage.ts
index 30be532..a74a5d6 100644
--- a/src/utils/settingsStorage.ts
+++ b/src/utils/settingsStorage.ts
@@ -19,9 +19,14 @@ export interface PersistedSettings {
     v4InferenceIntervalMs?: number;
     v4SilenceFlushSec?: number;
     streamingWindow?: number;
+    frameStride?: number;
+    wasmThreads?: number;
   };
   model?: {
     selectedModelId?: string;
+    backend?: 'webgpu-hybrid' | 'wasm';
+    encoderQuant?: 'int8' | 'fp32';
+    decoderQuant?: 'int8' | 'fp32';
   };
   audio?: {
     selectedDeviceId?: string;
@@ -96,6 +101,16 @@ const readTranscriptTab = (value: unknown): StoredTranscriptTab | undefined => {
   return undefined;
 };
 
+const readModelBackend = (value: unknown): 'webgpu-hybrid' | 'wasm' | undefined => {
+  if (value === 'webgpu-hybrid' || value === 'wasm') return value;
+  return undefined;
+};
+
+const readQuantization = (value: unknown): 'int8' | 'fp32' | undefined => {
+  if (value === 'int8' || value === 'fp32') return value;
+  return undefined;
+};
+
 const sanitizeSettings = (value: unknown): PersistedSettings => {
   if (!isRecord(value)) return {};
 
@@ -109,6 +124,8 @@ const sanitizeSettings = (value: unknown): PersistedSettings => {
     nextGeneral.v4InferenceIntervalMs = readIntegerInRange(general.v4InferenceIntervalMs, 160, 8000);
     nextGeneral.v4SilenceFlushSec = readNumberInRange(general.v4SilenceFlushSec, 0.3, 5.0);
     nextGeneral.streamingWindow = readNumberInRange(general.streamingWindow, 2.0, 15.0);
+    nextGeneral.frameStride = readIntegerInRange(general.frameStride, 1, 4);
+    nextGeneral.wasmThreads = readIntegerInRange(general.wasmThreads, 1, 64);
     if (Object.values(nextGeneral).some((v) => v !== undefined)) {
       settings.general = nextGeneral;
     }
@@ -117,8 +134,15 @@ const sanitizeSettings = (value: unknown): PersistedSettings => {
   const model = isRecord(value.model) ? value.model : null;
   if (model) {
     const selectedModelId = readString(model.selectedModelId);
-    if (selectedModelId) {
-      settings.model = { selectedModelId };
+    const backend = readModelBackend(model.backend);
+    const encoderQuant = readQuantization(model.encoderQuant);
+    const decoderQuant = readQuantization(model.decoderQuant);
+    if (selectedModelId || backend || encoderQuant || decoderQuant) {
+      settings.model = {};
+      if (selectedModelId) settings.model.selectedModelId = selectedModelId;
+      if (backend) settings.model.backend = backend;
+      if (encoderQuant) settings.model.encoderQuant = encoderQuant;
+      if (decoderQuant) settings.model.decoderQuant = decoderQuant;
     }
   }
 
diff --git a/vite.config.js b/vite.config.js
index 39db209..e0b2c06 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -83,8 +83,8 @@ export default defineConfig({
     solidPlugin()
   ],
   server: {
-    port: 3100,
-    host: '0.0.0.0',
+    port: 5173,
+    host: process.env.DEV_HOST || '0.0.0.0',
     headers: {
       'Cross-Origin-Embedder-Policy': 'require-corp',
       'Cross-Origin-Opener-Policy': 'same-origin',