github-mirror/framework
github-mirror/framework
2
0
Fork 0
mirror of https://github.com/flarum/framework.git synced 2025-04-25 14:14:03 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

Prevent expensive redrawing in the discussion list

Browse Source
This commit is contained in:
Toby Zerner 2015-05-07 09:19:57 +09:30
parent fe9f195cbb
commit 22fe84bb45
2 changed files with 24 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
framework/core/js/forum/src/components/discussion-list.js
View File

@ -8,6 +8,7 @@ import ActionButton from 'flarum/components/action-button';
import DropdownButton from 'flarum/components/dropdown-button'; import DropdownButton from 'flarum/components/dropdown-button';
import LoadingIndicator from 'flarum/components/loading-indicator'; import LoadingIndicator from 'flarum/components/loading-indicator';
import TerminalPost from 'flarum/components/terminal-post'; import TerminalPost from 'flarum/components/terminal-post';
import SubtreeRetainer from 'flarum/utils/subtree-retainer';
export default class DiscussionList extends Component { export default class DiscussionList extends Component {
constructor(props) { constructor(props) {
@ -17,11 +18,25 @@ export default class DiscussionList extends Component {
this.moreResults = m.prop(false); this.moreResults = m.prop(false);
this.discussions = m.prop([]); this.discussions = m.prop([]);
this.willRedraw();
this.refresh(); this.refresh();
app.session.on('loggedIn', this.loggedInHandler = this.refresh.bind(this)) app.session.on('loggedIn', this.loggedInHandler = this.refresh.bind(this))
} }
willRedraw() {
this.subtrees = [];
this.addSubtrees(this.discussions());
}
addSubtrees(discussions) {
discussions.forEach(discussion => {
this.subtrees[discussion.id()] = new SubtreeRetainer(
() => discussion.freshness
)
});
}
params() { params() {
var params = {}; var params = {};
for (var i in this.props.params) { for (var i in this.props.params) {
@ -75,6 +90,7 @@ export default class DiscussionList extends Component {
parseResults(results) { parseResults(results) {
m.startComputation(); m.startComputation();
this.loading(false); this.loading(false);
this.addSubtrees(results);
[].push.apply(this.discussions(), results); [].push.apply(this.discussions(), results);
this.moreResults(!!results.payload.links.next); this.moreResults(!!results.payload.links.next);
m.endComputation(); m.endComputation();
@ -109,7 +125,8 @@ export default class DiscussionList extends Component {
var discussionRoute = app.route('discussion', { id: discussion.id(), slug: discussion.slug() }); var discussionRoute = app.route('discussion', { id: discussion.id(), slug: discussion.slug() });
var active = m.route().substr(0, discussionRoute.length) === discussionRoute; var active = m.route().substr(0, discussionRoute.length) === discussionRoute;
return m('li.discussion-summary'+(isUnread ? '.unread' : '')+(active ? '.active' : ''), {key: discussion.id()}, [ var subtree = this.subtrees[discussion.id()];
return m('li.discussion-summary'+(isUnread ? '.unread' : '')+(active ? '.active' : ''), {key: discussion.id()}, subtree.retain() || m('div', [
controls.length ? DropdownButton.component({ controls.length ? DropdownButton.component({
items: controls, items: controls,
className: 'contextual-controls', className: 'contextual-controls',
@ -135,7 +152,7 @@ export default class DiscussionList extends Component {
abbreviateNumber(discussion[displayUnread ? 'unreadCount' : 'repliesCount']()), abbreviateNumber(discussion[displayUnread ? 'unreadCount' : 'repliesCount']()),
m('span.label', displayUnread ? 'unread' : 'replies') m('span.label', displayUnread ? 'unread' : 'replies')
]) ])
]) ]))
}) })
]), ]),
this.loading() this.loading()

5
framework/core/js/forum/src/components/index-page.js
View File

@ -21,6 +21,7 @@ export default class IndexPage extends Component {
var params = this.params(); var params = this.params();
if (app.cache.discussionList) { if (app.cache.discussionList) {
app.cache.discussionList.willRedraw();
Object.keys(params).some(key => { Object.keys(params).some(key => {
if (app.cache.discussionList.props.params[key] !== params[key]) { if (app.cache.discussionList.props.params[key] !== params[key]) {
app.cache.discussionList = null; app.cache.discussionList = null;
@ -37,6 +38,10 @@ export default class IndexPage extends Component {
app.composer.minimize(); app.composer.minimize();
} }
onunload() {
app.cache.discussionList.willRedraw();
}
/** /**
Params that stick between filter changes Params that stick between filter changes
*/ */