Inline Script Info and Size Including __NEXT_DATA__
Find all inline scripts and their total size separately from __NEXT_DATA__
serialized JSON inline Script
Snippet
function findInlineScriptsWithNextData() {
const inlineScripts = document.querySelectorAll([
"script:not([async]):not([defer]):not([src])",
]);
console.log(inlineScripts);
console.log(`COUNT: ${inlineScripts.length}`);
const byteSize = {
NEXT_DATA_SIZE: 0,
OTHER_SIZE: 0,
};
function getSize(script) {
const html = script.innerHTML;
return new Blob([html]).size;
}
function convertToKb(bytes) {
return bytes / 1000;
}
for (const script of [...inlineScripts]) {
if (script.id == "__NEXT_DATA__") {
byteSize.NEXT_DATA_SIZE += getSize(script);
} else {
byteSize.OTHER_SIZE += getSize(script);
}
}
return {
NEXT_DATA_SIZE: convertToKb(byteSize.NEXT_DATA_SIZE) + " kb",
OTHER_SIZE: convertToKb(byteSize.OTHER_SIZE) + " kb",
totalByteSize:
convertToKb(byteSize.NEXT_DATA_SIZE) +
convertToKb(byteSize.OTHER_SIZE) +
" kb",
};
}
console.log(findInlineScriptsWithNextData());