refactor: extract asset type determination logic into util module

This commit is contained in:
Ryuya 2025-07-27 21:51:50 -07:00
parent 4aaaf13071
commit c94b2e9a1b
3 changed files with 39 additions and 54 deletions

View File

@ -10,6 +10,7 @@ const RawDataUrlModule = require("../asset/RawDataUrlModule");
const {
getDependencyUsedByExportsCondition
} = require("../optimize/InnerGraph");
const getAssetType = require("../util/assetType");
const makeSerializable = require("../util/makeSerializable");
const memoize = require("../util/memoize");
const ModuleDependency = require("./ModuleDependency");
@ -34,34 +35,6 @@ const getIgnoredRawDataUrlModule = memoize(
() => new RawDataUrlModule("data:,", "ignored-asset", "(ignored asset)")
);
/**
* Determines the 'as' attribute value for prefetch/preload based on file extension
* @param {string} request The module request string
* @returns {string} The 'as' attribute value
*/
const getAssetType = (request) => {
// Reference: MDN rel=preload documentation (https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/rel/preload#what_types_of_content_can_be_preloaded)
// Valid 'as' values: fetch, font, image, script, style, track
if (/\.(png|jpe?g|gif|svg|webp|avif|bmp|ico|tiff?)$/i.test(request)) {
return "image";
} else if (/\.(woff2?|ttf|otf|eot)$/i.test(request)) {
return "font";
} else if (/\.(js|mjs|jsx|ts|tsx)$/i.test(request)) {
return "script";
} else if (/\.css$/i.test(request)) {
return "style";
} else if (/\.vtt$/i.test(request)) {
return "track"; // WebVTT files for video subtitles/captions
} else if (
/\.(mp4|webm|ogg|mp3|wav|flac|aac|m4a|avi|mov|wmv|mkv)$/i.test(request)
) {
// Audio/video files: use 'fetch' as fallback since as='audio'/'video' not supported
// Reference: https://github.com/mdn/browser-compat-data/issues/9577
return "fetch";
}
return "fetch"; // Generic fetch for unknown types
};
class URLDependency extends ModuleDependency {
/**
* @param {string} request request

View File

@ -6,6 +6,7 @@
"use strict";
const RuntimeGlobals = require("../RuntimeGlobals");
const getAssetType = require("../util/assetType");
const AssetPrefetchStartupRuntimeModule = require("./AssetPrefetchStartupRuntimeModule");
/** @typedef {import("../Chunk")} Chunk */
@ -105,8 +106,7 @@ class AssetPrefetchStartupPlugin {
assetUrl = request.split(/[\\/]/).pop() || request;
}
const assetType =
AssetPrefetchStartupPlugin._getAssetType(request);
const assetType = getAssetType(request);
const info = {
url: assetUrl,
as: assetType,
@ -176,30 +176,6 @@ class AssetPrefetchStartupPlugin {
});
});
}
/**
* Determines the 'as' attribute value for prefetch/preload based on file extension
* @param {string} request The module request string
* @returns {string} The 'as' attribute value
*/
static _getAssetType(request) {
if (/\.(png|jpe?g|gif|svg|webp|avif|bmp|ico|tiff?)$/i.test(request)) {
return "image";
} else if (/\.(woff2?|ttf|otf|eot)$/i.test(request)) {
return "font";
} else if (/\.(js|mjs|jsx|ts|tsx)$/i.test(request)) {
return "script";
} else if (/\.css$/i.test(request)) {
return "style";
} else if (/\.vtt$/i.test(request)) {
return "track";
} else if (
/\.(mp4|webm|ogg|mp3|wav|flac|aac|m4a|avi|mov|wmv|mkv)$/i.test(request)
) {
return "fetch";
}
return "fetch";
}
}
module.exports = AssetPrefetchStartupPlugin;

36
lib/util/assetType.js Normal file
View File

@ -0,0 +1,36 @@
/*
MIT License http://www.opensource.org/licenses/mit-license.php
Author Tobias Koppers @sokra
*/
"use strict";
/**
* Determines the 'as' attribute value for prefetch/preload based on file extension
* Reference: MDN rel=preload documentation
* https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/rel/preload#what_types_of_content_can_be_preloaded
* @param {string} request The module request string or filename
* @returns {string} The 'as' attribute value for link element
*/
const getAssetType = (request) => {
if (/\.(png|jpe?g|gif|svg|webp|avif|bmp|ico|tiff?)$/i.test(request)) {
return "image";
} else if (/\.(woff2?|ttf|otf|eot)$/i.test(request)) {
return "font";
} else if (/\.(js|mjs|jsx|ts|tsx)$/i.test(request)) {
return "script";
} else if (/\.css$/i.test(request)) {
return "style";
} else if (/\.vtt$/i.test(request)) {
return "track";
} else if (
/\.(mp4|webm|ogg|mp3|wav|flac|aac|m4a|avi|mov|wmv|mkv)$/i.test(request)
) {
// Audio/video files: use 'fetch' as fallback since as='audio'/'video' not supported
// Reference: https://github.com/mdn/browser-compat-data/issues/9577
return "fetch";
}
return "fetch";
};
module.exports = getAssetType;