@recaptime-dev's working patches + fork for Phorge, a community fork of Phabricator. (Upstream dev and stable branches are at upstream/main and upstream/stable respectively.)
hq.recaptime.dev/wiki/Phorge
phorge
phabricator
Load blame in Diffusion by AJAX
Summary:
I have blame enabled by default and displaying files with long history takes easily over 10 seconds.
Load the blame data by AJAX instead.
This is actually doing more work and the total response time is longer but it's worth it for me as I am interested just in the file contents quite often.
I know you were talking about building blame cache but until we have it...
I'm not sure if the AJAX loading indicator in bottom right corner is enough to inform the user that we are loading it on background.
Test Plan:
?view=highlighted
?view=plainblame
?view=blame
Reviewers: epriestley
Reviewed By: epriestley
CC: aran, Korvin
Differential Revision: https://secure.phabricator.com/D5244
+102
-46
+1
scripts/celerity_mapper.php
+1
scripts/celerity_mapper.php
···
136
136
'javelin-behavior-aphront-drag-and-drop-textarea',
137
137
'javelin-behavior-phabricator-object-selector',
138
138
'javelin-behavior-repository-crossreference',
139
+
'javelin-behavior-load-blame',
139
140
140
141
'differential-inline-comment-editor',
141
142
'javelin-behavior-differential-dropdown-menus',
+40
-26
src/__celerity_resource_map__.php
+40
-26
src/__celerity_resource_map__.php
···
928
928
),
929
929
'diffusion-source-css' =>
930
930
array(
931
-
'uri' => '/res/6a28b429/rsrc/css/application/diffusion/diffusion-source.css',
931
+
'uri' => '/res/e76bcd50/rsrc/css/application/diffusion/diffusion-source.css',
932
932
'type' => 'css',
933
933
'requires' =>
934
934
array(
···
1581
1581
2 => 'javelin-vector',
1582
1582
),
1583
1583
'disk' => '/rsrc/js/application/maniphest/behavior-line-chart.js',
1584
+
),
1585
+
'javelin-behavior-load-blame' =>
1586
+
array(
1587
+
'uri' => '/res/138e2961/rsrc/js/application/diffusion/behavior-load-blame.js',
1588
+
'type' => 'js',
1589
+
'requires' =>
1590
+
array(
1591
+
0 => 'javelin-behavior',
1592
+
1 => 'javelin-dom',
1593
+
2 => 'javelin-request',
1594
+
),
1595
+
'disk' => '/rsrc/js/application/diffusion/behavior-load-blame.js',
1584
1596
),
1585
1597
'javelin-behavior-maniphest-batch-editor' =>
1586
1598
array(
···
3601
3613
'uri' => '/res/pkg/8aaacd1b/differential.pkg.css',
3602
3614
'type' => 'css',
3603
3615
),
3604
-
'd2447f72' =>
3616
+
'322728f3' =>
3605
3617
array(
3606
3618
'name' => 'differential.pkg.js',
3607
3619
'symbols' =>
···
3621
3633
12 => 'javelin-behavior-aphront-drag-and-drop-textarea',
3622
3634
13 => 'javelin-behavior-phabricator-object-selector',
3623
3635
14 => 'javelin-behavior-repository-crossreference',
3624
-
15 => 'differential-inline-comment-editor',
3625
-
16 => 'javelin-behavior-differential-dropdown-menus',
3626
-
17 => 'javelin-behavior-differential-toggle-files',
3627
-
18 => 'javelin-behavior-differential-user-select',
3636
+
15 => 'javelin-behavior-load-blame',
3637
+
16 => 'differential-inline-comment-editor',
3638
+
17 => 'javelin-behavior-differential-dropdown-menus',
3639
+
18 => 'javelin-behavior-differential-toggle-files',
3640
+
19 => 'javelin-behavior-differential-user-select',
3628
3641
),
3629
-
'uri' => '/res/pkg/d2447f72/differential.pkg.js',
3642
+
'uri' => '/res/pkg/322728f3/differential.pkg.js',
3630
3643
'type' => 'js',
3631
3644
),
3632
3645
'c8ce2d88' =>
···
3724
3737
'aphront-typeahead-control-css' => '09aa1f68',
3725
3738
'differential-changeset-view-css' => '8aaacd1b',
3726
3739
'differential-core-view-css' => '8aaacd1b',
3727
-
'differential-inline-comment-editor' => 'd2447f72',
3740
+
'differential-inline-comment-editor' => '322728f3',
3728
3741
'differential-local-commits-view-css' => '8aaacd1b',
3729
3742
'differential-results-table-css' => '8aaacd1b',
3730
3743
'differential-revision-add-comment-css' => '8aaacd1b',
···
3742
3755
'javelin-behavior-aphlict-dropdown' => 'f24c209c',
3743
3756
'javelin-behavior-aphlict-listen' => 'f24c209c',
3744
3757
'javelin-behavior-aphront-basic-tokenizer' => 'f24c209c',
3745
-
'javelin-behavior-aphront-drag-and-drop' => 'd2447f72',
3746
-
'javelin-behavior-aphront-drag-and-drop-textarea' => 'd2447f72',
3758
+
'javelin-behavior-aphront-drag-and-drop' => '322728f3',
3759
+
'javelin-behavior-aphront-drag-and-drop-textarea' => '322728f3',
3747
3760
'javelin-behavior-aphront-form-disable-on-submit' => 'f24c209c',
3748
3761
'javelin-behavior-audit-preview' => 'f96657b8',
3749
3762
'javelin-behavior-dark-console' => 'dca4a03d',
3750
3763
'javelin-behavior-device' => 'f24c209c',
3751
-
'javelin-behavior-differential-accept-with-errors' => 'd2447f72',
3752
-
'javelin-behavior-differential-add-reviewers-and-ccs' => 'd2447f72',
3753
-
'javelin-behavior-differential-comment-jump' => 'd2447f72',
3754
-
'javelin-behavior-differential-diff-radios' => 'd2447f72',
3755
-
'javelin-behavior-differential-dropdown-menus' => 'd2447f72',
3756
-
'javelin-behavior-differential-edit-inline-comments' => 'd2447f72',
3757
-
'javelin-behavior-differential-feedback-preview' => 'd2447f72',
3758
-
'javelin-behavior-differential-keyboard-navigation' => 'd2447f72',
3759
-
'javelin-behavior-differential-populate' => 'd2447f72',
3760
-
'javelin-behavior-differential-show-more' => 'd2447f72',
3761
-
'javelin-behavior-differential-toggle-files' => 'd2447f72',
3762
-
'javelin-behavior-differential-user-select' => 'd2447f72',
3764
+
'javelin-behavior-differential-accept-with-errors' => '322728f3',
3765
+
'javelin-behavior-differential-add-reviewers-and-ccs' => '322728f3',
3766
+
'javelin-behavior-differential-comment-jump' => '322728f3',
3767
+
'javelin-behavior-differential-diff-radios' => '322728f3',
3768
+
'javelin-behavior-differential-dropdown-menus' => '322728f3',
3769
+
'javelin-behavior-differential-edit-inline-comments' => '322728f3',
3770
+
'javelin-behavior-differential-feedback-preview' => '322728f3',
3771
+
'javelin-behavior-differential-keyboard-navigation' => '322728f3',
3772
+
'javelin-behavior-differential-populate' => '322728f3',
3773
+
'javelin-behavior-differential-show-more' => '322728f3',
3774
+
'javelin-behavior-differential-toggle-files' => '322728f3',
3775
+
'javelin-behavior-differential-user-select' => '322728f3',
3763
3776
'javelin-behavior-diffusion-commit-graph' => 'f96657b8',
3764
3777
'javelin-behavior-diffusion-pull-lastmodified' => 'f96657b8',
3765
3778
'javelin-behavior-error-log' => 'dca4a03d',
···
3767
3780
'javelin-behavior-history-install' => 'f24c209c',
3768
3781
'javelin-behavior-konami' => 'f24c209c',
3769
3782
'javelin-behavior-lightbox-attachments' => 'f24c209c',
3783
+
'javelin-behavior-load-blame' => '322728f3',
3770
3784
'javelin-behavior-maniphest-batch-selector' => '7707de41',
3771
3785
'javelin-behavior-maniphest-subpriority-editor' => '7707de41',
3772
3786
'javelin-behavior-maniphest-transaction-controls' => '7707de41',
···
3776
3790
'javelin-behavior-phabricator-autofocus' => 'f24c209c',
3777
3791
'javelin-behavior-phabricator-keyboard-shortcuts' => 'f24c209c',
3778
3792
'javelin-behavior-phabricator-nav' => 'f24c209c',
3779
-
'javelin-behavior-phabricator-object-selector' => 'd2447f72',
3793
+
'javelin-behavior-phabricator-object-selector' => '322728f3',
3780
3794
'javelin-behavior-phabricator-oncopy' => 'f24c209c',
3781
3795
'javelin-behavior-phabricator-remarkup-assist' => 'f24c209c',
3782
3796
'javelin-behavior-phabricator-reveal-content' => 'f24c209c',
···
3784
3798
'javelin-behavior-phabricator-tooltips' => 'f24c209c',
3785
3799
'javelin-behavior-phabricator-watch-anchor' => 'f24c209c',
3786
3800
'javelin-behavior-refresh-csrf' => 'f24c209c',
3787
-
'javelin-behavior-repository-crossreference' => 'd2447f72',
3801
+
'javelin-behavior-repository-crossreference' => '322728f3',
3788
3802
'javelin-behavior-toggle-class' => 'f24c209c',
3789
3803
'javelin-behavior-workflow' => 'f24c209c',
3790
3804
'javelin-dom' => 'cd1d650a',
···
3814
3828
'phabricator-core-css' => '09aa1f68',
3815
3829
'phabricator-crumbs-view-css' => '09aa1f68',
3816
3830
'phabricator-directory-css' => '09aa1f68',
3817
-
'phabricator-drag-and-drop-file-upload' => 'd2447f72',
3831
+
'phabricator-drag-and-drop-file-upload' => '322728f3',
3818
3832
'phabricator-dropdown-menu' => 'f24c209c',
3819
3833
'phabricator-file-upload' => 'f24c209c',
3820
3834
'phabricator-filetree-view-css' => '09aa1f68',
···
3836
3850
'phabricator-prefab' => 'f24c209c',
3837
3851
'phabricator-project-tag-css' => 'e30a3fa8',
3838
3852
'phabricator-remarkup-css' => '09aa1f68',
3839
-
'phabricator-shaped-request' => 'd2447f72',
3853
+
'phabricator-shaped-request' => '322728f3',
3840
3854
'phabricator-side-menu-view-css' => '09aa1f68',
3841
3855
'phabricator-standard-page-view' => '09aa1f68',
3842
3856
'phabricator-textareautils' => 'f24c209c',
+35
-20
src/applications/diffusion/controller/DiffusionBrowseFileController.php
+35
-20
src/applications/diffusion/controller/DiffusionBrowseFileController.php
···
35
35
->setURI($request->getRequestURI()->alter('view', $selected));
36
36
}
37
37
38
-
$needs_blame = ($selected == 'blame' || $selected == 'plainblame');
38
+
$needs_blame = ($selected == 'plainblame');
39
+
if ($selected == 'blame' && $request->isAjax()) {
40
+
$needs_blame = true;
41
+
}
39
42
40
43
$file_query = DiffusionFileContentQuery::newFromDiffusionRequest(
41
44
$this->diffusionRequest);
···
58
61
$drequest,
59
62
$path,
60
63
$data);
64
+
65
+
if ($request->isAjax()) {
66
+
return id(new AphrontAjaxResponse())->setContent($corpus);
67
+
}
61
68
62
69
require_celerity_resource('diffusion-source-css');
63
70
···
229
236
$rows = $this->buildDisplayRows($text_list, $rev_list, $blame_dict,
230
237
$needs_blame, $drequest, $file_query, $selected);
231
238
239
+
$corpus_table = javelin_tag(
240
+
'table',
241
+
array(
242
+
'class' => "diffusion-source remarkup-code PhabricatorMonospaced",
243
+
'sigil' => 'diffusion-source',
244
+
),
245
+
$rows);
246
+
247
+
if ($this->getRequest()->isAjax()) {
248
+
return $corpus_table;
249
+
}
250
+
232
251
$id = celerity_generate_unique_node_id();
233
252
234
253
$projects = $drequest->loadArcanistProjects();
···
260
279
));
261
280
}
262
281
263
-
$corpus_table = javelin_tag(
264
-
'table',
265
-
array(
266
-
'class' => "diffusion-source remarkup-code PhabricatorMonospaced",
267
-
'sigil' => 'diffusion-source',
268
-
),
269
-
$rows);
270
-
271
282
$corpus = phutil_tag(
272
283
'div',
273
284
array(
···
275
286
'id' => $id,
276
287
),
277
288
$corpus_table);
289
+
290
+
Javelin::initBehavior('load-blame', array('id' => $id));
278
291
279
292
break;
280
293
}
···
449
462
$color = null;
450
463
foreach ($text_list as $k => $line) {
451
464
$display_line = array(
452
-
'color' => null,
453
465
'epoch' => null,
454
466
'commit' => null,
455
467
'author' => null,
···
459
471
'data' => $line,
460
472
);
461
473
462
-
if ($needs_blame) {
474
+
if ($selected == 'blame') {
463
475
// If the line's rev is same as the line above, show empty content
464
476
// with same color; otherwise generate blame info. The newer a change
465
477
// is, the more saturated the color.
···
568
580
569
581
$rows = $this->renderInlines(
570
582
idx($inlines, 0, array()),
571
-
$needs_blame,
583
+
($selected == 'blame'),
572
584
$engine);
573
585
574
586
foreach ($display as $line) {
···
581
593
));
582
594
583
595
$blame = array();
584
-
if ($line['color']) {
585
-
$color = $line['color'];
596
+
$style = null;
597
+
if (array_key_exists('color', $line)) {
598
+
if ($line['color']) {
599
+
$style = 'background: '.$line['color'].';';
600
+
}
586
601
587
602
$before_link = null;
588
603
$commit_link = null;
···
667
682
'th',
668
683
array(
669
684
'class' => 'diffusion-blame-link',
670
-
'style' => 'background: '.$color,
685
+
'style' => $style,
671
686
),
672
687
$before_link);
673
688
···
675
690
'th',
676
691
array(
677
692
'class' => 'diffusion-rev-link',
678
-
'style' => 'background: '.$color,
693
+
'style' => $style,
679
694
),
680
695
$commit_link);
681
696
···
683
698
'th',
684
699
array(
685
700
'class' => 'diffusion-rev-link',
686
-
'style' => 'background: '.$color,
701
+
'style' => $style,
687
702
),
688
703
$revision_link);
689
704
···
691
706
'th',
692
707
array(
693
708
'class' => 'diffusion-author-link',
694
-
'style' => 'background: '.$color,
709
+
'style' => $style,
695
710
),
696
711
idx($line, 'author'));
697
712
}
···
708
723
array(
709
724
'class' => 'diffusion-line-link',
710
725
'sigil' => 'diffusion-line-link',
711
-
'style' => isset($color) ? 'background: '.$color : null,
726
+
'style' => $style,
712
727
),
713
728
$line_link);
714
729
···
753
768
754
769
$rows = array_merge($rows, $this->renderInlines(
755
770
idx($inlines, $line['line'], array()),
756
-
$needs_blame,
771
+
($selected == 'blame'),
757
772
$engine));
758
773
}
759
774
+12
webroot/rsrc/css/application/diffusion/diffusion-source.css
+12
webroot/rsrc/css/application/diffusion/diffusion-source.css
···
45
45
white-space: nowrap;
46
46
}
47
47
48
+
.diffusion-blame-link {
49
+
min-width: 25px;
50
+
}
51
+
52
+
.diffusion-rev-link {
53
+
min-width: 90px;
54
+
}
55
+
56
+
.diffusion-author-link {
57
+
min-width: 120px;
58
+
}
59
+
48
60
.diffusion-blame-link a,
49
61
.diffusion-rev-link a,
50
62
.diffusion-author-link a,
+14
webroot/rsrc/js/application/diffusion/behavior-load-blame.js
+14
webroot/rsrc/js/application/diffusion/behavior-load-blame.js
···
1
+
/**
2
+
* @provides javelin-behavior-load-blame
3
+
* @requires javelin-behavior
4
+
* javelin-dom
5
+
* javelin-request
6
+
*/
7
+
8
+
JX.behavior('load-blame', function(config) {
9
+
10
+
new JX.Request(location.href, function (response) {
11
+
JX.DOM.setContent(JX.$(config.id), JX.$H(response));
12
+
}).send();
13
+
14
+
});