Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Speed up ungit #1508

Open
wants to merge 42 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
42 commits
Select commit Hold shift + click to select a range
68f7154
Remove isRunning observable to higher level
jung-kim Feb 26, 2022
86b41aa
Optimize isViewable()
jung-kim Feb 26, 2022
0452618
Nodes obj refactors
jung-kim Feb 27, 2022
558c9aa
Name refactor
jung-kim Feb 27, 2022
02b07c1
fix click test
jung-kim Feb 27, 2022
14b309d
Dom optimization for hidden elements
jung-kim Feb 27, 2022
3c4d2ba
Edges to ts and better rate limiting
jung-kim Feb 27, 2022
2195701
lint
jung-kim Feb 28, 2022
a2e0493
Hover to ts
jung-kim Feb 27, 2022
f5c8b9e
git-graph-actions to ts
jung-kim Mar 1, 2022
28db1fa
node to ts
jung-kim Mar 2, 2022
12383c8
git ref to ts
jung-kim Mar 3, 2022
fb46257
More updates
jung-kim Mar 4, 2022
87d8db7
fix tests
jung-kim Mar 4, 2022
b3b6664
Typescriptify
jung-kim Mar 5, 2022
0f3b456
Fix circulr dep
jung-kim Mar 6, 2022
bc77d20
Prepare for abstract-graph
jung-kim Mar 8, 2022
632de77
Finalize abstract graph
jung-kim Mar 9, 2022
841057b
Graph partial pt1
jung-kim Mar 10, 2022
5c5b54a
graph to ts
jung-kim Mar 11, 2022
82f7acd
few more typing
jung-kim Mar 12, 2022
4ac0883
Optimize git nodes' ref calculation
jung-kim Mar 13, 2022
70e1c79
using refsToDisplay
jung-kim Mar 13, 2022
cfb40bf
Simplify _markNodesIdeologicalBranches
jung-kim Mar 13, 2022
5089f02
code cleanup
jung-kim Mar 13, 2022
d239e61
css fixes
jung-kim Mar 13, 2022
5c7e8b0
Fix edges drawing when not ready
jung-kim Mar 13, 2022
8ba0d53
Disable node place adjustments when diff is opened
jung-kim Mar 15, 2022
df68619
Fix lint
jung-kim Mar 15, 2022
793eede
Fix graph height
jung-kim Mar 17, 2022
23355bb
Merge branch 'master' into jk/speed
jung-kim Mar 20, 2022
aa9a06e
Add change log
jung-kim Mar 22, 2022
b93b522
Remove unused updateAnimationFrame
jung-kim Mar 22, 2022
1b076ab
Only draw viewable nodes and edges
jung-kim Mar 23, 2022
41e9214
update changelog
jung-kim Mar 30, 2022
6561e91
Add observable guards
jung-kim Mar 31, 2022
eba600d
Add big repo check
jung-kim Apr 1, 2022
ee6da2e
Fix tests
jung-kim Apr 3, 2022
8429649
dropareaGraphActions to be observable
jung-kim Apr 3, 2022
f37e546
Branch fetch optimization
jung-kim Apr 6, 2022
3fa3d62
Add change log and remove perf monitor code
jung-kim Apr 8, 2022
221c630
Fix graph action staying on after mouseout and few more optimizations
jung-kim Apr 11, 2022
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
fix click test
  • Loading branch information
