From 4421c8ede7e03fba4b4fdc44eb87ca3f3842f46d Mon Sep 17 00:00:00 2001 From: Wu Cheng-Han Date: Sun, 18 Sep 2016 16:22:50 +0800 Subject: Improve authorship markers update performance and use CodeMirror built-in operation queue to avoid making DOM busy --- public/js/index.js | 73 +++++++++++++++++++++++++++++------------------------- 1 file changed, 39 insertions(+), 34 deletions(-) diff --git a/public/js/index.js b/public/js/index.js index ac171522..d5678f56 100644 --- a/public/js/index.js +++ b/public/js/index.js @@ -2138,6 +2138,8 @@ socket.on('version', function (data) { var authors = []; var authorship = []; var authorshipMarks = {}; +var authorMarks = {}; // temp variable +var addTextMarkers = []; // temp variable function updateLastInfo(data) { //console.log(data); if (data.hasOwnProperty('createtime') && createtime !== data.createtime) { @@ -2161,7 +2163,9 @@ function updateLastInfo(data) { updateAuthorship(); } } -var updateAuthorship = _.throttle(updateAuthorshipInner, 50); +var updateAuthorship = _.throttle(function () { + editor.operation(updateAuthorshipInner); +}, 50); function initMark() { return { gutter: { @@ -2200,7 +2204,7 @@ var addStyleRule = (function () { function updateAuthorshipInner() { // ignore when ot not synced yet if (Object.keys(cmClient.state).length > 0) return; - var authorMarks = {}; + authorMarks = {}; for (var i = 0; i < authorship.length; i++) { var atom = authorship[i]; var author = authors[atom[0]]; @@ -2269,38 +2273,8 @@ function updateAuthorshipInner() { } } } - var addTextMarkers = []; - editor.eachLine(function (line) { - var lineNumber = editor.getLineNumber(line); - var currMark = authorMarks[lineNumber]; - var author = currMark ? authors[currMark.gutter.userid] : null; - if (currMark && author) { - var className = 'authorship-gutter-' + author.color.substr(1); - var gutters = editor.getLineHandle(lineNumber).gutterMarkers; - if (!gutters || !gutters['authorship-gutters'] || - !gutters['authorship-gutters'].className || - !gutters['authorship-gutters'].className.indexOf(className) < 0) { - var styleString = gutterStylePrefix + author.color + gutterStylePostfix; - var rule = "." + className + "{" + styleString + "}"; - addStyleRule(rule); - var gutter = $('