Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added settings to improve performance on IE 11 by allowing prevention of DOM object removal #142

Open
wants to merge 5 commits into
base: master
Choose a base branch
from

Conversation

celeronpm
Copy link

I've added two extra settings aimed at improving performance. This has a substantial effect on modern heavy AngularJS apps on IE 11. In my performance tests, I was seeing 600ms overhead due to the offsetWidth calculations when the component was added/removed from the DOM.

The new settings will prevent DOM manipulation and will only hide the progress when it is done, so it is ready to go for the next call on SPAs.

On IE 11, adding DOM elements and forcing calculations of offsetWidth
causes lag. In complex applications, this can have a negative
performance impact.

I've added two settings values to account for this:

Settings.removeFromDOM (true by default)

Settings this to true, just hides the progress div rather than removing
it from the DOM. Calling Nprogress.Start shows it again. This has a
significant performance benefit in IE 11 as it minimizes calculations
for layout.

Settings.forceRedraw (true by default)

This removes the forced redraw from the progress bar as it is not needed
in all cases, and has a performance impact.
updates tests for new settings
@celeronpm celeronpm changed the title Master Added settings to improve performance on IE 11 by allowing prevention of DOM object removal May 20, 2016
@felixmosh
Copy link

@rstacruz can you pls review this PR?

@felixmosh
Copy link

@celeronpm Thank you for this PR, It improved my app, I'm debugging a performance issue in my app, and looks like this solved the issue!

@n0099
Copy link

n0099 commented Aug 30, 2024

This force repaint/reflow is introduced in 031c5dc#diff-a320ff3f25e8b7cc682b156f26a26c91b47309d8783eadaa4934ca5114adae44R50 and affecting all browsers other than IE11.

n0099 added a commit to n0099/open-tbm that referenced this pull request Aug 31, 2024
…ss#142 (comment) @ layouts/default.vue

+ `stores/globalLoading.ts`
$ yarn remove {,@types/}nprogress
@ fe
n0099 added a commit to n0099/open-tbm that referenced this pull request Aug 31, 2024
…ss#142 (comment) @ layouts/default.vue

+ `stores/globalLoading.ts`
$ yarn remove {,@types/}nprogress
@ fe
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants