perf: More selective resource pre-fetching
This commit is contained in:
@@ -32,7 +32,7 @@ import DocumentBreadcrumb from "./DocumentBreadcrumb";
|
|||||||
const LazyLoadedEditor = React.lazy(
|
const LazyLoadedEditor = React.lazy(
|
||||||
() =>
|
() =>
|
||||||
import(
|
import(
|
||||||
/* webpackChunkName: "shared-editor" */
|
/* webpackChunkName: "preload-shared-editor" */
|
||||||
"~/editor"
|
"~/editor"
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -26,7 +26,7 @@ const SettingsRoutes = React.lazy(
|
|||||||
const Document = React.lazy(
|
const Document = React.lazy(
|
||||||
() =>
|
() =>
|
||||||
import(
|
import(
|
||||||
/* webpackChunkName: "document" */
|
/* webpackChunkName: "preload-document" */
|
||||||
"~/scenes/Document"
|
"~/scenes/Document"
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -8,14 +8,14 @@ import { matchDocumentSlug as slug } from "~/utils/routeHelpers";
|
|||||||
const Authenticated = React.lazy(
|
const Authenticated = React.lazy(
|
||||||
() =>
|
() =>
|
||||||
import(
|
import(
|
||||||
/* webpackChunkName: "authenticated" */
|
/* webpackChunkName: "preload-authenticated" */
|
||||||
"~/components/Authenticated"
|
"~/components/Authenticated"
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
const AuthenticatedRoutes = React.lazy(
|
const AuthenticatedRoutes = React.lazy(
|
||||||
() =>
|
() =>
|
||||||
import(
|
import(
|
||||||
/* webpackChunkName: "authenticated-routes" */
|
/* webpackChunkName: "preload-authenticated-routes" */
|
||||||
"./authenticated"
|
"./authenticated"
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -3,7 +3,7 @@ import * as React from "react";
|
|||||||
const MultiplayerEditor = React.lazy(
|
const MultiplayerEditor = React.lazy(
|
||||||
() =>
|
() =>
|
||||||
import(
|
import(
|
||||||
/* webpackChunkName: "multiplayer-editor" */
|
/* webpackChunkName: "preload-multiplayer-editor" */
|
||||||
"./MultiplayerEditor"
|
"./MultiplayerEditor"
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -28,7 +28,6 @@ try {
|
|||||||
// no-op
|
// no-op
|
||||||
}
|
}
|
||||||
|
|
||||||
let index = 0;
|
|
||||||
Object.values(manifestData).forEach((filename) => {
|
Object.values(manifestData).forEach((filename) => {
|
||||||
if (typeof filename !== "string") {
|
if (typeof filename !== "string") {
|
||||||
return;
|
return;
|
||||||
@@ -43,18 +42,11 @@ Object.values(manifestData).forEach((filename) => {
|
|||||||
const shouldPreload =
|
const shouldPreload =
|
||||||
filename.includes("/main") ||
|
filename.includes("/main") ||
|
||||||
filename.includes("/runtime") ||
|
filename.includes("/runtime") ||
|
||||||
filename.includes("/vendors");
|
filename.includes("preload-");
|
||||||
// only prefetch the first few javascript chunks or it gets out of hand fast
|
|
||||||
const shouldPrefetch = ++index <= 6;
|
|
||||||
|
|
||||||
if (shouldPreload || shouldPrefetch) {
|
if (shouldPreload) {
|
||||||
prefetchTags.push(
|
prefetchTags.push(
|
||||||
<link
|
<link rel="preload" href={filename} key={filename} as="script" />
|
||||||
rel={shouldPreload ? "preload" : "prefetch"}
|
|
||||||
href={filename}
|
|
||||||
key={filename}
|
|
||||||
as="script"
|
|
||||||
/>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
} else if (filename.endsWith(".css")) {
|
} else if (filename.endsWith(".css")) {
|
||||||
|
|||||||
Reference in New Issue
Block a user