perf: reduce Popper updates when placement don't change (#257)

Author: piecyk

.size-snapshot.json

@@ -1,25 +1,25 @@
 {
   "dist/index.umd.js": {
-    "bundled": 49749,
-    "minified": 17751,
-    "gzipped": 5578
+    "bundled": 49677,
+    "minified": 17705,
+    "gzipped": 5564
   },
   "dist/index.umd.min.js": {
-    "bundled": 24376,
-    "minified": 10020,
-    "gzipped": 3347
+    "bundled": 24304,
+    "minified": 9974,
+    "gzipped": 3334
   },
   "dist/index.esm.js": {
-    "bundled": 10105,
-    "minified": 5808,
-    "gzipped": 1838,
+    "bundled": 10033,
+    "minified": 5762,
+    "gzipped": 1825,
     "treeshaked": {
       "rollup": {
-        "code": 4604,
+        "code": 4558,
         "import_statements": 137
       },
       "webpack": {
-        "code": 5725
+        "code": 5679
       }
     }
   }

src/Popper.js

@@ -91,10 +91,7 @@ export class InnerPopper extends React.Component<PopperProps, PopperState> {
     order: 900,
     fn: (data: Object) => {
       const { placement } = data;
-      this.setState(
-        { data, placement },
-        placement !== this.state.placement ? this.scheduleUpdate : undefined
-      );
+      this.setState({ data, placement });
       return data;
     },
   };

src/Popper.test.js

@@ -115,4 +115,22 @@ describe('Popper component', () => {
       virtualReferenceElement
     );
   });
+
+  it(`should render 3 times when placement is changed`, () => {
+    const referenceElement = document.createElement('div');
+    let renderCounter = 0;
+    const wrapper = mount(
+      <InnerPopper placement="top" referenceElement={referenceElement}>
+        {({ ref, style, placement }) => {
+          renderCounter++;
+          return <div ref={ref} style={style} data-placement={placement} />;
+        }}
+      </InnerPopper>
+    );
+    expect(renderCounter).toBe(3);
+    renderCounter = 0;
+
+    wrapper.setProps({ placement: 'bottom' });
+    expect(renderCounter).toBe(3);
+  });
 });