fix(theming): Conitionally disable blur filter for performance

Signed-off-by: Ferdinand Thiessen <[email protected]>

apps/theming/lib/Themes/DefaultTheme.php

@@ -25,6 +25,7 @@
  */
 namespace OCA\Theming\Themes;
 
+use OC\AppFramework\Http\Request;
 use OCA\Theming\ImageManager;
 use OCA\Theming\ITheme;
 use OCA\Theming\Service\BackgroundService;
@@ -33,41 +34,27 @@
 use OCP\App\IAppManager;
 use OCP\IConfig;
 use OCP\IL10N;
+use OCP\IRequest;
 use OCP\IURLGenerator;
 use OCP\IUserSession;
 
 class DefaultTheme implements ITheme {
 	use CommonThemeTrait;
 
-	public Util $util;
-	public ThemingDefaults $themingDefaults;
-	public IUserSession $userSession;
-	public IURLGenerator $urlGenerator;
-	public ImageManager $imageManager;
-	public IConfig $config;
-	public IL10N $l;
-	public IAppManager $appManager;
-
 	public string $defaultPrimaryColor;
 	public string $primaryColor;
 
-	public function __construct(Util $util,
-		ThemingDefaults $themingDefaults,
-		IUserSession $userSession,
-		IURLGenerator $urlGenerator,
-		ImageManager $imageManager,
-		IConfig $config,
-		IL10N $l,
-		IAppManager $appManager) {
-		$this->util = $util;
-		$this->themingDefaults = $themingDefaults;
-		$this->userSession = $userSession;
-		$this->urlGenerator = $urlGenerator;
-		$this->imageManager = $imageManager;
-		$this->config = $config;
-		$this->l = $l;
-		$this->appManager = $appManager;
-
+	public function __construct(
+		public Util $util,
+		public ThemingDefaults $themingDefaults,
+		public IUserSession $userSession,
+		public IURLGenerator $urlGenerator,
+		public ImageManager $imageManager,
+		public IConfig $config,
+		public IL10N $l,
+		public IAppManager $appManager,
+		private ?IRequest $request,
+	) {
 		$this->defaultPrimaryColor = $this->themingDefaults->getDefaultColorPrimary();
 		$this->primaryColor = $this->themingDefaults->getColorPrimary();
 
@@ -120,12 +107,29 @@ public function getCSSVariables(): array {
 		$colorSuccess = '#2d7b41';
 		$colorInfo = '#0071ad';
 
+		$user = $this->userSession->getUser();
+		// Chromium based browsers currently (2024) have huge performance issues with blur filters
+		$isChromium = $this->request !== null && $this->request->isUserAgent([Request::USER_AGENT_CHROME, Request::USER_AGENT_MS_EDGE]);
+		// Ignore MacOS because they always have hardware accelartion
+		$isChromium = $isChromium && !$this->request->isUserAgent(['/Macintosh/']);
+		// Allow to force the blur filter
+		$forceEnableBlur = $user === null ? false : $this->config->getUserValue(
+			$user->getUID(),
+			'theming',
+			'force_enable_blur_filter',
+		);
+		$workingBlur = match($forceEnableBlur) {
+			'yes' => true,
+			'no' => false,
+			default => !$isChromium
+		};
+
 		$variables = [
 			'--color-main-background' => $colorMainBackground,
 			'--color-main-background-rgb' => $colorMainBackgroundRGB,
 			'--color-main-background-translucent' => 'rgba(var(--color-main-background-rgb), .97)',
 			'--color-main-background-blur' => 'rgba(var(--color-main-background-rgb), .8)',
-			'--filter-background-blur' => 'blur(25px)',
+			'--filter-background-blur' => $workingBlur ? 'blur(25px)' : 'none',
 
 			// to use like this: background-image: linear-gradient(0, var('--gradient-main-background));
 			'--gradient-main-background' => 'var(--color-main-background) 0%, var(--color-main-background-translucent) 85%, transparent 100%',

apps/theming/tests/Service/ThemesServiceTest.php

@@ -332,6 +332,7 @@ private function initThemes() {
 				$this->config,
 				$l10n,
 				$appManager,
+				null,
 			),
 			'light' => new LightTheme(
 				$util,
@@ -342,6 +343,7 @@ private function initThemes() {
 				$this->config,
 				$l10n,
 				$appManager,
+				null,
 			),
 			'dark' => new DarkTheme(
 				$util,
@@ -352,6 +354,7 @@ private function initThemes() {
 				$this->config,
 				$l10n,
 				$appManager,
+				null,
 			),
 			'light-highcontrast' => new HighContrastTheme(
 				$util,
@@ -362,6 +365,7 @@ private function initThemes() {
 				$this->config,
 				$l10n,
 				$appManager,
+				null,
 			),
 			'dark-highcontrast' => new DarkHighContrastTheme(
 				$util,
@@ -372,6 +376,7 @@ private function initThemes() {
 				$this->config,
 				$l10n,
 				$appManager,
+				null,
 			),
 			'opendyslexic' => new DyslexiaFont(
 				$util,
@@ -382,6 +387,7 @@ private function initThemes() {
 				$this->config,
 				$l10n,
 				$appManager,
+				null,
 			),
 		];
 	}

apps/theming/tests/Themes/DarkHighContrastThemeTest.php

@@ -110,6 +110,7 @@ protected function setUp(): void {
 			$this->config,
 			$this->l10n,
 			$this->appManager,
+			null,
 		);
 
 		parent::setUp();

apps/theming/tests/Themes/DarkThemeTest.php

@@ -107,6 +107,7 @@ protected function setUp(): void {
 			$this->config,
 			$this->l10n,
 			$this->appManager,
+			null,
 		);
 
 		parent::setUp();

apps/theming/tests/Themes/DefaultThemeTest.php

@@ -107,6 +107,7 @@ protected function setUp(): void {
 			$this->config,
 			$this->l10n,
 			$this->appManager,
+			null,
 		);
 
 		parent::setUp();

apps/theming/tests/Themes/DyslexiaFontTest.php

@@ -110,6 +110,7 @@ protected function setUp(): void {
 			$this->config,
 			$this->l10n,
 			$this->appManager,
+			null,
 		);
 
 		parent::setUp();

apps/theming/tests/Themes/HighContrastThemeTest.php

@@ -110,6 +110,7 @@ protected function setUp(): void {
 			$this->config,
 			$this->l10n,
 			$this->appManager,
+			null,
 		);
 
 		parent::setUp();