How exactly share dependencies works

[nihil-pro]

Hi there
So, we have shared object with a few flags. My question is about eager and singleton
I have a host application that works as a container for other apps, and i share the host application dependencies

// host
const shared = {}
Object.entries(deps).forEach(([key, requiredVersion]) => {
    shared[key] = { requiredVersion }
  }
)
 return shared

Imagine we have four deeps in shell: react: 17.0, react-dom:17.0, mobx: 6 and react-router-dom: 5

Also i have a federated app that used the same dependencies, and also shared them with mf

// app1
const shared = {}
Object.entries(deps).forEach(([key, requiredVersion]) => {
    shared[key] = { requiredVersion }
  }
)
 return shared

This app use shell as remote

remotes: { 'shell': `shell@${shellHost}/remoteEntry.js` }

So now both apps shared four equal dependencies.
Then i run the shell, and inside the shel load dynamic module app1

export function loadScript(scope, module) {
	return async () => {
		try {
			await __webpack_init_sharing__('default')
		} catch (error) {
			loggerService.log('In loadScript, await __webpack_init_sharing__(default): ', error)
		}

		const container = window[scope]

		try {
			await container.init(__webpack_share_scopes__.default)
		} catch(error) {
			loggerService.log('In loadScript, container.init(__webpack_share_scopes__.default): ', error)
		}

		const factory = await window[scope].get(module)
		return factory()
	}
}

What exactly happen? I don't understand.
By trial I found out that if i set eager: true on both side, shell and app1, the google lighthouse shows the best results, but i don't understand why?

When i should use eager? When singleton? In which side, shell or federated module?
I have read the documentation, but it is written there as if everything is clear, but it is not.

Can anybody explain this mechanism?