Commit cfedc31b authored by Phil Hughes's avatar Phil Hughes

Improve initial rendering of discussion notes

This improves the initial rendering performance of notes
by only creating a new TaskList for the whole app,
rather than on a per-note component basis.
parent ef58a640
......@@ -128,6 +128,7 @@ export default {
eventHub.$once('fetchedNotesData', this.setDiscussions);
},
methods: {
...mapActions(['startTaskList']),
...mapActions('diffs', [
'setBaseConfig',
'fetchDiffFiles',
......@@ -157,7 +158,13 @@ export default {
if (this.isNotesFetched && !this.assignedDiscussions && !this.isLoading) {
this.assignedDiscussions = true;
requestIdleCallback(() => this.assignDiscussionsToDiff(), { timeout: 1000 });
requestIdleCallback(
() =>
this.assignDiscussionsToDiff()
.then(this.$nextTick)
.then(this.startTaskList),
{ timeout: 1000 },
);
}
},
adjustView() {
......
......@@ -4,7 +4,6 @@ import noteEditedText from './note_edited_text.vue';
import noteAwardsList from './note_awards_list.vue';
import noteAttachment from './note_attachment.vue';
import noteForm from './note_form.vue';
import TaskList from '../../task_list';
import autosave from '../mixins/autosave';
export default {
......@@ -37,14 +36,12 @@ export default {
},
mounted() {
this.renderGFM();
this.initTaskList();
if (this.isEditing) {
this.initAutoSave(this.note);
}
},
updated() {
this.initTaskList();
this.renderGFM();
if (this.isEditing) {
......@@ -59,15 +56,6 @@ export default {
renderGFM() {
$(this.$refs['note-body']).renderGFM();
},
initTaskList() {
if (this.canEdit) {
this.taskList = new TaskList({
dataType: 'note',
fieldName: 'note',
selector: '.notes',
});
}
},
handleFormUpdate(note, parentElement, callback) {
this.$emit('handleFormUpdate', note, parentElement, callback);
},
......
......@@ -46,6 +46,7 @@ export default {
'is-requesting being-posted': this.isRequesting,
'disabled-content': this.isDeleting,
target: this.isTarget,
'is-editable': this.note.current_user.can_edit,
};
},
canResolve() {
......
......@@ -122,6 +122,7 @@ export default {
setTargetNoteHash: 'setTargetNoteHash',
toggleDiscussion: 'toggleDiscussion',
setNotesFetchedState: 'setNotesFetchedState',
startTaskList: 'startTaskList',
}),
getComponentName(discussion) {
if (discussion.isSkeletonNote) {
......@@ -157,6 +158,7 @@ export default {
this.isFetching = false;
})
.then(() => this.$nextTick())
.then(() => this.startTaskList())
.then(() => this.checkLocationHash())
.catch(() => {
this.setLoadingState(false);
......
import Vue from 'vue';
import $ from 'jquery';
import axios from '~/lib/utils/axios_utils';
import Visibility from 'visibilityjs';
import TaskList from '../../task_list';
import Flash from '../../flash';
import Poll from '../../lib/utils/poll';
import * as types from './mutation_types';
......@@ -368,5 +370,13 @@ export const setCommentsDisabled = ({ commit }, data) => {
commit(types.DISABLE_COMMENTS, data);
};
export const startTaskList = ({ dispatch }) =>
new TaskList({
dataType: 'note',
fieldName: 'note',
selector: '.notes .is-editable',
onSuccess: () => Vue.$nextTick(() => dispatch('startTaskList')),
});
// prevent babel-plugin-rewire from generating an invalid default during karma tests
export default () => {};
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment