Skip to content

fix: bring back optimize WebGL through ANGLE on Direct3D [WPB-25918] #21786

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
EnricoSchw wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

fix: bring back optimize WebGL through ANGLE on Direct3D [WPB-25918] #21786

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 8 additions & 3 deletions apps/webapp/src/script/repositories/media/VideoBackgroundEffects.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,15 +47,20 @@ export type BackgroundSource = {
*/
export const DEFAULT_BACKGROUND_EFFECT: BackgroundEffectSelection = {type: 'none'};

export interface BgStrength {
bgBlur: number;
bgBlurRadius: number;
}

/**
* Blur strength values mapped to blur levels.
*
* Values range from 0.0 (no blur) to 1.0 (maximum blur). These are passed
* directly to the background effects controller's blur strength parameter.
*/
export const BLUR_STRENGTHS: Record<BlurLevel, number> = {
low: 0.7,
high: 1.0,
export const BLUR_STRENGTHS: Record<BlurLevel, BgStrength> = {
low: {bgBlur: 0.75, bgBlurRadius: 5},
high: {bgBlur: 1.0, bgBlurRadius: 30},
};

type BuiltinBackgroundLabelKey =
Expand Down
20 changes: 8 additions & 12 deletions apps/webapp/src/script/repositories/media/backgroundEffects/backgroundEffectsController.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ import {
} from 'Repositories/media/backgroundEffects/quality/definitions';
import {QUALITY_TIERS, QualityController} from 'Repositories/media/backgroundEffects/quality/qualityController';
import {backgroundEffectsStore} from 'Repositories/media/useBackgroundEffectsStore';
import {BackgroundSource} from 'Repositories/media/VideoBackgroundEffects';
import {BackgroundSource, BgStrength} from 'Repositories/media/VideoBackgroundEffects';
import {getLogger, Logger} from 'Util/logger';

import {type CapabilityInfo, type EffectMode, type Metrics, Mode} from './backgroundEffectsWorkerTypes';
Expand All @@ -46,7 +46,6 @@ import {runSegmenter, updateSegmenterOptions} from './pipe/segmenter';
// Blur strength (0–1) maps to Gaussian sigma in pixel units for the shader.
// The shader's blur radius is 30 px, so a sigma in the ~10–20 px range gives
// visually useful blur. Multiply by this factor to get from the 0–1 range.
const BLUR_SIGMA_SCALE = 15;
const DEFAULT_FRAME_RATE = 15;
const MAX_WIDTH = 256;
const MAX_HEIGHT = 144;
Expand Down Expand Up @@ -189,17 +188,17 @@ export class BackgroundEffectsController {

public setMode(mode: EffectMode): void {
this.logger.info('Background effects mode', mode);
const renderFlags = modeToRenderFlags(mode, this.options.blurStrength, this.options.bgBlurRadius);
const renderFlags = modeToRenderFlags(mode, this.options.bgBlur, this.options.bgBlurRadius);
this.options = {...this.options, mode, ...renderFlags};
this.pushOptionsUpdate();
}

public setBlurStrength(value: number): void {
public setBlurStrength(value: BgStrength): void {
this.options = {
...this.options,
blurStrength: value,
// Only raise bgBlur when in blur mode; virtual/passthrough use bgBlur=0.
bgBlur: this.options.mode === 'blur' ? blurStrengthToBgBlur(value) : this.options.bgBlur,
bgBlur: this.options.mode === 'blur' ? value.bgBlur : this.options.bgBlur,
bgBlurRadius: value.bgBlurRadius,
};
this.pushOptionsUpdate();
}
Expand Down Expand Up @@ -355,16 +354,14 @@ export class BackgroundEffectsController {
// Module-level pure helpers
// ---------------------------------------------------------------------------

const blurStrengthToBgBlur = (strength: number): number => Math.max(strength * BLUR_SIGMA_SCALE, 1);

const modeToRenderFlags = (
mode: EffectMode,
blurStrength: number,
bgBlur: number,
bgBlurRadius: number,
): Pick<ProcessVideoTrackOptions, 'enabled' | 'bgBlur' | 'bgBlurRadius'> => {
switch (mode) {
case 'blur':
return {enabled: true, bgBlur: blurStrengthToBgBlur(blurStrength), bgBlurRadius};
return {enabled: true, bgBlur, bgBlurRadius};
case 'virtual':
return {enabled: true, bgBlur: 0, bgBlurRadius};
case 'passthrough':
Expand All @@ -384,7 +381,7 @@ const withoutBitmap = (options: ProcessVideoTrackOptions): ProcessVideoTrackOpti
};

const resolveOptions = async (options: ProcessVideoTrackOptions): Promise<ProcessVideoTrackOptions> => {
const renderFlags = modeToRenderFlags(options.mode ?? 'blur', options.blurStrength, options.bgBlurRadius);
const renderFlags = modeToRenderFlags(options.mode ?? 'blur', options.bgBlur, options.bgBlurRadius);
const resolved = {...options, ...renderFlags};

if (resolved.backgroundSource?.media instanceof HTMLImageElement) {
Expand Down Expand Up @@ -421,7 +418,6 @@ const getWorkerOptions = (
modelPath: options.modelPath,
useWorker: options.useWorker,
mode: options.mode,
blurStrength: options.blurStrength,
enabled: options.enabled,
quality: options.quality,
borderSmooth: options.borderSmooth,
Expand Down
2 changes: 0 additions & 2 deletions apps/webapp/src/script/repositories/media/backgroundEffects/pipe/options.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,6 @@ export type ProcessVideoTrackOptions = {

// Virtual background options.
mode?: EffectMode; /** Effect mode ('blur', 'virtual', or 'passthrough'). Default: 'blur'. */
blurStrength: number;
enabled: boolean;
backgroundSource: BackgroundSource | null;

Expand Down Expand Up @@ -86,7 +85,6 @@ export const defaultOpts = {

// Virtual background options.
mode: 'blur',
blurStrength: 0,
enabled: true,
backgroundSource: null,

Expand Down
Loading
Loading