Set preconnect links to main domains on render (#2354)

Author: jpreynat

src/app/(space)/(content)/layout.tsx

@@ -8,6 +8,8 @@ import { AdminToolbar } from '@/components/AdminToolbar';
 import { CookiesToast } from '@/components/Cookies';
 import { LoadIntegrations } from '@/components/Integrations';
 import { SpaceLayout } from '@/components/SpaceLayout';
+import { api } from '@/lib/api';
+import { assetsDomain } from '@/lib/assets';
 import { buildVersion } from '@/lib/build';
 import { getContentSecurityPolicyNonce } from '@/lib/csp';
 import { absoluteHref, baseUrl } from '@/lib/links';
@@ -39,6 +41,11 @@ export default async function ContentLayout(props: { children: React.ReactNode }
  scripts,
  } = await fetchSpaceData();
 
+ ReactDOM.preconnect(api().endpoint);
+ if (assetsDomain) {
+ ReactDOM.preconnect(assetsDomain);
+ }
+
  scripts.forEach(({ script }) => {
  ReactDOM.preload(script, {
  as: 'script',

src/components/DocumentView/Embed.tsx

@@ -1,5 +1,6 @@
 import * as gitbookAPI from '@gitbook/api';
 import Script from 'next/script';
+import ReactDOM from 'react-dom';
 
 import { Card } from '@/components/primitives';
 import { api } from '@/lib/api';
@@ -11,6 +12,8 @@ import { IntegrationBlock } from './Integration';
 
 export async function Embed(props: BlockProps<gitbookAPI.DocumentBlockEmbed>) {
  const { block, context, ...otherProps } = props;
+ 
+ ReactDOM.preconnect('https://cdn.iframe.ly');
 
  const { data: embed } = await (context.content
  ? api().spaces.getEmbedByUrlInSpace(context.content.spaceId, { url: block.data.url })