Silence Progress Events

README.md

@@ -87,6 +87,7 @@ classToggle | string or string[2] | yes | undefined | [link](http://scrollmagic.
 pin | boolean or string | yes | undefined | [link](http://scrollmagic.io/docs/ScrollMagic.Scene.html#setPin)
 pinSettings | PinSettings | yes | undefined | See Types and [link](http://scrollmagic.io/docs/ScrollMagic.Scene.html#setPin)
 enabled | boolean | yes | true | Can be changed on-the-fly
+progressEvents | boolean | yes | true | Ability to silence progress events reducing redraws
 
 ## Types
 

src/Scene.js

@@ -22,6 +22,7 @@ export type SceneProps = {
   loglevel?: number,
   indicators?: boolean,
   enabled?: boolean,
+  progressEvents?: boolean,
 
   /* setClassToggle */
   classToggle?: string | Array<string>,
@@ -197,7 +198,7 @@ class SceneBase extends React.PureComponent<SceneBaseProps, SceneBaseState> {
   }
 
   initEventHandlers() {
-    let { children } = this.props;
+    let { children, progressEvents = true } = this.props;
 
     if (typeof children !== 'function' && !isGSAP(callChildFunction(children, 0, 'init'))) {
       return;
@@ -209,11 +210,13 @@ class SceneBase extends React.PureComponent<SceneBaseProps, SceneBaseState> {
       });
     });
 
-    this.scene.on('progress', (event) => {
-      this.setState({
-        progress: event.progress
+    if(progressEvents){
+      this.scene.on('progress', (event) => {
+        this.setState({
+          progress: event.progress
+        });
       });
-    });
+    }
   }
 
   render() {

src/index.d.ts

@@ -34,6 +34,7 @@ declare module 'react-scrollmagic' {
     loglevel?: number,
     indicators?: boolean,
     enabled?: boolean,
+    progressEvents?: boolean,
 
     /* setClassToggle */
     classToggle?: string | string[],