Skip to content
This repository was archived by the owner on Feb 25, 2025. It is now read-only.

[web] retain GL/Gr context on window resize - #38576

Merged
auto-submit[bot] merged 11 commits into
flutter-team-archive:mainfrom
jonahwilliams:dont-recreate-canvas
Jan 11, 2023
Merged

auto-submit[bot] merged 11 commits into
flutter-team-archive:mainfrom
jonahwilliams:dont-recreate-canvas

Conversation

@jonahwilliams

@jonahwilliams jonahwilliams commented Dec 30, 2022 •

Copy link
Copy Markdown
Contributor

The current implementation of the canvaskit renderer abandons the current gl context and creates a new one when resizing the window. This is an expensive operation, and causes the loss of all GPU backed textures associated with the previous context. At least part of the issue in flutter/flutter#117786 is due to using a separate context, which I think is due partially to needing to deal with this on resize.

I don't think this should be necessary, its fairly straightforward to resize a canvas using webgl/webgl2 (see https://webgl2fundamentals.org/webgl/lessons/webgl-resizing-the-canvas.html ). If we're missing APIs in Skia/Canvaskit then we should get those added instead of working around the problem.

Fixes flutter/flutter#117803

@flutter-dashboard flutter-dashboard Bot added the platform-web Code specifically for the web engine label Dec 30, 2022
@jonahwilliams jonahwilliams changed the title [web] dont dispose of context on window resize [web] retain GL context on window resize Jan 3, 2023
@harryterkelsen

Copy link
Copy Markdown
Contributor

mostly LGTM but we should probably touch this class up now that we should be a one-to-one relationship between Surface and HTML Canvas (whereas before one Surface could have many HTML canvases over its lifetime) so things like createNewHtmlCanvas should probably be refactored out

@jonahwilliams

Copy link
Copy Markdown
Contributor Author

Its a bit hard to tell in flutter/gallery, because at a certain size it switches layouts and that frame is fairly expensive anyway

Before:

image

After:

image

My read of the profiles is that the long frame is roughly 2x as long in the former one, its just not all in JS time

jonahwilliams added 2 commits January 3, 2023 11:45
@jonahwilliams

Copy link
Copy Markdown
Contributor Author

Hello world:

Before:

image

After:

image

@jonahwilliams

Copy link
Copy Markdown
Contributor Author

It also seems like we can keep using the same CkSurface as long as the canvas size didn't change

@jonahwilliams jonahwilliams changed the title [web] retain GL context on window resize [web] retain GL/Gr context on window resize, retain CkSurface if canvas size is unchanged Jan 3, 2023
@jonahwilliams
jonahwilliams marked this pull request as ready for review January 3, 2023 20:41
@jonahwilliams

Copy link
Copy Markdown
Contributor Author

@hterkelsen this is (mostly) updated now. It seems like we do need to create new CkSurfaces whenever the size of the underlying canvas changes, so we can still have multiple CkSurfaces. If we can fix the lookup of the GlParameters on surface creation this will be significantly faster too

@jonahwilliams

Copy link
Copy Markdown
Contributor Author

Looks like we do need to recreate the surface, filled flutter/flutter#117934 as a follow up

@jonahwilliams jonahwilliams changed the title [web] retain GL/Gr context on window resize, retain CkSurface if canvas size is unchanged [web] retain GL/Gr context on window resize Jan 3, 2023
@jonahwilliams jonahwilliams added autosubmit Merge PR when tree becomes green via auto submit App and removed autosubmit Merge PR when tree becomes green via auto submit App labels Jan 10, 2023
@jonahwilliams

Copy link
Copy Markdown
Contributor Author

Thanks!

@jonahwilliams jonahwilliams added the autosubmit Merge PR when tree becomes green via auto submit App label Jan 10, 2023
@auto-submit
auto-submit Bot merged commit b9a7234 into flutter-team-archive:main Jan 11, 2023
engine-flutter-autoroll added a commit to engine-flutter-autoroll/flutter that referenced this pull request Jan 11, 2023
auto-submit Bot pushed a commit to flutter/flutter that referenced this pull request Jan 11, 2023
* b9a7234 [web] retain GL/Gr context on window resize (flutter-team-archive/engine#38576)

* fd43606 Add SpringAnimation.js from React Native (flutter-team-archive/engine#38750)

* 53bd4bb Roll Skia from b8c0a78a2378 to e1f3980272f3 (24 revisions) (flutter-team-archive/engine#38758)
esouthren pushed a commit to esouthren/flutter that referenced this pull request Jan 15, 2023
…8289)

* b9a7234 [web] retain GL/Gr context on window resize (flutter-team-archive/engine#38576)

* fd43606 Add SpringAnimation.js from React Native (flutter-team-archive/engine#38750)

* 53bd4bb Roll Skia from b8c0a78a2378 to e1f3980272f3 (24 revisions) (flutter-team-archive/engine#38758)