tdsds.com/gitea
1
1
Fork 0
mirror of https://github.com/go-gitea/gitea synced 2025-07-08 03:27:19 +00:00
Code Releases Activity

Refactor global init code and add more comments (#33755)

Browse Source 
Follow up #33748

Now there are 3 "global" functions:

* registerGlobalSelectorFunc: for all elements matching the selector, eg: `.ui.dropdown`
* registerGlobalInitFunc: for `data-global-init="initInputAutoFocusEnd"`
* registerGlobalEventFunc: for `data-global-click="onCommentReactionButtonClick"`


And introduce `initGlobalInput` to replace old `initAutoFocusEnd` and
`attachDirAuto`, use `data-global-init` to replace fragile
`.js-autofocus-end` selector.

Another benefit is that by the new approach, no matter how many times
`registerGlobalInitFunc` is called, we only need to do one
"querySelectorAll" in the last step, it could slightly improve the
performance.
This commit is contained in:
wxiaoguang
2025-03-03 10:57:28 +08:00
committed by GitHub
parent 5cbdf83f70
commit 27bf63ad20
10 changed files with 154 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
web_src/js/index.ts
View File

@ -11,7 +11,6 @@ import {initImageDiff} from './features/imagediff.ts';
import {initRepoMigration} from './features/repo-migration.ts';
import {initRepoProject} from './features/repo-projects.ts';
import {initTableSort} from './features/tablesort.ts';
import {initAutoFocusEnd} from './features/autofocus-end.ts';
import {initAdminUserListSearchForm} from './features/admin/users.ts';
import {initAdminConfigs} from './features/admin/config.ts';
import {initMarkupAnchors} from './markup/anchors.ts';
@ -62,62 +61,23 @@ import {initRepoContributors} from './features/contributors.ts';
import {initRepoCodeFrequency} from './features/code-frequency.ts';
import {initRepoRecentCommits} from './features/recent-commits.ts';
import {initRepoDiffCommitBranchesAndTags} from './features/repo-diff-commit.ts';
import {initAddedElementObserver} from './modules/observer.ts';
import {initGlobalSelectorObserver} from './modules/observer.ts';
import {initRepositorySearch} from './features/repo-search.ts';
import {initColorPickers} from './features/colorpicker.ts';
import {initAdminSelfCheck} from './features/admin/selfcheck.ts';
import {initOAuth2SettingsDisableCheckbox} from './features/oauth2-settings.ts';
import {initGlobalFetchAction} from './features/common-fetch-action.ts';
import {
initFootLanguageMenu,
initGlobalDropdown,
initGlobalTabularMenu,
initHeadNavbarContentToggle,
} from './features/common-page.ts';
import {
initGlobalButtonClickOnEnter,
initGlobalButtons,
initGlobalDeleteButton,
} from './features/common-button.ts';
import {
initGlobalComboMarkdownEditor,
initGlobalEnterQuickSubmit,
initGlobalFormDirtyLeaveConfirm,
} from './features/common-form.ts';
import {initFootLanguageMenu, initGlobalDropdown, initGlobalInput, initGlobalTabularMenu, initHeadNavbarContentToggle} from './features/common-page.ts';
import {initGlobalButtonClickOnEnter, initGlobalButtons, initGlobalDeleteButton} from './features/common-button.ts';
import {initGlobalComboMarkdownEditor, initGlobalEnterQuickSubmit, initGlobalFormDirtyLeaveConfirm} from './features/common-form.ts';
import {callInitFunctions} from './modules/init.ts';
initGiteaFomantic();
initAddedElementObserver();
initSubmitEventPolyfill();
function callInitFunctions(functions: (() => any)[]) {
// Start performance trace by accessing a URL by "https://localhost/?_ui_performance_trace=1" or "https://localhost/?key=value&_ui_performance_trace=1"
// It is a quick check, no side effect so no need to do slow URL parsing.
const initStart = performance.now();
if (window.location.search.includes('_ui_performance_trace=1')) {
let results: {name: string, dur: number}[] = [];
for (const func of functions) {
const start = performance.now();
func();
results.push({name: func.name, dur: performance.now() - start});
}
results = results.sort((a, b) => b.dur - a.dur);
for (let i = 0; i < 20 && i < results.length; i++) {
// eslint-disable-next-line no-console
console.log(`performance trace: ${results[i].name} ${results[i].dur.toFixed(3)}`);
}
} else {
for (const func of functions) {
func();
}
}
const initDur = performance.now() - initStart;
if (initDur > 500) {
console.error(`slow init functions took ${initDur.toFixed(3)}ms`);
}
}
onDomReady(() => {
callInitFunctions([
const initStartTime = performance.now();
const initPerformanceTracer = callInitFunctions([
initGlobalDropdown,
initGlobalTabularMenu,
initGlobalFetchAction,
@ -129,6 +89,7 @@ onDomReady(() => {
initGlobalFormDirtyLeaveConfirm,
initGlobalComboMarkdownEditor,
initGlobalDeleteButton,
initGlobalInput,
initCommonOrganization,
initCommonIssueListQuickGoto,
@ -150,7 +111,6 @@ onDomReady(() => {
initSshKeyFormParser,
initStopwatch,
initTableSort,
initAutoFocusEnd,
initFindFileInRepo,
initCopyContent,
@ -212,4 +172,13 @@ onDomReady(() => {
initOAuth2SettingsDisableCheckbox,
]);
// it must be the last one, then the "querySelectorAll" only needs to be executed once for global init functions.
initGlobalSelectorObserver(initPerformanceTracer);
if (initPerformanceTracer) initPerformanceTracer.printResults();
const initDur = performance.now() - initStartTime;
if (initDur > 500) {
console.error(`slow init functions took ${initDur.toFixed(3)}ms`);
}
});