Defer Last Commit Info (#16467)

One of the biggest reasons for slow repository browsing is that we wait
until last commit information has been generated for all files in the
repository.

This PR proposes deferring this generation to a new POST endpoint that
does the look up outside of the main page request.

Signed-off-by: Andrew Thornton <art27@cantab.net>

2 files changed, 42 insertions, 0 deletions

diff --git a/web_src/js/features/lastcommitloader.js b/web_src/js/features/lastcommitloader.js
new file mode 100644
index 0000000000..964255f229
--- /dev/null
+++ b/web_src/js/features/lastcommitloader.js
@@ -0,0 +1,40 @@
+const {csrf} = window.config;
+
+export async function initLastCommitLoader() {
+  const entryMap = {};
+
+  const entries = $('table#repo-files-table tr.notready')
+    .map((_, v) => {
+      entryMap[$(v).attr('data-entryname')] = $(v);
+      return $(v).attr('data-entryname');
+    })
+    .get();
+
+  if (entries.length === 0) {
+    return;
+  }
+
+  const lastCommitLoaderURL = $('table#repo-files-table').data('lastCommitLoaderUrl');
+
+  if (entries.length > 200) {
+    $.post(lastCommitLoaderURL, {
+      _csrf: csrf,
+    }, (data) => {
+      $('table#repo-files-table').replaceWith(data);
+    });
+    return;
+  }
+
+  $.post(lastCommitLoaderURL, {
+    _csrf: csrf,
+    'f': entries,
+  }, (data) => {
+    $(data).find('tr').each((_, row) => {
+      if (row.className === 'commit-list') {
+        $('table#repo-files-table .commit-list').replaceWith(row);
+        return;
+      }
+      entryMap[$(row).attr('data-entryname')].replaceWith(row);
+    });
+  });
+}
diff --git a/web_src/js/index.js b/web_src/js/index.js
index 4fda303a3c..d6787e89bf 100644
--- a/web_src/js/index.js
+++ b/web_src/js/index.js
@@ -20,6 +20,7 @@ import initTableSort from './features/tablesort.js';
 import {createCodeEditor, createMonaco} from './features/codeeditor.js';
 import {initMarkupAnchors} from './markup/anchors.js';
 import {initNotificationsTable, initNotificationCount} from './features/notification.js';
+import {initLastCommitLoader} from './features/lastcommitloader.js';
 import {initStopwatch} from './features/stopwatch.js';
 import {showLineButton} from './code/linebutton.js';
 import {initMarkupContent, initCommentContent} from './markup/content.js';
@@ -2864,6 +2865,7 @@ $(document).ready(async () => {
   initContextPopups();
   initTableSort();
   initNotificationsTable();
+  initLastCommitLoader();
   initPullRequestMergeInstruction();
   initFileViewToggle();
   initReleaseEditor();