refactor(core): split web entry from core (#6082)

This pr is trying to split `web` and `electron` entries from `core`. It allows more platform-related optimization to be addressed in each entry.
We should remove all browser/electron only codes from `core` eventually, this is the very first step for that.
This commit is contained in:
LongYinan
2024-03-19 07:48:56 +00:00
parent 26925c96e4
commit 332cd3b380
54 changed files with 963 additions and 800 deletions
@@ -0,0 +1,90 @@
import '@affine/component/theme/global.css';
import '@affine/component/theme/theme.css';
import { AffineContext } from '@affine/component/context';
import { GlobalLoading } from '@affine/component/global-loading';
import { NotificationCenter } from '@affine/component/notification-center';
import { WorkspaceFallback } from '@affine/core/components/workspace';
import { GlobalScopeProvider } from '@affine/core/modules/infra-web/global-scope';
import { CloudSessionProvider } from '@affine/core/providers/session-provider';
import { router } from '@affine/core/router';
import {
performanceLogger,
performanceRenderLogger,
} from '@affine/core/shared';
import createEmotionCache from '@affine/core/utils/create-emotion-cache';
import { configureWebServices } from '@affine/core/web';
import { createI18n, setUpLanguage } from '@affine/i18n';
import { CacheProvider } from '@emotion/react';
import { getCurrentStore } from '@toeverything/infra/atom';
import { ServiceCollection } from '@toeverything/infra/di';
import type { PropsWithChildren, ReactElement } from 'react';
import { lazy, Suspense } from 'react';
import { RouterProvider } from 'react-router-dom';
const performanceI18nLogger = performanceLogger.namespace('i18n');
const cache = createEmotionCache();
const DevTools = lazy(() =>
import('jotai-devtools').then(m => ({ default: m.DevTools }))
);
const DebugProvider = ({ children }: PropsWithChildren): ReactElement => {
return (
<>
<Suspense>{process.env.DEBUG_JOTAI === 'true' && <DevTools />}</Suspense>
{children}
</>
);
};
const future = {
v7_startTransition: true,
} as const;
async function loadLanguage() {
performanceI18nLogger.info('start');
const i18n = createI18n();
document.documentElement.lang = i18n.language;
performanceI18nLogger.info('set up');
await setUpLanguage(i18n);
performanceI18nLogger.info('done');
}
let languageLoadingPromise: Promise<void> | null = null;
const services = new ServiceCollection();
configureWebServices(services);
const serviceProvider = services.provider();
export function App() {
performanceRenderLogger.info('App');
if (!languageLoadingPromise) {
languageLoadingPromise = loadLanguage().catch(console.error);
}
return (
<Suspense>
<GlobalScopeProvider provider={serviceProvider}>
<CacheProvider value={cache}>
<AffineContext store={getCurrentStore()}>
<CloudSessionProvider>
<DebugProvider>
<GlobalLoading />
<NotificationCenter />
<RouterProvider
fallbackElement={<WorkspaceFallback key="RouterFallback" />}
router={router}
future={future}
/>
</DebugProvider>
</CloudSessionProvider>
</AffineContext>
</CacheProvider>
</GlobalScopeProvider>
</Suspense>
);
}
@@ -0,0 +1,43 @@
// Side effect import, "declare global"
import '@affine/env/constant';
import { setup } from '@affine/core/bootstrap/setup';
import { performanceLogger } from '@affine/core/shared';
import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
import { App } from './app';
const performanceMainLogger = performanceLogger.namespace('main');
function main() {
performanceMainLogger.info('start');
// skip bootstrap setup for desktop onboarding
if (window.appInfo?.windowName === 'onboarding') {
performanceMainLogger.info('skip setup');
} else {
performanceMainLogger.info('setup start');
setup();
performanceMainLogger.info('setup done');
}
mountApp();
}
function mountApp() {
performanceMainLogger.info('import app');
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
const root = document.getElementById('app')!;
performanceMainLogger.info('render app');
createRoot(root).render(
<StrictMode>
<App />
</StrictMode>
);
}
try {
main();
} catch (err) {
console.error('Failed to bootstrap app', err);
}
@@ -0,0 +1,29 @@
{
"extends": "../../../../tsconfig.json",
"compilerOptions": {
"composite": true,
"target": "ESNext",
"module": "ESNext",
"resolveJsonModule": true,
"moduleResolution": "Bundler",
"allowSyntheticDefaultImports": true,
"noEmit": false,
"outDir": "../lib",
"allowJs": true
},
"references": [
{
"path": "../../../common/env"
},
{
"path": "../../core"
},
{
"path": "../../component"
},
{
"path": "../../../common/infra"
}
],
"include": ["."]
}