Ensure hoisted scripts are deduplicated in build (#3433)

* fix(build): ensure hoisted scripts are deduplicated in build

* chore: add changeset
This commit is contained in:
Nate Moore 2022-05-24 14:39:23 -05:00 committed by GitHub
parent 62036eefc8
commit 4ca60e9344
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 41 additions and 10 deletions

View file

@ -0,0 +1,5 @@
---
'astro': patch
---
Fix build issue where hoisted scripts would be duplicated per page

View file

@ -8,8 +8,10 @@ export interface BuildInternals {
// Pure CSS chunks are chunks that only contain CSS.
pureCSSChunks: Set<RenderedChunk>;
// TODO document what this is
// A mapping of hoisted script ids back to the exact hoisted scripts it references
hoistedScriptIdToHoistedMap: Map<string, Set<string>>;
// A mapping of hoisted script ids back to the pages which reference it
hoistedScriptIdToPagesMap: Map<string, Set<string>>;
// A mapping of specifiers like astro/client/idle.js to the hashed bundled name.
// Used to render pages with the correct specifiers.
@ -50,9 +52,13 @@ export function createBuildInternals(): BuildInternals {
// These are for tracking hoisted script bundling
const hoistedScriptIdToHoistedMap = new Map<string, Set<string>>();
// This tracks hoistedScriptId => page components
const hoistedScriptIdToPagesMap = new Map<string, Set<string>>();
return {
pureCSSChunks,
hoistedScriptIdToHoistedMap,
hoistedScriptIdToPagesMap,
entrySpecifierToBundleMap: new Map<string, string>(),
pagesByComponent: new Map(),

View file

@ -38,6 +38,7 @@ export async function staticBuild(opts: StaticBuildOptions) {
// Build internals needed by the CSS plugin
const internals = createBuildInternals();
const uniqueHoistedIds = new Map<string, string>();
const timer: Record<string, number> = {};
@ -76,9 +77,27 @@ export async function staticBuild(opts: StaticBuildOptions) {
// Add hoisted scripts
const hoistedScripts = new Set(metadata.hoistedScriptPaths());
if (hoistedScripts.size) {
const moduleId = npath.posix.join(astroModuleId, 'hoisted.js');
internals.hoistedScriptIdToHoistedMap.set(moduleId, hoistedScripts);
const uniqueHoistedId = JSON.stringify(Array.from(hoistedScripts).sort());
let moduleId: string;
// If we're already tracking this set of hoisted scripts, get the unique id
if (uniqueHoistedIds.has(uniqueHoistedId)) {
moduleId = uniqueHoistedIds.get(uniqueHoistedId)!;
} else {
// Otherwise, create a unique id for this set of hoisted scripts
moduleId = `/astro/hoisted.js?q=${uniqueHoistedIds.size}`;
uniqueHoistedIds.set(uniqueHoistedId, moduleId);
}
topLevelImports.add(moduleId);
// Make sure to track that this page uses this set of hoisted scripts
if (internals.hoistedScriptIdToPagesMap.has(moduleId)) {
const pages = internals.hoistedScriptIdToPagesMap.get(moduleId);
pages!.add(astroModuleId);
} else {
internals.hoistedScriptIdToPagesMap.set(moduleId, new Set([astroModuleId]))
internals.hoistedScriptIdToHoistedMap.set(moduleId, hoistedScripts);
}
}
for (const specifier of topLevelImports) {

View file

@ -5,7 +5,7 @@ import { viteID } from '../util.js';
import { getPageDataByViteID } from './internal.js';
function virtualHoistedEntry(id: string) {
return id.endsWith('.astro/hoisted.js') || id.endsWith('.md/hoisted.js');
return id.startsWith('/astro/hoisted.js?q=');
}
export function vitePluginHoistedScripts(
@ -49,12 +49,13 @@ export function vitePluginHoistedScripts(
virtualHoistedEntry(output.facadeModuleId)
) {
const facadeId = output.facadeModuleId!;
const pathname = facadeId.slice(0, facadeId.length - '/hoisted.js'.length);
const vid = viteID(new URL('.' + pathname, astroConfig.root));
const pageInfo = getPageDataByViteID(internals, vid);
if (pageInfo) {
pageInfo.hoistedScript = id;
const pages = internals.hoistedScriptIdToPagesMap.get(facadeId)!;
for (const pathname of pages) {
const vid = viteID(new URL('.' + pathname, astroConfig.root));
const pageInfo = getPageDataByViteID(internals, vid);
if (pageInfo) {
pageInfo.hoistedScript = id;
}
}
}
}