Very slow component rendering

Performance
1

In my route i am rendering around 25 components, It looks around like this in my template:

{{#each model.comments as |comment|}}
{{comment-component property1=comment.prop1 property2=comment.prop2}}
{{/each}}

But i do not have 2 properties, i have around 20 properties, so basically if i understand correctly it means i am making 20 x 25 = 500 two-way bindings. If i pass only comment=comment to that component will it mean it will bind only once, so i will get 25 bindings instead 500 ? or Ember will bind every property of this object anyway making it 500 ?

On initial render it renders in around 600-800 ms, on subsequent renders it’s around 340-380 ms. It’s on i7-3770k.

Is this amount of bindings performance killer? Or should i look somewhere else ?

I like ember but I didn’t anticipated such high rendering times, i am little bit shocked.

I am using ember 1.13.5

2

1.13.x has a performance regression when rendering components in a list (it’s much slower than 1.12). This is being addressed.

As for bindings, in theory in might be better to just pass in comment, in practice I don’t believe this is your performance problem.

3

thx for reply, on 1.12 rendering times were around 2-3 times faster (so first render was around 400 ms max and subsequent was around 180-200 ms), i wonder if i can do anything on my side to make it faster or i just need to wait for fix in next versions of ember? if not then what is the best way to debug this ? I mean when i am doing profiling in developer tools i only see Ember internal functions being called and taking most of the processor time.

4

There is a bunch of info about this in https://github.com/emberjs/ember.js/issues/11502 if you would like to read up on some of the things we are doing to fix the issue.

5

Thx rwjblue, i see it’s big regression indeed from your gist

1.12 - 91.21 ms

1.13.6 - 293.29 ms

for complex list.

Don’t get me wrong or anything, i really appreciate what you are doing, but i have one question. Regression is around ~300% at the moment.

I would like to just know if this is something that can be fixed in one month or something that will take half a year or even more ? So i will know if should get back to 1.12 or not.

1 Like
6

@recko Here is a video in which @wycats outlines his plan for drastically improving initial render times:

I believe that work is happening in a private branch of HTMLBars and that we’ll get an update on progress soon.