Skip to content

Commit 6443af9

Browse files
angjielichaselatta
authored andcommitted
Auto detect mode to determine which rendering backend to use. (flutter#21852)
1 parent b0a68cd commit 6443af9

File tree

15 files changed

+190
-47
lines changed

15 files changed

+190
-47
lines changed

lib/web_ui/lib/src/engine/canvaskit/initialization.dart

Lines changed: 34 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,40 @@
55
// @dart = 2.10
66
part of engine;
77

8-
/// EXPERIMENTAL: Enable the Skia-based rendering backend.
9-
const bool experimentalUseSkia =
8+
/// A JavaScript entrypoint that allows developer to set rendering backend
9+
/// at runtime before launching the application.
10+
@JS('window.flutterWebRenderer')
11+
external String? get requestedRendererType;
12+
13+
/// Whether to use CanvasKit as the rendering backend.
14+
bool get useCanvasKit =>
15+
_autoDetect ? _detectRenderer() : _useSkia;
16+
17+
/// Returns true if CanvasKit is used.
18+
///
19+
/// Otherwise, returns false.
20+
bool _detectRenderer() {
21+
if (requestedRendererType != null) {
22+
return requestedRendererType! == 'canvaskit';
23+
}
24+
// If requestedRendererType is not specified, use CanvasKit for desktop and
25+
// html for mobile.
26+
return isDesktop;
27+
}
28+
29+
/// Auto detect which rendering backend to use.
30+
///
31+
/// Using flutter tools option "--web-render=auto" would set the value to true.
32+
/// Otherwise, it would be false.
33+
const bool _autoDetect =
34+
bool.fromEnvironment('FLUTTER_WEB_AUTO_DETECT', defaultValue: false);
35+
36+
/// Enable the Skia-based rendering backend.
37+
///
38+
/// Using flutter tools option "--web-render=canvaskit" would set the value to
39+
/// true.
40+
/// Using flutter tools option "--web-render=html" would set the value to false.
41+
const bool _useSkia =
1042
bool.fromEnvironment('FLUTTER_WEB_USE_SKIA', defaultValue: false);
1143

1244
// If set to true, forces CPU-only rendering (i.e. no WebGL).

lib/web_ui/lib/src/engine/canvaskit/shader.dart

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -81,7 +81,7 @@ class CkGradientLinear extends CkShader implements ui.Gradient {
8181

8282
@override
8383
SkShader createDefault() {
84-
assert(experimentalUseSkia);
84+
assert(useCanvasKit);
8585

8686
return canvasKit.SkShader.MakeLinearGradient(
8787
toSkPoint(from),
@@ -109,7 +109,7 @@ class CkGradientRadial extends CkShader implements ui.Gradient {
109109

110110
@override
111111
SkShader createDefault() {
112-
assert(experimentalUseSkia);
112+
assert(useCanvasKit);
113113

114114
return canvasKit.SkShader.MakeRadialGradient(
115115
toSkPoint(center),
@@ -141,7 +141,7 @@ class CkGradientConical extends CkShader implements ui.Gradient {
141141

142142
@override
143143
SkShader createDefault() {
144-
assert(experimentalUseSkia);
144+
assert(useCanvasKit);
145145
return canvasKit.SkShader.MakeTwoPointConicalGradient(
146146
toSkPoint(focal),
147147
focalRadius,

lib/web_ui/lib/src/engine/dom_renderer.dart

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@ class DomRenderer {
4545
html.MetaElement? _viewportMeta;
4646

4747
/// The canvaskit script, downloaded from a CDN. Only created if
48-
/// [experimentalUseSkia] is set to true.
48+
/// [useCanvasKit] is set to true.
4949
html.ScriptElement? get canvasKitScript => _canvasKitScript;
5050
html.ScriptElement? _canvasKitScript;
5151

@@ -451,7 +451,7 @@ flt-glass-pane * {
451451
});
452452
}
453453

454-
if (experimentalUseSkia) {
454+
if (useCanvasKit) {
455455
_canvasKitScript?.remove();
456456
_canvasKitScript = html.ScriptElement();
457457
_canvasKitScript!.src = canvasKitBaseUrl + 'canvaskit.js';

lib/web_ui/lib/src/engine/html/shaders/shader.dart

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -216,7 +216,7 @@ class GradientRadial extends EngineGradient {
216216
@override
217217
Object createPaintStyle(html.CanvasRenderingContext2D? ctx,
218218
ui.Rect? shaderBounds) {
219-
if (!experimentalUseSkia) {
219+
if (!useCanvasKit) {
220220
if (tileMode != ui.TileMode.clamp) {
221221
throw UnimplementedError(
222222
'TileMode not supported in GradientRadial shader');

lib/web_ui/lib/src/engine/platform_dispatcher.dart

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -377,7 +377,7 @@ class EnginePlatformDispatcher extends ui.PlatformDispatcher {
377377
return;
378378

379379
case 'flutter/platform_views':
380-
if (experimentalUseSkia) {
380+
if (useCanvasKit) {
381381
rasterizer!.surface.viewEmbedder
382382
.handlePlatformViewCall(data, callback);
383383
} else {
@@ -482,7 +482,7 @@ class EnginePlatformDispatcher extends ui.PlatformDispatcher {
482482
/// painting.
483483
@override
484484
void render(ui.Scene scene, [ui.FlutterView? view]) {
485-
if (experimentalUseSkia) {
485+
if (useCanvasKit) {
486486
// "Build finish" and "raster start" happen back-to-back because we
487487
// render on the same thread, so there's no overhead from hopping to
488488
// another thread.
@@ -839,7 +839,7 @@ class EnginePlatformDispatcher extends ui.PlatformDispatcher {
839839

840840
@visibleForTesting
841841
late Rasterizer? rasterizer =
842-
experimentalUseSkia ? Rasterizer(Surface(HtmlViewEmbedder())) : null;
842+
useCanvasKit ? Rasterizer(Surface(HtmlViewEmbedder())) : null;
843843

844844
/// In Flutter, platform messages are exchanged between threads so the
845845
/// messages and responses have to be exchanged asynchronously. We simulate

lib/web_ui/lib/src/ui/canvas.dart

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ class Vertices {
3030
List<Color>? colors,
3131
List<int>? indices,
3232
}) {
33-
if (engine.experimentalUseSkia) {
33+
if (engine.useCanvasKit) {
3434
return engine.CkVertices(
3535
mode,
3636
positions,
@@ -53,7 +53,7 @@ class Vertices {
5353
Int32List? colors,
5454
Uint16List? indices,
5555
}) {
56-
if (engine.experimentalUseSkia) {
56+
if (engine.useCanvasKit) {
5757
return engine.CkVertices.raw(
5858
mode,
5959
positions,
@@ -73,7 +73,7 @@ class Vertices {
7373

7474
abstract class PictureRecorder {
7575
factory PictureRecorder() {
76-
if (engine.experimentalUseSkia) {
76+
if (engine.useCanvasKit) {
7777
return engine.CkPictureRecorder();
7878
} else {
7979
return engine.EnginePictureRecorder();
@@ -85,7 +85,7 @@ abstract class PictureRecorder {
8585

8686
abstract class Canvas {
8787
factory Canvas(PictureRecorder recorder, [Rect? cullRect]) {
88-
if (engine.experimentalUseSkia) {
88+
if (engine.useCanvasKit) {
8989
return engine.CanvasKitCanvas(recorder, cullRect);
9090
} else {
9191
return engine.SurfaceCanvas(recorder as engine.EnginePictureRecorder, cullRect);

lib/web_ui/lib/src/ui/compositing.dart

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ abstract class PhysicalShapeEngineLayer implements EngineLayer {}
3434

3535
abstract class SceneBuilder {
3636
factory SceneBuilder() {
37-
if (engine.experimentalUseSkia) {
37+
if (engine.useCanvasKit) {
3838
return engine.LayerSceneBuilder();
3939
} else {
4040
return engine.SurfaceSceneBuilder();

lib/web_ui/lib/src/ui/initialization.dart

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -25,13 +25,13 @@ Future<void> _initializePlatform({
2525

2626
// This needs to be after `webOnlyInitializeEngine` because that is where the
2727
// canvaskit script is added to the page.
28-
if (engine.experimentalUseSkia) {
28+
if (engine.useCanvasKit) {
2929
await engine.initializeCanvasKit();
3030
}
3131

3232
assetManager ??= const engine.AssetManager();
3333
await webOnlySetAssetManager(assetManager);
34-
if (engine.experimentalUseSkia) {
34+
if (engine.useCanvasKit) {
3535
await engine.skiaFontCollection.ensureFontsLoaded();
3636
} else {
3737
await _fontCollection!.ensureFontsLoaded();
@@ -54,22 +54,22 @@ Future<void> webOnlySetAssetManager(engine.AssetManager assetManager) async {
5454

5555
_assetManager = assetManager;
5656

57-
if (engine.experimentalUseSkia) {
57+
if (engine.useCanvasKit) {
5858
engine.ensureSkiaFontCollectionInitialized();
5959
} else {
6060
_fontCollection ??= engine.FontCollection();
6161
_fontCollection!.clear();
6262
}
6363

6464
if (_assetManager != null) {
65-
if (engine.experimentalUseSkia) {
65+
if (engine.useCanvasKit) {
6666
await engine.skiaFontCollection.registerFonts(_assetManager!);
6767
} else {
6868
await _fontCollection!.registerFonts(_assetManager!);
6969
}
7070
}
7171

72-
if (debugEmulateFlutterTesterEnvironment && !engine.experimentalUseSkia) {
72+
if (debugEmulateFlutterTesterEnvironment && !engine.useCanvasKit) {
7373
_fontCollection!.debugRegisterTestFonts();
7474
}
7575
}

lib/web_ui/lib/src/ui/painting.dart

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -230,7 +230,7 @@ enum Clip {
230230
}
231231

232232
abstract class Paint {
233-
factory Paint() => engine.experimentalUseSkia ? engine.CkPaint() : engine.SurfacePaint();
233+
factory Paint() => engine.useCanvasKit ? engine.CkPaint() : engine.SurfacePaint();
234234
static bool enableDithering = false;
235235
BlendMode get blendMode;
236236
set blendMode(BlendMode value);
@@ -278,7 +278,7 @@ abstract class Gradient extends Shader {
278278
List<double>? colorStops,
279279
TileMode tileMode = TileMode.clamp,
280280
Float64List? matrix4,
281-
]) => engine.experimentalUseSkia
281+
]) => engine.useCanvasKit
282282
? engine.CkGradientLinear(from, to, colors, colorStops, tileMode, matrix4)
283283
: engine.GradientLinear(from, to, colors, colorStops, tileMode, matrix4);
284284
factory Gradient.radial(
@@ -296,13 +296,13 @@ abstract class Gradient extends Shader {
296296
// If focal == center and the focal radius is 0.0, it's still a regular radial gradient
297297
final Float32List? matrix32 = matrix4 != null ? engine.toMatrix32(matrix4) : null;
298298
if (focal == null || (focal == center && focalRadius == 0.0)) {
299-
return engine.experimentalUseSkia
299+
return engine.useCanvasKit
300300
? engine.CkGradientRadial(center, radius, colors, colorStops, tileMode, matrix32)
301301
: engine.GradientRadial(center, radius, colors, colorStops, tileMode, matrix32);
302302
} else {
303303
assert(center != Offset.zero ||
304304
focal != Offset.zero); // will result in exception(s) in Skia side
305-
return engine.experimentalUseSkia
305+
return engine.useCanvasKit
306306
? engine.CkGradientConical(
307307
focal, focalRadius, center, radius, colors, colorStops, tileMode, matrix32)
308308
: engine.GradientConical(
@@ -317,7 +317,7 @@ abstract class Gradient extends Shader {
317317
double startAngle = 0.0,
318318
double endAngle = math.pi * 2,
319319
Float64List? matrix4,
320-
]) => engine.experimentalUseSkia
320+
]) => engine.useCanvasKit
321321
? engine.CkGradientSweep(center, colors, colorStops, tileMode, startAngle,
322322
endAngle, matrix4 != null ? engine.toMatrix32(matrix4) : null)
323323
: engine.GradientSweep(center, colors, colorStops, tileMode, startAngle,
@@ -393,7 +393,7 @@ enum FilterQuality {
393393

394394
class ImageFilter {
395395
factory ImageFilter.blur({double sigmaX = 0.0, double sigmaY = 0.0}) {
396-
if (engine.experimentalUseSkia) {
396+
if (engine.useCanvasKit) {
397397
return engine.CkImageFilter.blur(sigmaX: sigmaX, sigmaY: sigmaY);
398398
}
399399
return engine.EngineImageFilter.blur(sigmaX: sigmaX, sigmaY: sigmaY);
@@ -451,7 +451,7 @@ Future<Codec> instantiateImageCodec(
451451
}
452452

453453
String? _instantiateImageCodec(Uint8List list, engine.Callback<Codec> callback) {
454-
if (engine.experimentalUseSkia) {
454+
if (engine.useCanvasKit) {
455455
engine.skiaInstantiateImageCodec(list, callback);
456456
return null;
457457
}
@@ -471,7 +471,7 @@ String? _instantiateImageCodecFromUrl(
471471
engine.WebOnlyImageCodecChunkCallback? chunkCallback,
472472
engine.Callback<Codec> callback,
473473
) {
474-
if (engine.experimentalUseSkia) {
474+
if (engine.useCanvasKit) {
475475
engine.skiaInstantiateWebImageCodec(uri.toString(), callback, chunkCallback);
476476
return null;
477477
} else {
@@ -576,7 +576,7 @@ void decodeImageFromPixels(
576576
int? targetHeight,
577577
bool allowUpscaling = true,
578578
}) {
579-
if (engine.experimentalUseSkia) {
579+
if (engine.useCanvasKit) {
580580
engine.skiaInstantiateImageCodec(
581581
pixels,
582582
(Codec codec) {
@@ -695,7 +695,7 @@ class Shadow {
695695

696696
class ImageShader extends Shader {
697697
factory ImageShader(Image image, TileMode tmx, TileMode tmy, Float64List matrix4) {
698-
if (engine.experimentalUseSkia) {
698+
if (engine.useCanvasKit) {
699699
return engine.CkImageShader(image, tmx, tmy, matrix4);
700700
}
701701
throw UnsupportedError('ImageShader not implemented for web platform.');

lib/web_ui/lib/src/ui/path.dart

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,14 @@ part of ui;
77

88
abstract class Path {
99
factory Path() {
10-
if (engine.experimentalUseSkia) {
10+
if (engine.useCanvasKit) {
1111
return engine.CkPath();
1212
} else {
1313
return engine.SurfacePath();
1414
}
1515
}
1616
factory Path.from(Path source) {
17-
if (engine.experimentalUseSkia) {
17+
if (engine.useCanvasKit) {
1818
return engine.CkPath.from(source as engine.CkPath);
1919
} else {
2020
return engine.SurfacePath.from(source as engine.SurfacePath);
@@ -64,7 +64,7 @@ abstract class Path {
6464
static Path combine(PathOperation operation, Path path1, Path path2) {
6565
assert(path1 != null); // ignore: unnecessary_null_comparison
6666
assert(path2 != null); // ignore: unnecessary_null_comparison
67-
if (engine.experimentalUseSkia) {
67+
if (engine.useCanvasKit) {
6868
return engine.CkPath.combine(operation, path1, path2);
6969
}
7070
throw UnimplementedError();

0 commit comments

Comments
 (0)