[dart-misc] Performance impact of Expando

[DoHyung Kim]

All the modern JS engines are using hidden class notion for optimizing
layout of and accesses to JS objects. So it usually is regarded as a good
practice to set all of the properties in constructor and to never add
additional properties after the point.

As far as I know, the current Expando implementation in dart2js adds a
property dynamically. And I guess it may not be a good practice from the
point of view of JS engines. So I ran a simple (maybe flawed) benchmark to
see how uses of Expando.

https://dartpad.dartlang.org/92053c789881a4aa57b9

I created a simple class and measured time required to access an int
property over many instances of the class. I tried to make the instnaces
under 3 different conditions.

1. No expando: all of the instances are free of any Expando property. Meant
to measure the baseline.
2. Expando to half: a half of the instances have an Expando property. Meant
to create a polymorphic callsite.
3. Expando to all: all of the instances have an Expando property. Meant to
create monomorphic callsite again by adding Expando to all.

The result is as follows in my machine:

<Firefox>

No Expando: elapsed = 506
Expando to all: elapsed = 1246
Expando to half of Data objects: elapsed = 484

Different runs produce almost same numbers.

<Chrome>

First and second runs:

No Expando: elapsed = 606
Expando to all: elapsed = 3992
Expando to half of Data objects: elapsed = 688

Third and the later runs:

No Expando: elapsed = 551
Expando to all: elapsed = 614
Expando to half of Data objects: elapsed = 588
<IE 11>

No Expando: elapsed = 746
Expando to all: elapsed = 822
Expando to half of Data objects: elapsed = 2484

I kept all of the browsers up to date at the time of this writing. I ran
the same on Opera but it shows numbers almost identical to those of Chrome.
Considering it is using the same engine underneath, it is no suprise at all.

I guessed that case 1 is the fastest, followed by case 2 by small margin,
and case 3 is the slowest, since case 1 involves a monomorphic callsite,
case 2 definitely polymorphic, and case 3 may become monomorphic again.

But only IE 11 works as I expected. And I guess Chrome seems optimizing the
codes across different runs of the benchmark (multiple runs on dartpad
reuse the same JS code?), but seems weird. Firefox... I can't explain.

Whether the use of Expando penalties a Web application or not depends on
the nature of it, definitely. And in most cases, this possible slowdown
won't affect too much in most cases.

I was curious, run the benchmark, and share it with you.

If anyone can point out what's wrong with my benchmark, it would be
appreciated. And it would also be great if some JS engine experts out there
give me some explanation on the numbers on different browsers.