From 7682a0220aef1d3c2766e028e1e476086cc6dd88 Mon Sep 17 00:00:00 2001 From: John Furrow Date: Sun, 8 Nov 2015 22:16:24 -0800 Subject: [PATCH] Throttle resize & scroll event handlers --- .../source/scripts/containers/TorrentList.js | 22 +++++++++---------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/client/source/scripts/containers/TorrentList.js b/client/source/scripts/containers/TorrentList.js index 0fe7a2fe..efbe616c 100644 --- a/client/source/scripts/containers/TorrentList.js +++ b/client/source/scripts/containers/TorrentList.js @@ -1,3 +1,4 @@ +import _ from 'lodash'; import { connect } from 'react-redux'; import React from 'react'; import ReactDOM from 'react-dom'; @@ -12,12 +13,11 @@ import uiSelector from '../selectors/uiSelector'; const methodsToBind = [ 'componentDidMount', 'componentWillUnmount', - 'handleScroll', 'handleTorrentClick', - 'handleWindowResize', 'getListPadding', 'getTorrents', 'getViewportLimits', + 'setScrollPosition', 'setViewportHeight', 'shouldComponentUpdate' ]; @@ -44,6 +44,14 @@ class TorrentList extends React.Component { methodsToBind.forEach((method) => { this[method] = this[method].bind(this); }); + + this.handleScroll = _.throttle(this.setScrollPosition, 150, { + leading: true + }); + + this.handleWindowResize = _.throttle(this.setViewportHeight, 350, { + leading: true + }); } componentDidMount() { @@ -86,14 +94,6 @@ class TorrentList extends React.Component { })); } - handleScroll() { - this.setScrollPosition(); - } - - handleWindowResize() { - this.setViewportHeight(); - } - getListPadding(minTorrentIndex, maxTorrentIndex, torrentCount) { if (maxTorrentIndex > torrentCount - 1) { maxTorrentIndex = torrentCount - 1; @@ -113,7 +113,7 @@ class TorrentList extends React.Component { } getViewportLimits() { - let buffer = 3; + let buffer = 10; let elementsInView = Math.floor(this.state.viewportHeight / this.state.torrentHeight);