[framework] inline casts on Element.widget getter to improve web performance #97822

jonahwilliams · 2022-02-04T18:57:58Z

This is an alternative to the proposal to make Element generic. After investigation, I discovered that the majority of the casting was actually unnecessary: here is an explanation:

class A {
  Object get foo;
}

class B extends A {
  String get foo => super.foo as String;
}

void main() {
  A a = B();
  Object bar = a.foo;
}

Consider the snippet above. Despite the fact that we only need an Object, as long as the subtype B is used there will be a cast performed on B.foo. Consider the Element/BuildContext API: the vast majority of the framework interacts with Element.widget or BuildContext.widget expecting only a Widget - but since all Element subclasses override the type of widget and use a cast, almost all accesses have a cast inserted even if the more specific Widget type is not required by the call site.

This leaves an alternative optimization - introduce a different getter with a cast and avoid overriding Element.widget. Furthermore, this presents a chance to optimize Element.widget by making the field non-nullable and using _NullWidget as a sentinel. This null check is fairly expensive in dart2js.

To benchmark this I used my favorite benchmark from #95596

On the web the average time of this benchmark decreased from 1845 ms to 1688 ms (~9%). On my Pixel 4 there was essentially no difference, which may just represent the lower cost of casts/null checks in AOT

The change to make Element generic was #97249 and would cause a breaking change in package:nested

goderbauer · 2022-02-04T21:00:06Z

packages/flutter/lib/src/widgets/framework.dart

@@ -3233,8 +3233,8 @@ abstract class Element extends DiagnosticableTree implements BuildContext {

  /// The configuration for this element.
  @override
-  Widget get widget => _widget!;
-  Widget? _widget;
+  Widget get widget => _widget;


I thought we had documentation somewhere that was specifically telling people to override this with a getter that type casts to the right type. Obviously, that would need to be updated. But I can't find it, so maybe we don't?

Ah! It's on RenderObjectElement: https://master-api.flutter.dev/flutter/widgets/RenderObjectElement-class.html

Can you update that doc there with the new practise?

It may also be helpful to add a note to this doc string describing the pattern.

I think we could probably make this API mostly private too. I would need to update the doc with a better pattern

I've removed the public API

https://master-api.flutter.dev/flutter/widgets/RenderObjectElement-class.html still needs to be updated, though. It's telling people to do the casting pattern for new RenderObjectElements that we are now discouraging.

goderbauer · 2022-02-04T21:03:29Z

packages/flutter/lib/src/widgets/framework.dart

-  Widget get widget => _widget!;
-  Widget? _widget;
+  Widget get widget => _widget;
+  Widget _widget = const _NullWidget();


Maybe pull this out into a separate PR so we get separate benchmark runs for these two independent changes?

goderbauer · 2022-02-04T21:10:25Z

packages/flutter/lib/src/widgets/notification_listener.dart

@@ -62,7 +62,7 @@ abstract class Notification {
  @mustCallSuper
  bool visitAncestor(Element element) {
    if (element is StatelessElement) {
-      final StatelessWidget widget = element.widget;
+      final StatelessWidget widget = element.widget as StatelessWidget;


I believe this cast can also be removed as follows since the code never relies on this being a StatelessWidget:

Suggested change

final StatelessWidget widget = element.widget as StatelessWidget;

final Widget widget = element.widget;

actually this whole notification API is sus, I need to look at this more later

goderbauer · 2022-02-04T21:12:54Z

packages/flutter/lib/src/widgets/framework.dart

@@ -5571,8 +5572,8 @@ abstract class RenderObjectElement extends Element {
  /// Creates an element that uses the given widget as its configuration.
  RenderObjectElement(RenderObjectWidget widget) : super(widget);

-  @override
-  RenderObjectWidget get widget => super.widget as RenderObjectWidget;
+  /// A typed override of [Element.widget].


Would be helpful to add a little color to this doc explaining when one should use widget and when typedWidget and why.

Since I removed the public API, I wonder what we should do here. We could warn about casting, but ideally we'd just fix that and delete the typedWidget private API later

What do you mean by "just fix that" - do you mean making it generic? Or do you see another way to avoid the private typedWidgets?

I mean ideally we would make casts faster, and then we wouldn't need to do the work around. I'll update the documentation to clarify the casting performance

goderbauer · 2022-02-04T21:23:34Z

On the web the average time of this benchmark decreased from 1845 ms to 1688 ms (~9%).

Nice!

The change to make Element generic was https://github.com/flutter/flutter/pull/97249[](https://github.com/jonahwilliams) and would cause a breaking change in package:nested

Would the breakage be contained in package:nested and could simply be fixed there? Or would it also require changes to its customers?

jonahwilliams · 2022-02-04T22:00:58Z

It could be fixed there, and I think it would be mostly self contained. The downside of making Element generic is that you can't make _widget non-nullable anymore, since it is typed T and we cannot create a const placeholder for an arbitrary T.

Hixie · 2022-02-04T22:03:03Z

The downside of making Element generic is that you can't make _widget non-nullable anymore, since it is typed T and we cannot create a const placeholder for an arbitrary T.

could we type it T extends Widget and use your _NullWidget trick?

jonahwilliams · 2022-02-04T22:08:03Z

No, that wouldn't work since the Element subtypes would need to tighten the constraint, StatelessElement<T extends StatelessWidget> extends ComponentElement<T>, and NullWidget would no longer satisfy that

Hixie · 2022-02-04T22:20:38Z

Can we make it late and have a separate flag for when it's not set?

jonahwilliams · 2022-02-04T22:32:22Z

Unfortunately late also has terrible performance in dart2js....

Hixie · 2022-02-04T22:54:02Z

Is there a bug on that? It seems like late should be entirely free in release builds (where we can just fail with a JS error instead of a Dart error if it's not valid)...

jonahwilliams · 2022-02-04T22:55:16Z

The nice part about making it non-nullable is that if you are using the API correctly there is no additional cost for accessing the field. The problem with late/nullable/a flag is that you need to insert a check on all accesses, and since JS is such a slower language than native machine code you pay an oversized effect.

jonahwilliams · 2022-02-04T22:55:31Z

I don't think its a bug, its just a cost of targeting a slow language

Hixie · 2022-02-04T23:04:37Z

In release builds there's no reason to add the test though right? That's what I mean by "free".

jonahwilliams · 2022-02-04T23:05:22Z

Actually I sort of take that back. For reference, in a native build on the same machine this benchmark takes 747 ms, which is about 2.2X as fast as the web version. If you assume the same lines of code run, and each line ran in about the same speed with the same optimization, then I would expect that eliminating the cast would have about half the impact on native.

But I don't see that at all, instead the needle doesn't move at all on a native build - which implies that as casts are much more expensive on the web.

jonahwilliams · 2022-02-04T23:06:34Z

@Hixie I believe dart2js is attempting to follow the spec which has specific kinds of behavior documented (i.e. LateInitializationError thrown) which is where the expense comes from.

jonahwilliams · 2022-02-04T23:07:42Z

Late issue is here: dart-lang/sdk#43361

jonahwilliams · 2022-02-04T23:33:03Z

I made all of the typedWidget getters private so there is no change to public API besides removing the more specific types from subclasses. I also removed the nullcheck - I did not observe a performance delta so I definitely overstated the impact of the nullcheck

…web performance (flutter/flutter#97822)

…ormance (flutter#97822)

[framework] remove most Element.widget casting

43df434

jonahwilliams requested review from yjbanov, goderbauer and Hixie February 4, 2022 19:25

jonahwilliams marked this pull request as ready for review February 4, 2022 19:26

goderbauer reviewed Feb 4, 2022

View reviewed changes

jonahwilliams mentioned this pull request Feb 4, 2022

Surprisingly poor performance of as casts in Flutter Framework with dart2js dart-lang/sdk#48315

Open

jonahwilliams added 3 commits February 4, 2022 15:27

Remove typedWidget API

10ebbb4

Remove public typedWidget

00fb831

++

93cab47

engine-flutter-autoroll mentioned this pull request Feb 8, 2022

Roll Flutter from f483b7d80831 to 4f975cbe2fc9 (36 revisions) flutter/plugins#4765

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 8, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

9504c76

…web performance (flutter/flutter#97822)

engine-flutter-autoroll mentioned this pull request Feb 8, 2022

Roll Flutter from f483b7d80831 to 4f975cbe2fc9 (36 revisions) flutter/packages#745

Merged

engine-flutter-autoroll added a commit to engine-flutter-autoroll/packages that referenced this pull request Feb 8, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

aa49f8a

…web performance (flutter/flutter#97822)

engine-flutter-autoroll mentioned this pull request Feb 9, 2022

Roll Flutter from f483b7d80831 to 4f975cbe2fc9 (36 revisions) flutter/plugins#4766

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 9, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

f77222a

…web performance (flutter/flutter#97822)

engine-flutter-autoroll mentioned this pull request Feb 9, 2022

Roll Flutter from f483b7d80831 to 9eb94c59b8cd (38 revisions) flutter/plugins#4767

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 9, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

e2604b3

…web performance (flutter/flutter#97822)

engine-flutter-autoroll mentioned this pull request Feb 9, 2022

Roll Flutter from f483b7d80831 to 63f48d1ff8db (39 revisions) flutter/plugins#4768

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 9, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

0d1312d

…web performance (flutter/flutter#97822)

engine-flutter-autoroll mentioned this pull request Feb 9, 2022

Roll Flutter from f483b7d80831 to 3bdea6bb925a (40 revisions) flutter/plugins#4769

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 9, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

d441b54

…web performance (flutter/flutter#97822)

engine-flutter-autoroll mentioned this pull request Feb 9, 2022

Roll Flutter from f483b7d80831 to ae3f99c98af7 (41 revisions) flutter/plugins#4770

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 9, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

432a714

…web performance (flutter/flutter#97822)

engine-flutter-autoroll mentioned this pull request Feb 9, 2022

Roll Flutter from f483b7d80831 to d2853dce6c14 (43 revisions) flutter/plugins#4771

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 9, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

f12f845

…web performance (flutter/flutter#97822)

engine-flutter-autoroll mentioned this pull request Feb 9, 2022

Roll Flutter from f483b7d80831 to 3669e3669a89 (44 revisions) flutter/plugins#4772

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 9, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

a294192

…web performance (flutter/flutter#97822)

engine-flutter-autoroll mentioned this pull request Feb 9, 2022

Roll Flutter from f483b7d80831 to 499e900e3952 (45 revisions) flutter/plugins#4773

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 9, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

a53c7c6

…web performance (flutter/flutter#97822)

engine-flutter-autoroll mentioned this pull request Feb 9, 2022

Roll Flutter from f483b7d80831 to c54a27dc8790 (46 revisions) flutter/plugins#4774

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 9, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

933924b

…web performance (flutter/flutter#97822)

engine-flutter-autoroll mentioned this pull request Feb 9, 2022

Roll Flutter from f483b7d80831 to 312085a19a0f (47 revisions) flutter/plugins#4775

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 9, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

5cb23e9

…web performance (flutter/flutter#97822)

engine-flutter-autoroll mentioned this pull request Feb 9, 2022

Roll Flutter from f483b7d80831 to ca647d1e9a5d (48 revisions) flutter/plugins#4776

Closed

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 9, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

d168cde

…web performance (flutter/flutter#97822)

engine-flutter-autoroll mentioned this pull request Feb 9, 2022

Roll Flutter from f483b7d80831 to bb3275b9340f (51 revisions) flutter/plugins#4778

Merged

engine-flutter-autoroll added a commit to engine-flutter-autoroll/plugins that referenced this pull request Feb 9, 2022

4f975cb [framework] inline casts on Element.widget getter to improve …

9d57912

…web performance (flutter/flutter#97822)

jonahwilliams mentioned this pull request Feb 9, 2022

[framework] make Element generic #97249

Closed

clocksmith pushed a commit to clocksmith/flutter that referenced this pull request Mar 8, 2022

[framework] inline casts on Element.widget getter to improve web perf…

5dbb941

…ormance (flutter#97822)

	final StatelessWidget widget = element.widget as StatelessWidget;
	final Widget widget = element.widget;

[framework] inline casts on Element.widget getter to improve web performance #97822

[framework] inline casts on Element.widget getter to improve web performance #97822

Uh oh!

Conversation

jonahwilliams commented Feb 4, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

goderbauer commented Feb 4, 2022

Uh oh!

jonahwilliams commented Feb 4, 2022

Uh oh!

Hixie commented Feb 4, 2022

Uh oh!

jonahwilliams commented Feb 4, 2022

Uh oh!

Hixie commented Feb 4, 2022

Uh oh!

jonahwilliams commented Feb 4, 2022

Uh oh!

Hixie commented Feb 4, 2022 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

jonahwilliams commented Feb 4, 2022

Uh oh!

jonahwilliams commented Feb 4, 2022

Uh oh!

Hixie commented Feb 4, 2022

Uh oh!

jonahwilliams commented Feb 4, 2022

Uh oh!

jonahwilliams commented Feb 4, 2022

Uh oh!

jonahwilliams commented Feb 4, 2022

Uh oh!

jonahwilliams commented Feb 4, 2022

Uh oh!

Uh oh!

jonahwilliams commented Feb 4, 2022 •

edited

Loading

Hixie commented Feb 4, 2022 •

edited

Loading