Browser crashes when connecting to client through dashboard

[microsoftdx]

Browser crashes when connecting to client through dashboard

[deltakosh]

Hey, can you reproduce the bug on a simple repro case? Or can you share your client page?

[onchainguy-eth]

Unfortunately I coudn't give you access to the project where I found this problem but I managed to create a test project with a pretty similar situation. This test project is a lot smaller (in terms of DOM size, JS complexity etc.) so the application does not crash but starts to be very very laggy as soon as VorlonJS is enabled.

You can find the project at https://github.com/seb0zz/ionic-vorlonjs-test

It is an ionic project (http://ionicframework.com/) so to reproduce the problem you need ionic installed which you can simply do by npm install -g cordova ionic. So after you installed ionic, cloned the ionic-vorlonjs-test repository and switched to the directory. You only need to perform an npm install and an then an ionic serve. Your default browser will automatically open and you will see the app.

By default VorlonJS is not enabled in this test project. So you can see how responsive the app reacts before VorlonJS is enabled. To do so go to the www/index.html file of the repository. In line 26 you will find a script tag for vorlon.js loaded from my test Heroku app. If you uncomment this line the app will automatically reload in your browser and VorlonJS will be loaded. You will be able to see the connection in the dashboard on the Heroku app.

Now the exciting part: After enabling VorlonJS you should see that the app is much slower and does not react to clicks, scrolls, etc. as responsive as before. Sometimes it takes seconds until a switch between tabs is visible after clicking.

Just give me a shout if you need more information!

[deltakosh]

Huge:) I'll check it asap!!

[johanalkstal]

Sounds similar to what I'm experiencing when trying vorlon is our Angular application.

When I add the vorlon script, the app becomes unresponsive and the browser asks if I want to stop the http://localhost:1337/vorlon.js script.

[deltakosh]

It was due to a too frequent DOM dump. I changed the way I synchronize it. You should still notice a slowdown at the beginning when I'm capturing the DOM but then things should be smooth again:)

[onchainguy-eth]

This fixed the problem for the sample app. Still have the problem with my own app and I think the main difference is that the DOM is much larger than in the test application. What about you @johanalkstal did this fix work for you?

@deltakosh Is there any way to disable the DOM syncing feature easily?

[deltakosh]

We will soon. The idea is to have a refresh button instead

[onchainguy-eth]

Would be great!

[deltakosh]

Pulling in @csuwildcat :)

The idea is to remove
https://github.com/MicrosoftDX/Vorlonjs/blob/master/Plugins/Vorlon/plugins/domExplorer/vorlon.domExplorer.ts#L139
and
https://github.com/MicrosoftDX/Vorlonjs/blob/master/Plugins/Vorlon/plugins/domExplorer/vorlon.domExplorer.ts#L143

and instead add a Refresh button in domExplorer like the one in objectExplorer

[onchainguy-eth]

And it would be great if the DOM is not initially synced but only at the first click of the "refresh" button or what ever the button name will be ;)

[csuwildcat]

I'm just finishing up augmenting the print of attributes in the explorer panel, but will jump on this next.

[onchainguy-eth]

Awesome 👍

[deltakosh]

Closed by latest commit