perf(top): opmization on top load

* Immediate call of top render update
* Always recheck records on top call if top called on p2p first
This commit is contained in:
Alexey Kasyanchuk 2018-08-26 03:13:02 +03:00
parent b5811bb20c
commit 1e09243756

View File

@ -36,32 +36,50 @@ export default class TopPage extends Page {
} }
loadMoreTorrents(type, time) loadMoreTorrents(type, time)
{ {
this.firstUpdate = false
time = time ? time : this.state.time time = time ? time : this.state.time
const page = (this.topTorrents[type] && this.topTorrents[type][time] && this.topTorrents[type][time].page) || 0
window.torrentSocket.emit('topTorrents', window.torrentSocket.emit('topTorrents',
type == 'main' ? null : type, type == 'main' ? null : type,
{index: (this.topTorrents[type] && this.topTorrents[type][time] && this.topTorrents[type][time].length) || 0, time}, {index: page * 20, limit: 20, time},
window.customLoader((data) => { window.customLoader((torrents) => {
if(!this.topTorrents[type]) this.mergeTorrents(torrents, type, time)
this.topTorrents[type] = {} this.topTorrents[type][time].page = page + 1
if(!this.topTorrents[type][time])
this.topTorrents[type][time] = []
if(data && data.length > 0)
{
this.topTorrents[type][time] = this.topTorrents[type][time].concat(data);
this._update()
}
}) })
) )
} }
mergeTorrents(torrents, type, time)
{
if(!this.topTorrents[type])
this.topTorrents[type] = {}
if(!this.topTorrents[type][time])
this.topTorrents[type][time] = {torrents: [], page: 0}
if(!torrents || torrents.length == 0)
return
this.topTorrents[type][time].torrents = _.orderBy(_.unionBy(this.topTorrents[type][time].torrents, torrents, 'hash'), ['seeders'], ['desc'])
if(this.state.type == type && this.state.time == time)
{
this._update();
}
}
_update() _update()
{ {
if(!this.firstUpdate)
{
this.firstUpdate = true
this.forceUpdate()
return
}
if(this.timeForce) if(this.timeForce)
return return
this.timeForce = setTimeout(() => { this.timeForce = setTimeout(() => {
delete this.timeForce delete this.timeForce
this.forceUpdate() this.forceUpdate()
}, 550) }, 700)
} }
componentDidMount() componentDidMount()
{ {
@ -71,13 +89,9 @@ export default class TopPage extends Page {
this.loadMoreTorrents(type) this.loadMoreTorrents(type)
} }
this.remoteTopTorrents = ({torrents, type, time}) => { this.remoteTopTorrents = ({torrents, type, time}) => {
if(!torrents)
return
time = time ? time : 'overall' time = time ? time : 'overall'
type = type ? type : 'main' type = type ? type : 'main'
this.topTorrents[type][time] = _.orderBy(_.unionBy(this.topTorrents[type][time], torrents, 'hash'), ['seeders'], ['desc']) this.mergeTorrents(torrents, type, time)
this._update();
} }
window.torrentSocket.on('remoteTopTorrents', this.remoteTopTorrents); window.torrentSocket.on('remoteTopTorrents', this.remoteTopTorrents);
} }
@ -134,7 +148,7 @@ export default class TopPage extends Page {
> >
{ {
Object.keys(this.times).map((time, index) => { Object.keys(this.times).map((time, index) => {
const torrents = this.topTorrents[type][time]; const {torrents} = this.topTorrents[type][time] || {torrents: undefined};
if(!torrents) if(!torrents)
return ( return (