Performance tweak

Regarding the scroll event

By default, the scroll event is used to do the calculation and render the custom scrollbars.

You would want to tweak the scroll event if:

• It is not performing well on low-end devices.
• You have a complex design and you need every framerate.

Usage

You can throttle the scroll event using the scrollAuditTime option, 20 milliseconds seems to be a reasonable value.

Example:

Set the option [scrollAuditTime] for a specific scrollbar component.

<ng-scrollbar [scrollAuditTime]="20">
  <!-- ...content... -->
</ng-scrollbar>

Example:

Set the option for all custom scrollbars using the global options.

import { NgScrollbarModule, NG_SCROLLBAR_OPTIONS } from 'ngx-scrollbar';

@NgModule({
  imports: [
    NgScrollbarModule
  ],
  providers: [
    { 
       provide: NG_SCROLLBAR_OPTIONS,
       useValue: {
          scrollAuditTime: 20
       }
    }
  ]
})

This option is available in ngx-scrollbar >= v7.1.0

Regarding the auto-height and auto-width features

When any of these features is turned on, the scrollbar will re-calculate when the component size or the content size change

So if the scrollbar is used with other libraries that frequently change the content or the component size, it could cause a performance issue, therefore, you should turned them off.

For example when using it is being used with a virtual scroll library.