[web] Avoid absolute positioning for base CanvasKit canvas#188337
Conversation
There was a problem hiding this comment.
Code Review
This pull request modifies the web engine to conditionally apply the position: absolute style to onscreen canvases only when they are used as overlays between platform views, rather than unconditionally styling them. It also adds a unit test to verify this behavior. The reviewer suggested guarding the style updates in setIsOverlay to prevent redundant DOM writes and potential style recalculation overhead.
| // canvas needs a display canvas. | ||
| canvas.displayCanvas = rasterizer.getOverlay(); | ||
| } | ||
| canvas.displayCanvas!.setIsOverlay(hasPlatformViews); |
There was a problem hiding this comment.
Maybe we should change the condition for checking if the canvas is an overlay. After all, it's possible (in theory) for a composition to have more than one canvas and no platform views. And also, it's possible for there to be only one canvas even if there are platform views. Maybe instead, we should check if there are multiple canvases in the composition.
There was a problem hiding this comment.
Good catch. Updated.
|
autosubmit label was removed for flutter/flutter/188337, because - The status or check suite Mac mac_unopt has failed. Please fix the issues identified (or deflake) before re-applying this label. |
|
autosubmit label was removed for flutter/flutter/188337, because - The status or check suite Google testing has failed. Please fix the issues identified (or deflake) before re-applying this label. |
|
autosubmit label was removed for flutter/flutter/188337, because - The status or check suite Google testing has failed. Please fix the issues identified (or deflake) before re-applying this label. |
…12169) Manual roll Flutter from 91939cc4db78 to dc2a8703e12b (50 revisions) Manual roll requested by [email protected] flutter/flutter@91939cc...dc2a870 2026-07-09 [email protected] [ios,macos] Update swiftc.py flags to match swiftc (flutter/flutter#189174) 2026-07-09 [email protected] [AGP 9] Update Warn Version to AGP 9+ (flutter/flutter#189109) 2026-07-09 [email protected] Sync CHANGELOG.md from stable (flutter/flutter#189203) 2026-07-09 [email protected] [web] Roll Chrome to 145 (framework) (flutter/flutter#182861) 2026-07-09 [email protected] Roll Packages from 52d84d6 to 20928d5 (6 revisions) (flutter/flutter#189194) 2026-07-09 [email protected] [web] Avoid absolute positioning for base CanvasKit canvas (flutter/flutter#188337) 2026-07-09 [email protected] Roll Dart SDK from cdb7217e65aa to a11fb7ed40a5 (6 revisions) (flutter/flutter#189195) 2026-07-09 [email protected] Fix dereference of nullptr in the moved-to-rect signal in the Linux embedder (flutter/flutter#189152) 2026-07-09 [email protected] Fix data for design packages (flutter/flutter#189140) 2026-07-09 [email protected] Roll Skia from 7b42d1251d54 to ab3a7b98c94d (2 revisions) (flutter/flutter#189181) 2026-07-09 [email protected] Roll Skia from 05d9d214e0b7 to 7b42d1251d54 (2 revisions) (flutter/flutter#189175) 2026-07-09 [email protected] Roll Skia from 542c8bdd7f4f to 05d9d214e0b7 (4 revisions) (flutter/flutter#189169) 2026-07-09 [email protected] UberSDF rect handling for thin (line-like) rectangles (flutter/flutter#188821) 2026-07-09 [email protected] Roll Skia from dd572c07f63c to 542c8bdd7f4f (4 revisions) (flutter/flutter#189160) 2026-07-09 [email protected] [flutter_tools] Fix hot restart for WASM web builds (flutter/flutter#187898) 2026-07-08 [email protected] Split FlViewRenderer into OpenGL and software backends (flutter/flutter#188824) 2026-07-08 [email protected] Promote android_hardware_smoke_tests out of bringup in CI (flutter/flutter#189081) 2026-07-08 [email protected] Roll Skia from 8df24be66531 to dd572c07f63c (4 revisions) (flutter/flutter#189150) 2026-07-08 [email protected] Expose LinuxWindowRegistrar on _window_linux.dart in order to better support out of tree LinuxWindowingOwners (flutter/flutter#188917) 2026-07-08 [email protected] Roll pub packages (flutter/flutter#189149) 2026-07-08 [email protected] fix(ci): harden some workflows (flutter/flutter#189087) 2026-07-08 [email protected] Roll Skia from 51a62da33da0 to 8df24be66531 (1 revision) (flutter/flutter#189139) 2026-07-08 [email protected] Roll Dart SDK to Dart 3.13 beta3 (flutter/flutter#189122) 2026-07-08 [email protected] [flutter_tools] Don't crash on non-UTF-8 plugin pubspec.yaml (flutter/flutter#188976) 2026-07-08 [email protected] [flutter_tools] Watch transitive #include headers for FragmentProgram hot reload (flutter/flutter#187945) 2026-07-08 [email protected] Roll Skia from 040d9f55de00 to 51a62da33da0 (1 revision) (flutter/flutter#189135) 2026-07-08 [email protected] Roll Packages from 92525f5 to 52d84d6 (7 revisions) (flutter/flutter#189134) 2026-07-08 [email protected] [flutter_tools] Forcefully kill hung subprocesses 5 seconds after timeout (flutter/flutter#187178) 2026-07-08 [email protected] Expose the app's build name and number as compile-time constants (flutter/flutter#187935) 2026-07-08 [email protected] Roll Skia from 1ff92f879815 to 040d9f55de00 (1 revision) (flutter/flutter#189131) 2026-07-08 [email protected] Roll Skia from 6137414bef5c to 1ff92f879815 (6 revisions) (flutter/flutter#189126) 2026-07-08 [email protected] [test cross imports] More test/rendering + flutter_test/test fixes (flutter/flutter#188954) 2026-07-08 [email protected] engine: explain why each candidate build was skipped in Flutter web loader (flutter/flutter#186254) 2026-07-08 [email protected] vscode: add missing unicode.h (flutter/flutter#189102) 2026-07-08 [email protected] Roll Fuchsia Linux SDK from 7RjQJBW3m-3Jl-7jr... to QcRFUtvCw2EobfJ8s... (flutter/flutter#189104) 2026-07-08 [email protected] Roll Skia from 075fbe4778d9 to 6137414bef5c (10 revisions) (flutter/flutter#189106) 2026-07-08 [email protected] engine: warn on WASM load failure when not crossOriginIsolated (flutter/flutter#186252) 2026-07-08 [email protected] Roll Dart SDK from c9bccc09e733 to db2155f56bf3 (2 revisions) (flutter/flutter#189105) 2026-07-08 [email protected] [flutter_tools] Prevent interactive device selection in machine mode (flutter/flutter#188267) 2026-07-08 [email protected] [flutter_tools] Fix wireless ADB device discovery when serial contains spaces (flutter/flutter#187943) 2026-07-07 [email protected] [web] Fix grouped autofill on iOS Chrome (flutter/flutter#187459) 2026-07-07 [email protected] Fix TextSelectionOverlay crash when layout is degenerate (flutter/flutter#188672) 2026-07-07 [email protected] [flutter_tools] Provision Android NDK in the main Gradle invocation (flutter/flutter#186337) 2026-07-07 [email protected] Android_hardware_smoke_test: Migrate to AGP 9 (flutter/flutter#189082) ...
fix for #176327
Partial fix for #181511
Problem
With CanvasKit and semantics enabled, scrolling regular Flutter Web content on iPhone WebKit browsers can be very janky. The base CanvasKit canvas was always styled with
position:absolute, which is expensive for WebKit to scroll together with the semantics DOM.Fix
Only platform-view overlay canvases keep
position:absolute. The normal base CanvasKit canvas now uses regular positioning, which fixes the plain Flutter scroll case while preservingHtmlElementViewstacking.One limitation: mixed Flutter and
HtmlElementViewscenes may still show iOS WebKit scroll jank because platform-view overlays still requireposition:absolute.Demo
Steps: open the page on iPhone Chrome or Safari, keep semantics enabled, then scroll the page continuously.
Before: the on-screen jank log shows severe scroll jank, including runs over 100 janky frames per 5 seconds.
After: the same regular Flutter content stays smooth, with low jank summaries around 1 to 10 janky frames per 5 seconds in validation runs.