From 7d14d751abaf5a8da4f0502fb50a4437caa3a5b1 Mon Sep 17 00:00:00 2001
From: Elisei Timofte <timofte@unfuddle.com>
Date: Tue, 17 Oct 2017 10:49:43 +0300
Subject: [PATCH] do not render items if the react list is hidden

---
 react-list.es6 | 15 ++++++++++++++-
 react-list.js  | 14 +++++++++++++-
 2 files changed, 27 insertions(+), 2 deletions(-)

diff --git a/react-list.es6 b/react-list.es6
index 7e68f85..3ee951c 100644
--- a/react-list.es6
+++ b/react-list.es6
@@ -204,7 +204,16 @@ module.exports = class ReactList extends Component {
   getStartAndEnd(threshold = this.props.threshold) {
     const scroll = this.getScroll();
     const start = Math.max(0, scroll - threshold);
-    let end = scroll + this.getViewportSize() + threshold;
+
+    const viewportSize = this.getViewportSize()
+
+    // render element only if the viewportSize is greater than 0
+    if(viewportSize > 0){
+      let end = scroll + viewportSize + threshold;
+    } else {
+      let end = 0
+    }
+
     if (this.hasDeterminateSize()) {
       end = Math.min(end, this.getSpaceBefore(this.props.length));
     }
@@ -269,6 +278,10 @@ module.exports = class ReactList extends Component {
 
   updateSimpleFrame(cb) {
     const {end} = this.getStartAndEnd();
+
+    // do not update the frame if there are 0 elements to be rendered
+    if (end === 0) {return cb()}
+
     const itemEls = this.items.children;
     let elEnd = 0;
 
diff --git a/react-list.js b/react-list.js
index 7eff7c1..10a4a08 100644
--- a/react-list.js
+++ b/react-list.js
@@ -289,7 +289,16 @@
 
         var scroll = this.getScroll();
         var start = Math.max(0, scroll - threshold);
-        var end = scroll + this.getViewportSize() + threshold;
+
+        var viewportSize = this.getViewportSize()
+
+        // render element only if the viewportSize is greater than 0
+        if(viewportSize > 0){
+          var end = scroll + viewportSize + threshold;
+        } else {
+          var end = 0
+        }
+
         if (this.hasDeterminateSize()) {
           end = Math.min(end, this.getSpaceBefore(this.props.length));
         }
@@ -364,6 +373,9 @@
         var _getStartAndEnd = this.getStartAndEnd(),
             end = _getStartAndEnd.end;
 
+        // do not update the frame if there are 0 elements to be rendered
+        if(end === 0) {return cb()}
+        
         var itemEls = this.items.children;
         var elEnd = 0;