Performance improvements for initialization

[svenefftinge]

What it does

Avoid some heavy scripting during loading.

1. avoid monaco contribution calling expensive getPreferences repeatedly on many small changes during loading.
2. avoid constructing many URIs unnecessarily.

The main change is that I have replaced taking copies of preferences and keeping them in-sync with using a proxy that directly uses the underlying data.

Also this PR cleans up and simplifies the test for the preference-service and preference-proxy.

How to test

Measure performance for scripting during load before and after the change & compare.

Review checklist

• as an author, I have thoroughly tested my changes and carefully followed the review guidelines

Reminder for reviewers

• as a reviewer, I agree to behave in accordance with the review guidelines

[svenefftinge]

• fixing the tests

[vince-fugnitto]

I haven't looked at the code, only did a comparison before and after the change:

Tests (3 Tests / Scenario)

Use Case	Avg Before (sec)	Avg After (sec)	Avg Improvement (sec)	Avg % Improvement
No workspace	1.642	1.514	-0.128 👍	~8% improvement
With workspace (theia + views open) - browser	6.015	3.109	-2.906 👍	~48% improvement
With workspace (theia + views open) - electron	6.418	3.941	-2.477 👍	~39% improvement

Additional Info

I modified the following code on master and this pr to capture the times:

frontend-application.ts

async start(): Promise<void> {
  const start = new Date();
  await this.startContributions();
  this.stateService.state = 'started_contributions';
  
  const host = await this.getHost();
  this.attachShell(host);
  await new Promise(resolve => requestAnimationFrame(() => resolve()));
  this.stateService.state = 'attached_shell';

  await this.initializeLayout();
  this.stateService.state = 'initialized_layout';
  await this.fireOnDidInitializeLayout();

  await this.revealShell(host);
  this.registerEventListeners();
  this.stateService.state = 'ready';
  const end = new Date();
  console.log(`total time till ready: ${(end.getTime() - start.getTime()) / 1000} sec`);
}

[akosyakov]

very cool that we can simplify and speed up configurations, but i am not sure about some changes, please see comments

[svenefftinge]

@vince-fugnitto thanks for the measurements. If you put a bunch of VS code extensions into the mix it becomes even more visible. Also there's lots of scripting going on that is not strictly blocking the frontend startup, but it makes the browser busy for the first seconds.

[akosyakov]

Everything works nicely except getEOL.

[akosyakov]

I wonder whether we can remove updating editor options:

theia/packages/monaco/src/browser/monaco-editor-provider.ts

Lines 158 to 169 in e16d80d

	protected updateMonacoEditorOptions(editor: MonacoEditor, event?: EditorPreferenceChange): void {
	if (event) {
	const preferenceName = event.preferenceName;
	const overrideIdentifier = editor.document.languageId;
	const newValue = this.editorPreferences.get({ preferenceName, overrideIdentifier }, undefined, editor.uri.toString());
	editor.getControl().updateOptions(this.setOption(preferenceName, newValue, this.preferencePrefixes));
	} else {
	const options = this.createMonacoEditorOptions(editor.document);
	delete options.model;
	editor.getControl().updateOptions(options);
	}
	}

Since we hook our preferences into the configuration service, maybe Monaco can react to changes from the configuration service and update editors already without us doing the double work. It could be investigated separately.

[svenefftinge]

Since we hook our preferences into the configuration service, maybe Monaco can react to changes from the configuration service and update editors already without us doing the double work. It could be investigated separately.

I tried and it didn't seem to work. But of course someone could look into it.

[akosyakov]

getEOL works nicely now too!