Ember-inspector: Chrome freezes tab with Ember Inspector extension

[ghost]

Hello,

I'm using latest Chrome and Ember Inspector extension. The problem is, when you enable Ember Inspector extension and you go to the Data and use unloadRecord() for e.g. I have Delete button which unloads record after delete and when I press it Chrome tab will freeze and uses a lot of memory and CPU. When I turn off ember extension everything works fine with developer tools opened, but with ember inspector extension I get this. Nothing helped, I even cleaned cache, settings and so on.

If you don't open Developer Tools with Ember - everything is OK.
If you open Developer Tools for e.g. with Console tab - everything is OK.
If you open Developer Tools with Ember - everything is OK.
If you open Developer Tools with Ember and you go the Data - chrome tab freezes and uses a lot of resources.

[ghost]

Seems it also freezes if extension is just enabled, but you're not in Data with Ember Inspector. But to reproduce it 100% you need go to the Data.

[ewjoachim]

I have no idea if it's linked, but I have another case of Chrome + Firefox freezing + using 100% of CPU when selecting a specific model on the Data panel... Details and a minimum reproduction setup are here (well, as minimum as I could make that). See the readme for all the details.

[ewjoachim]

For what it's worth, it seems other people have been posting messages on Slack related to problems that look similar :

https://embercommunity.slack.com/archives/C04ENQPFW/p1501207850719655

nlincoln wrote:
I just upgraded ember-data from 2.14.4 to 2.14.7 today and now when I try to view models inside of the data part of the inspector chrome just starts eating memory, the page becomes completely unresponsive and I have to kill both the page and the chrome devtools via the chrome task manager to get things to work again

[ewjoachim]

For me the problem is not visible with ember-data 2.13.2 and is there with 2.14.x, whatever the x (up until 7).

[stephanebruckert]

Same here, happens only when the data tab of the ember inspector is open. In my case it's caused by destroyRecord() which probably clears the data the same way as unloadRecord() (used by OP) does.

self.get('store').find('token', tokenId).then(function(a) {
    a.destroyRecord()
})

100% of the CPU is used, the memory keeps increasing and nothing is showed in the console

✗ ember -v
ember-cli: 2.13.1
node: 7.9.0
os: darwin x64

Ember Inspector 2.0.6
Chrome Version 60.0.3112.90 (Official Build) (64-bit)

Initially thought something was wrong in my code and took me a long time to figure it wasn't the case, as I always keep the data tab open! :sweat_smile:

[ghost]

@stephanebruckert Everything is same for me. Even the last sentence 😄 It's just impossible to work with Ember Inspector, but I really need it to see the routes, data and so on.

[kernel-io]

Also happening to me, luckily it did not take me long to figure out it wasn't my fault considering it is a new project 😄

[stephanebruckert]

I wrote my destroyRecord a bit differently and the issue is not happening anymore:

// hack https://github.com/emberjs/data/issues/4972#issuecomment-312301105
this.get('store')._removeFromIdMap(this.get('model.calendarToken')._internalModel);
this.get('model.calendarToken').destroyRecord();

according to https://github.com/emberjs/data/issues/4972#issuecomment-312301105

[IAmJulianAcosta]

Check that your data is loading fine, had an issue with it in the last month, and it was caused by malformed/corrupt data, that freezes data tab. I had to comment the queries until I found the model that was causing the problem. YMMV

[ewjoachim]

No kind of malformed data should silently bug and crash your tab, without even a single error message...

[IAmJulianAcosta]

I agree, but that probably will unlock other people with the same problem while is fixed :)

[sammynave]

If this helps anyone, here's a project and steps to repro the issue: https://github.com/sammynave/freeze

[urbany]

Got hit by this today, on [email protected] seems to happen when I delete an unsaved record

[tomgazit]

experiencing the same issue....

[elke1979]

I use Chrome (Version 60.0.3112.90 (Official Build) (64-bit)) + the latest Ember Inspector extension.
If I log into https://www.emberjs.com/api/ember/2.14/namespaces/Ember (Ember API website) and I browse the Ember Inspector the browser freezes when I click "Data".

[pomm0]

have the same problem, any news? :(
It freezes firefox too

[teddyzeenny]

Thank you all for the detailed bug report. I was able to reproduce it and I'm investigating the issue.

[teddyzeenny]

I identified the issue and proposed a solution https://github.com/emberjs/ember.js/pull/15604.
The downside is that this is not a bug in the inspector itself, which means you'll need to upgrade your Ember version to get the fix.