Very slow transition possibly caused by removing table from DOM

Performance
1

Hi all.

I’m using Ember JS 2.3.0, Ember Data 2.3.3 and jQuery 2.1.4 and I’m having an issue when trying to transition away from a page with a HTML table component on it. The table component is populated with data from this Ember Data call:

this.store.query('log', {filter: {
    created_at_from: moment().subtract(1, 'month').format('DD/MM/YYYY'),
    created_at_to: moment().format('DD/MM/YYYY'),
    object: 'IsoApplication'
}})

which having looked in the developer tools “Timeline” and “Network” tabs is resolving in good time. It has no special jQuery events etc attached to it and is simply a plain HTML table made dynamic with Ember.

However, when clicking a “link-to” helper that transitions away from the page with the component on it there is a huge 10 second delay before the destination page renders. During this time nothing seems to happen and having used the developer tools “Timeline” and drilled down it seems that the delay occurs when the “removeFromListeners” function is being called (see attached timeline screenshot). No asynchronous stuff is happening at this point and therefore no loader appears but it seems that tearing down the table is the problem because if I remove the table component from the template the issue disappears. Without the table component the page transitions almost instantly.

1897×737 90.8 KB
I have attached the timeline screenshot to see if anyone can help to pinpoint the possible cause of this problem.

Any suggestions would be welcome.

Thanks.