jung-kim committed Feb 27, 2022
commit 02b07c16d46c104a24eba9ef2243244f930d59e6
2 changes: 1 addition & 1 deletion components/graph/git-ref.js
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,7 @@ class RefViewModel extends Selectable {
moveTo(target, rewindWarnOverride) {
let promise;
if (this.isLocal) {
const toNode = this.graph.nodeViewModel.nodesById[target];
const toNode = this.graph.nodesEdges.nodesById[target];
const args = {
path: this.graph.repoPath(),
name: this.refName,
Expand Down
116 changes: 57 additions & 59 deletions components/graph/graph.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,79 +2,77 @@
<!-- ko template: { name: 'graphGraphics' } -->
<!-- /ko -->

<div data-bind="with: nodesEdges">
<div class="nodes" data-bind="foreach: nodes">
<div class="nodeContainer animation"
data-bind="style: { left: '0px', top: cy() + 'px' }, attr: { 'data-ta-node-title': title }">
<div class="commit-container animation"
data-bind="visible: commitContainerVisible, style: { left: cx() - 620 + 'px' }">
<!-- ko component: commitComponent -->
<!-- /ko -->
</div>
<div class="nodes" data-bind="foreach: nodesEdges.nodes">
<div class="nodeContainer animation"
data-bind="style: { left: '0px', top: cy() + 'px' }, attr: { 'data-ta-node-title': title }">
<div class="commit-container animation"
data-bind="visible: commitContainerVisible, style: { left: cx() - 620 + 'px' }">
<!-- ko component: commitComponent -->
<!-- /ko -->
</div>

<div class="rightSideContainer" data-bind="style: { left: cx() + r() - 433 + 'px' }">
<!-- ko foreach: branchesToDisplay -->
<span class="ref branch" draggable="true" tabIndex="-1"
data-bind="css: { current: current, remote: isRemoteBranch, dragging: isDragging, focused: selected },
<div class="rightSideContainer" data-bind="style: { left: cx() + r() - 433 + 'px' }">
<!-- ko foreach: branchesToDisplay -->
<span class="ref branch" draggable="true" tabIndex="-1"
data-bind="css: { current: current, remote: isRemoteBranch, dragging: isDragging, focused: selected },
html: displayHtml(true),
click: selected,
event: { dblclick: checkout },
dragStart: dragStart, dragEnd: dragEnd, attr: { 'data-ta-name': localRefName, 'data-ta-local': isLocal }">
</span>
<!-- /ko -->
</span>
<!-- /ko -->

<!-- ko foreach: tagsToDisplay -->
<span class="ref tag" draggable="true" tabIndex="0" data-bind="css: { current: current, remote: isRemoteTag, dragging: isDragging, focused: selected },
<!-- ko foreach: tagsToDisplay -->
<span class="ref tag" draggable="true" tabIndex="0" data-bind="css: { current: current, remote: isRemoteTag, dragging: isDragging, focused: selected },
html: displayHtml(true),
click: selected,
event: { dblclick: checkout },
dragStart: dragStart, dragEnd: dragEnd, attr: { 'data-ta-name': localRefName }">
</span>
<!-- /ko -->
</span>
<!-- /ko -->

<!-- ko foreach: dropareaGraphActions -->
<span class="graphAction"
data-bind="css: cssClasses, visible: visible, attr: { 'data-ta-action': style }, event: { mouseover: mouseover, mouseout: mouseout }">
<span data-bind="html: icon"></span>
<span data-bind="text: text"></span>
<div class="dropmask" tabindex="0" role="button"
data-bind="dropOver: visible, drop: doPerform, dragEnter: dragEnter, dragLeave: dragLeave, click: doPerform">
</div>
</span>
<!-- /ko -->
<!-- ko foreach: dropareaGraphActions -->
<span class="graphAction"
data-bind="css: cssClasses, visible: visible, attr: { 'data-ta-action': style }, event: { mouseover: mouseover, mouseout: mouseout }">
<span data-bind="html: icon"></span>
<span data-bind="text: text"></span>
<div class="dropmask" tabindex="0" role="button"
data-bind="dropOver: visible, drop: doPerform, dragEnter: dragEnter, dragLeave: dragLeave, click: doPerform">
</div>
</span>
<!-- /ko -->

<!-- ko if: showNewRefAction -->
<span class="ref-icons new-ref" data-bind="css: { editing: branchingFormVisible }">
<button class="showBranchingForm" type="button"
data-bind="html: $parent.plusIcon, click: showBranchingForm, visible: !branchingFormVisible()"
data-toggle="tooltip" data-placement="bottom" title="Create a branch or tag"></button>
<!-- ko if: branchingFormVisible -->
<form class="form-inline" data-bind="hasfocus2: branchingFormVisible, submit: createBranch">
<input class="name form-control" type="text" aria-label="New branch name"
data-bind="value: newBranchName, hasfocus: newBranchNameHasFocus, valueUpdate: 'afterkeydown'" />
<button class="btn btn-primary" type="submit" data-bind="click: createBranch, enable: canCreateRef">
Branch
</button>
<button class="btn btn-default" type="button" data-bind="click: createTag, enable: canCreateRef">
Tag
</button>
</form>
<!-- /ko -->
</span>
<!-- ko if: showNewRefAction -->
<span class="ref-icons new-ref" data-bind="css: { editing: branchingFormVisible }">
<button class="showBranchingForm" type="button"
data-bind="html: $parent.plusIcon, click: showBranchingForm, visible: !branchingFormVisible()"
data-toggle="tooltip" data-placement="bottom" title="Create a branch or tag"></button>
<!-- ko if: branchingFormVisible -->
<form class="form-inline" data-bind="hasfocus2: branchingFormVisible, submit: createBranch">
<input class="name form-control" type="text" aria-label="New branch name"
data-bind="value: newBranchName, hasfocus: newBranchNameHasFocus, valueUpdate: 'afterkeydown'" />
<button class="btn btn-primary" type="submit" data-bind="click: createBranch, enable: canCreateRef">
Branch
</button>
<button class="btn btn-default" type="button" data-bind="click: createTag, enable: canCreateRef">
Tag
</button>
</form>
<!-- /ko -->
</span>
<!-- /ko -->

<!-- ko if: showRefSearch -->
<span class="ref-icons" data-bind="css: { editing: branchingFormVisible }">
<button class="showSearchForm" type="button"
data-bind="html: $parent.searchIcon, click: showRefSearchForm, visible: !refSearchFormVisible()"
data-toggle="tooltip" data-placement="bottom" title="Search for a branch or tag"></button>
<div class="form-inline branch-search" data-bind="visible: refSearchFormVisible()">
<input class="name form-control" type="search" aria-label="Filter branches and tags"
data-bind="hasfocus: refSearchFormVisible, valueUpdate: 'afterkeyup'" />
</div>
</span>
<!-- /ko -->
</div>
<!-- ko if: showRefSearch -->
<span class="ref-icons" data-bind="css: { editing: branchingFormVisible }">
<button class="showSearchForm" type="button"
data-bind="html: $parent.searchIcon, click: showRefSearchForm, visible: !refSearchFormVisible()"
data-toggle="tooltip" data-placement="bottom" title="Search for a branch or tag"></button>
<div class="form-inline branch-search" data-bind="visible: refSearchFormVisible()">
<input class="name form-control" type="search" aria-label="Filter branches and tags"
data-bind="hasfocus: refSearchFormVisible, valueUpdate: 'afterkeyup'" />
</div>
</span>
<!-- /ko -->
</div>
</div>
</div>
Expand Down
5 changes: 3 additions & 2 deletions components/graph/graph.js
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,6 @@ class GraphViewModel extends ComponentRoot {
true
);
this.commitOpacity = ko.observable(1.0);
this.heighstBranchOrder = 0;
this.hoverGraphActionGraphic = ko.observable();
this.hoverGraphActionGraphic.subscribe(
(value) => {
Expand Down Expand Up @@ -121,7 +120,7 @@ class GraphViewModel extends ComponentRoot {
if (nodes.length > 0) {
this.graphHeight(nodes[nodes.length - 1].cy() + 80);
}
this.graphWidth(1000 + this.heighstBranchOrder * 90);
this.graphWidth(1000 + this.nodesEdges.heighstBranchOrder * 90);
} catch (e) {
this.server.unhandledRejection(e);
} finally {
Expand Down Expand Up @@ -163,6 +162,8 @@ class GraphViewModel extends ComponentRoot {
this.nodesEdges.nodes().forEach((node) => {
node.render();
});
} else if (event.event === 'modal-close-dialog') {
this.isActionRunning(false);
}
}

Expand Down