separated compress CSS and compress HTML options

extension/core/bg/config.js

@@ -29,7 +29,8 @@ singlefile.config = (() => {
 		removeImports: true,
 		removeScripts: true,
 		rawDocument: false,
-		compress: true,
+		compressHTML: true,
+		compressCSS: true,
 		lazyLoadImages: true,
 		appendSaveDate: true,
 		confirmFilename: false,
@@ -59,8 +60,12 @@ singlefile.config = (() => {
 		if (config.removeScripts === undefined) {
 			config.removeScripts = true;
 		}
-		if (config.compress === undefined) {
-			config.compress = true;
+		config.compressHTML = config.compressCSS = config.compress;
+		if (config.compressCSS === undefined) {
+			config.compressCSS = true;
+		}
+		if (config.compressHTML === undefined) {
+			config.compressHTML = true;
 		}
 		if (config.lazyLoadImages === undefined) {
 			config.lazyLoadImages = true;

extension/ui/bg/options.js

@@ -29,7 +29,8 @@
 	const removeImportsInput = document.getElementById("removeImportsInput");
 	const removeScriptsInput = document.getElementById("removeScriptsInput");
 	const saveRawPageInput = document.getElementById("saveRawPageInput");
-	const compressInput = document.getElementById("compressInput");
+	const compressHTMLInput = document.getElementById("compressHTMLInput");
+	const compressCSSInput = document.getElementById("compressCSSInput");
 	const lazyLoadImagesInput = document.getElementById("lazyLoadImagesInput");
 	const contextMenuEnabledInput = document.getElementById("contextMenuEnabledInput");
 	const appendSaveDateInput = document.getElementById("appendSaveDateInput");
@@ -55,7 +56,8 @@
 		removeImportsInput.checked = config.removeImports;
 		removeScriptsInput.checked = config.removeScripts;
 		saveRawPageInput.checked = config.saveRawPage;
-		compressInput.checked = config.compress;
+		compressHTMLInput.checked = config.compressHTML;
+		compressCSSInput.checked = config.compressCSS;
 		lazyLoadImagesInput.checked = config.lazyLoadImages;
 		contextMenuEnabledInput.checked = config.contextMenuEnabled;
 		appendSaveDateInput.checked = config.appendSaveDate;
@@ -75,7 +77,8 @@
 			removeImports: removeImportsInput.checked,
 			removeScripts: removeScriptsInput.checked,
 			saveRawPage: saveRawPageInput.checked,
-			compress: compressInput.checked,
+			compressHTML: compressHTMLInput.checked,
+			compressCSS: compressCSSInput.checked,
 			lazyLoadImages: lazyLoadImagesInput.checked,
 			contextMenuEnabled: contextMenuEnabledInput.checked,
 			appendSaveDate: appendSaveDateInput.checked,

extension/ui/pages/help.html

@@ -84,9 +84,16 @@
 					</li>
 
 					<li>
-						<span class="option">compress HTML and CSS</span>
-						<p>Check this option to minify CSS stylesheets and remove all HTML comments, and unneeded spaces or returns. This helps
-							to reduce the size of the file without altering the document.</p>
+						<span class="option">compress HTML</span>
+						<p>Check this option to remove all HTML comments, and unneeded spaces or returns. This helps to reduce the size of the
+							file without altering the document.</p>
+						<p class="notice">It is recommended to
+							<u>check</u> this option</p>
+					</li>
+
+					<li>
+						<span class="option">compress CSS</span>
+						<p>Check this option to minify CSS stylesheets. This helps to reduce the size of the file without altering the document.</p>
 						<p class="notice">It is recommended to
 							<u>check</u> this option</p>
 					</li>

extension/ui/pages/options.html

@@ -35,8 +35,12 @@
 				<input type="checkbox" id="lazyLoadImagesInput">
 			</div>
 			<div class="option">
-				<label for="compressInput">compress HTML and CSS</label>
-				<input type="checkbox" id="compressInput">
+					<label for="compressHTMLInput">compress HTML</label>
+					<input type="checkbox" id="compressHTMLInput">
+				</div>
+				<div class="option">
+					<label for="compressCSSInput">compress CSS</label>
+					<input type="checkbox" id="compressCSSInput">
 			</div>
 			<div class="option">
 				<label for="removeUnusedCSSRulesInput">remove unused CSS rules</label>

lib/single-file/single-file-core.js

@@ -96,7 +96,7 @@ this.SingleFileCore = (() => {
 			}
 			this.processor.removeDiscardedResources();
 			this.processor.resetCharsetMeta();
-			if (this.options.compress) {
+			if (this.options.compressHTML) {
 				this.processor.compressHTML();
 			}
 			if (this.options.insertFaviconLink) {
@@ -354,7 +354,7 @@ this.SingleFileCore = (() => {
 				if (style.sheet) {
 					DomProcessorHelper.processRules(this.doc, style.sheet.cssRules, cssRules);
 					const stylesheetContent = cssRules.join("");
-					style.textContent = this.options.compress ? this.dom.uglifycss(stylesheetContent) : stylesheetContent;
+					style.textContent = this.options.compressCSS ? this.dom.uglifycss(stylesheetContent) : stylesheetContent;
 				}
 			});
 		}
@@ -437,7 +437,7 @@ this.SingleFileCore = (() => {
 		async inlineStylesheets(initialization) {
 			await Promise.all(Array.from(this.doc.querySelectorAll("style")).map(async styleElement => {
 				const stylesheetContent = initialization ? await DomProcessorHelper.resolveImportURLs(styleElement.textContent, this.baseURI, { maxResourceSize: this.options.maxResourceSize, maxResourceSizeEnabled: this.options.maxResourceSizeEnabled }) : await DomProcessorHelper.processStylesheet(styleElement.textContent, this.baseURI);
-				styleElement.textContent = this.options.compress && !this.options.removeUnusedCSSRules ? this.dom.uglifycss(stylesheetContent) : stylesheetContent;
+				styleElement.textContent = this.options.compressCSS && !this.options.removeUnusedCSSRules ? this.dom.uglifycss(stylesheetContent) : stylesheetContent;
 			}));
 		}
 
@@ -528,7 +528,7 @@ this.SingleFileCore = (() => {
 			await Promise.all(Array.from(this.doc.querySelectorAll("link[rel*=stylesheet]")).map(async linkElement => {
 				const stylesheetContent = await DomProcessorHelper.resolveLinkStylesheetURLs(linkElement.href, this.baseURI, linkElement.media, { maxResourceSize: this.options.maxResourceSize, maxResourceSizeEnabled: this.options.maxResourceSizeEnabled });
 				const styleElement = this.doc.createElement("style");
-				styleElement.textContent = this.options.compress && !this.options.removeUnusedCSSRules ? this.dom.uglifycss(stylesheetContent) : stylesheetContent;
+				styleElement.textContent = this.options.compressCSS && !this.options.removeUnusedCSSRules ? this.dom.uglifycss(stylesheetContent) : stylesheetContent;
 				linkElement.parentElement.replaceChild(styleElement, linkElement);
 			}));
 		}