Performance on IE11

[mortz123]

So i'm working on a project which the main dashboard is using the angular2gridster and when a "heavy" widget(contains a list of 30 rows of data) is added and i drag a widget(not necessarily the "heavy" one the fps drops to like 10fps, if i had another "heavy" widget of the same kind, it goes to like 2fps). My first approach was when i start to drag, to remove the data from the widget and on drop, restore it. It worked with one heavy widget, but with several on the dashboard, it returned to be problematic. From my understanding, the app detect changes only on drag start and drop, so why along the way of dragging the fps is so low as if it detects changes on every movement? (my own code has no change detection, i tried to make the change detection strategy to onPush and even detach the detector on drag start and re-attach it on drop with no luck). I'm using angular 5, and the app is running on IE11(customers' limitations)- it is important to mention that on chrome the dragging is smooth even with said "heavy" widgets. Hope you can shed some light for me or give me a lead on what i should i try because i'm out of ideas..(Also, for angular 5, what is the latest version/release i should be using?)

[swiety85]

Hi, have you tried setting useCSSTransforms: true in the GridsterComponents options?

[mortz123]

Hi, have you tried setting useCSSTransforms: true in the GridsterComponents options?

Sorry it took me so long to answer, missed the notification. Yes i did use useCSSTransforms: true. What else can i do? (Any way i can use the devTools of chrome F12, i don't know what to look for in the performance analysis after i recorded a drag-drop scenario. The issue is in the gridster itself when containing "heavy" widgets and moving any widget(heavy or not), as if the screen is rendering on every movement. in my own code, i tried to intercept detectchanges on the onChanges lifecycle hook but it didn't get in there so i don't know what else to do.. hope you have something to help me.