@thejaredwilcurt/csslop 0.0.47 → 0.0.49

package/src/rules/selectors.js

@@ -33,6 +33,11 @@ const COMPOUND_SELECTOR_BOUNDARIES = '>+~ \t\n\r\f';
  * @return {number}               The index of the next top-level occurrence, or -1 if none remains.
  */
 function findNextFunctionCallOutsideStrings (text, functionCall, start) {
+  // A token that appears nowhere in the selector cannot appear at its top
+  // level either, and one search rules that out without walking every character
+  if (!text.toLowerCase().includes(functionCall)) {
+    return -1;
+  }
   let index = start;
   while (index < text.length) {
     const character = text[index];
@@ -655,6 +660,10 @@ function readWholeSelectorIsParts (selector) {
  * @return {Array}                        An array of one or more processed selector strings.
  */
 function processIsSelector (selector, hasSiblingSelectors) {
+  // Every rewrite below starts from an `:is(`, so a selector without one is left as it is
+  if (!selector.toLowerCase().includes(':is(')) {
+    return [selector];
+  }
   // Replace :is(:link,:visited) and :is(:visited,:link) with :any-link
   selector = selector.replace(/:is\(:link,:visited\)/g, ':any-link');
   selector = selector.replace(/:is\(:visited,:link\)/g, ':any-link');

package/src/rules/stringify.js

@@ -276,6 +276,143 @@ function stringifyAtRule (rule, context) {
   const separator = minifiedPrelude ? ' ' : '';
   return '@' + rule.name + separator + minifiedPrelude + '{' + body + '}';
 }
+
+/**
+ * Rewrites `:nth-*()` pseudo-classes into their shortest equivalent forms.
+ *
+ * @param  {string} selector  A selector with its whitespace already collapsed.
+ * @return {string}           The selector with simplified `:nth-*()` pseudo-classes.
+ */
+function simplifyNthPseudoClasses (selector) {
+  let minified = selector;
+  // Simplify :nth-child(2n+1) to :nth-child(odd)
+  minified = minified.replace(/:nth-child\(2n\s*\+\s*1\)/g, ':nth-child(odd)');
+  // Simplify :nth-child(2n+0) to :nth-child(2n)
+  minified = minified.replace(/:nth-child\(2n\s*\+\s*0\)/g, ':nth-child(2n)');
+  // Simplify :nth-child(1n) to :nth-child(n)
+  minified = minified.replace(/:nth-child\(1n\)/g, ':nth-child(n)');
+  // Remove unnecessary leading + sign from :nth-child()
+  minified = minified.replace(/:nth-child\(\+\s*(\d+)\)/g, ':nth-child($1)');
+  // Simplify :nth-child(0n+N) to :nth-child(N)
+  minified = minified.replace(/:nth-child\(0n\s*\+\s*(\d+)\)/g, ':nth-child($1)');
+  // Replace :nth-child(1) with :first-child
+  minified = minified.replace(/:nth-child\(1\)/g, ':first-child');
+  // Replace :nth-last-child(1) with :last-child
+  minified = minified.replace(/:nth-last-child\(1\)/g, ':last-child');
+  // Replace :nth-of-type(1) with :first-of-type
+  minified = minified.replace(/:nth-of-type\(1\)/g, ':first-of-type');
+  // Replace :nth-last-of-type(1) with :last-of-type
+  minified = minified.replace(/:nth-last-of-type\(1\)/g, ':last-of-type');
+  return minified;
+}
+
+/**
+ * Writes each attribute selector's value quoted or escaped, whichever is
+ * shorter, and removes the whitespace inside its brackets.
+ *
+ * @param  {string} selector  A selector with its whitespace already collapsed.
+ * @return {string}           The selector with minified attribute selectors.
+ */
+function minifyAttributeSelectors (selector) {
+  let minified = selector;
+  // Minify double-quoted attribute selectors: remove inner whitespace and escape when shorter
+  minified = minified.replace(/\[\s*([^=]+)\s*=\s*"(.*?)"\s*\]/g, (match, attribute, value) => {
+    // Escape special characters that require quoting (spaces, #, ., :, /, ;), and compare lengths
+    let escaped = value.replace(/([ #.:/;])/g, '\\$1');
+    if (escaped.length < value.length + 2) {
+      return '[' + attribute + '=' + escaped + ']';
+    }
+    return '[' + attribute + '="' + value + '"]';
+  });
+  // Minify single-quoted attribute selectors: remove inner whitespace and escape when shorter
+  minified = minified.replace(/\[\s*([^=]+)\s*=\s*'(.*?)'\s*\]/g, (match, attribute, value) => {
+    // Escape special characters that require quoting (spaces, #, ., :, /, ;), and compare lengths
+    let escaped = value.replace(/([ #.:/;])/g, '\\$1');
+    if (escaped.length < value.length + 2) {
+      return '[' + attribute + '=' + escaped + ']';
+    }
+    return '[' + attribute + '="' + value + '"]';
+  });
+  // Minify unquoted attribute selectors: quote when unescaping produces a shorter result
+  minified = minified.replace(/\[\s*([^=]+)\s*=\s*([^"'].*?)\s*\]/g, (match, attribute, value) => {
+    // Unescape special characters (spaces, #, ., :, /, ;) and compare with quoted form
+    let unescaped = value.replace(/\\([ #.:/;])/g, '$1');
+    if (unescaped.length + 2 < value.length) {
+      return '[' + attribute + '="' + unescaped + '"]';
+    }
+    return '[' + attribute + '=' + value + ']';
+  });
+  return minified;
+}
+
+/**
+ * Rewrites `:not()` pseudo-classes that negate a pseudo-class with a direct
+ * opposite, such as `:not(:enabled)`, into that opposite.
+ *
+ * @param  {string} selector  A selector with its whitespace already collapsed.
+ * @return {string}           The selector with simplified negations.
+ */
+function simplifyNegatedPseudoClasses (selector) {
+  let minified = selector;
+  // Minify logical combinations
+  // Replace :not(:invalid) with :valid, only directly after a form element type selector
+  minified = minified.replace(/(?<=\b(?:button|fieldset|form|input|select|textarea)):not\(:invalid\)/g, ':valid');
+  // Replace :not(:dir(ltr)) with :dir(rtl)
+  minified = minified.replace(/:not\(:dir\(ltr\)\)/g, ':dir(rtl)');
+  // Replace a double negation, :not(:not(X)), with the X it wraps
+  minified = minified.replace(/:not\(:not\((.*?)\)\)/g, '$1');
+  // Replace :not(:enabled) with :disabled
+  minified = minified.replace(/:not\(:enabled\)/g, ':disabled');
+  // Replace :not(:required) with :optional
+  minified = minified.replace(/:not\(:required\)/g, ':optional');
+  // Match a link element type selector at the start or after a combinator, with any attribute selectors and an optional :where( wrapper, followed by :not(:link)
+  minified = minified.replace(/(^|[\s,>+~])(a|area|link)(?:\[.*?\])*(?::where\()?:not\(:link\)\)?/g, (match) => {
+    return match.replace(':not(:link)', ':visited');
+  });
+  return minified;
+}
+
+/**
+ * Minifies a single selector's spacing, pseudo-classes, pseudo-elements, and
+ * attribute selectors. Most selectors hold none of the patterns a group of
+ * rewrites looks for, so each group only runs when its marker text is present.
+ *
+ * @param  {string} selector  A single selector from a rule's selector list.
+ * @return {string}           The minified selector.
+ */
+function minifySelector (selector) {
+  let minified = unescapeSelector(selector);
+  // Collapse whitespace to single space
+  minified = minified.replace(/\s+/g, ' ');
+  // Strip whitespace around selector combinators and commas
+  minified = minified.replace(/\s*([,>+~])\s*/g, '$1');
+  // Strip whitespace inside parentheses for pseudo-class arguments
+  minified = minified.replace(/\(\s+/g, '(').replace(/\s+\)/g, ')');
+  if (minified.includes(':nth-')) {
+    minified = simplifyNthPseudoClasses(minified);
+  }
+  if (minified.includes('::')) {
+    // Convert double-colon pseudo-elements to single-colon legacy form
+    minified = minified.replace(/::before/g, ':before');
+    minified = minified.replace(/::after/g, ':after');
+  }
+  if (minified.includes('*')) {
+    // Strip redundant universal selector `*` when it precedes an ID, class, or attribute selector
+    minified = minified.replace(/\*([#.[])/g, '$1');
+  }
+  if (minified.includes('[') && minified.includes('=')) {
+    minified = minifyAttributeSelectors(minified);
+  }
+  if (minified.includes(':not(')) {
+    minified = simplifyNegatedPseudoClasses(minified);
+  }
+  // Remove redundant leading "& " nesting selector
+  minified = minified.replace(/^& /, '');
+  minified = mergeAdjacentWherePseudoClasses(minified);
+  minified = minifyLanguageSelector(minified);
+  return minified;
+}
+
 /**
  * Converts a parsed CSS AST rule node into a minified CSS string, dispatching to specialized handlers for each rule type including selectors, `@media`, `@keyframes`, `@layer`, and other at-rules.
  *
@@ -305,82 +442,7 @@ function stringifyRule (rule, context) {
     if (rule.selectors?.length) {
       let uniqueSelectors = [...new Set(rule.selectors)];
       // Minify spacing within selectors (e.g. inside :is(), :where(), etc)
-      uniqueSelectors = uniqueSelectors.map((selector) => {
-        let minified = unescapeSelector(selector);
-        // Collapse whitespace to single space
-        minified = minified.replace(/\s+/g, ' ');
-        // Strip whitespace around selector combinators and commas
-        minified = minified.replace(/\s*([,>+~])\s*/g, '$1');
-        // Strip whitespace inside parentheses for pseudo-class arguments
-        minified = minified.replace(/\(\s+/g, '(').replace(/\s+\)/g, ')');
-        // Simplify :nth-child(2n+1) to :nth-child(odd)
-        minified = minified.replace(/:nth-child\(2n\s*\+\s*1\)/g, ':nth-child(odd)');
-        // Simplify :nth-child(2n+0) to :nth-child(2n)
-        minified = minified.replace(/:nth-child\(2n\s*\+\s*0\)/g, ':nth-child(2n)');
-        // Simplify :nth-child(1n) to :nth-child(n)
-        minified = minified.replace(/:nth-child\(1n\)/g, ':nth-child(n)');
-        // Remove unnecessary leading + sign from :nth-child()
-        minified = minified.replace(/:nth-child\(\+\s*(\d+)\)/g, ':nth-child($1)');
-        // Simplify :nth-child(0n+N) to :nth-child(N)
-        minified = minified.replace(/:nth-child\(0n\s*\+\s*(\d+)\)/g, ':nth-child($1)');
-        // Replace :nth-child(1) with :first-child
-        minified = minified.replace(/:nth-child\(1\)/g, ':first-child');
-        // Replace :nth-last-child(1) with :last-child
-        minified = minified.replace(/:nth-last-child\(1\)/g, ':last-child');
-        // Replace :nth-of-type(1) with :first-of-type
-        minified = minified.replace(/:nth-of-type\(1\)/g, ':first-of-type');
-        // Replace :nth-last-of-type(1) with :last-of-type
-        minified = minified.replace(/:nth-last-of-type\(1\)/g, ':last-of-type');
-        // Convert double-colon pseudo-elements to single-colon legacy form
-        minified = minified.replace(/::before/g, ':before');
-        minified = minified.replace(/::after/g, ':after');
-
-        // Strip redundant universal selector `*` when it precedes an ID, class, or attribute selector
-        minified = minified.replace(/\*([#.[])/g, '$1');
-
-        // Minify double-quoted attribute selectors: remove inner whitespace and escape when shorter
-        minified = minified.replace(/\[\s*([^=]+)\s*=\s*"(.*?)"\s*\]/g, (match, attribute, value) => {
-          // Escape special characters that require quoting (spaces, #, ., :, /, ;), and compare lengths
-          let escaped = value.replace(/([ #.:/;])/g, '\\$1');
-          if (escaped.length < value.length + 2) {
-            return '[' + attribute + '=' + escaped + ']';
-          }
-          return '[' + attribute + '="' + value + '"]';
-        });
-        // Minify single-quoted attribute selectors: remove inner whitespace and escape when shorter
-        minified = minified.replace(/\[\s*([^=]+)\s*=\s*'(.*?)'\s*\]/g, (match, attribute, value) => {
-          // Escape special characters that require quoting (spaces, #, ., :, /, ;), and compare lengths
-          let escaped = value.replace(/([ #.:/;])/g, '\\$1');
-          if (escaped.length < value.length + 2) {
-            return '[' + attribute + '=' + escaped + ']';
-          }
-          return '[' + attribute + '="' + value + '"]';
-        });
-        // Minify unquoted attribute selectors: quote when unescaping produces a shorter result
-        minified = minified.replace(/\[\s*([^=]+)\s*=\s*([^"'].*?)\s*\]/g, (match, attribute, value) => {
-          // Unescape special characters (spaces, #, ., :, /, ;) and compare with quoted form
-          let unescaped = value.replace(/\\([ #.:/;])/g, '$1');
-          if (unescaped.length + 2 < value.length) {
-            return '[' + attribute + '="' + unescaped + '"]';
-          }
-          return '[' + attribute + '=' + value + ']';
-        });
-
-        // Minify logical combinations
-        minified = minified.replace(/(?<=\b(?:button|fieldset|form|input|select|textarea)):not\(:invalid\)/g, ':valid');
-        minified = minified.replace(/:not\(:dir\(ltr\)\)/g, ':dir(rtl)');
-        minified = minified.replace(/:not\(:not\((.*?)\)\)/g, '$1');
-        minified = minified.replace(/:not\(:enabled\)/g, ':disabled');
-        minified = minified.replace(/:not\(:required\)/g, ':optional');
-        minified = minified.replace(/(^|[\s,>+~])(a|area|link)(?:\[.*?\])*(?::where\()?:not\(:link\)\)?/g, (match) => {
-          return match.replace(':not(:link)', ':visited');
-        });
-        // Remove redundant leading "& " nesting selector
-        minified = minified.replace(/^& /, '');
-        minified = mergeAdjacentWherePseudoClasses(minified);
-        minified = minifyLanguageSelector(minified);
-        return minified;
-      });
+      uniqueSelectors = uniqueSelectors.map(minifySelector);
       uniqueSelectors = combineLegacyAnySelectors(uniqueSelectors);
       // When this rule is a nesting parent, its whole selector list is treated
       // as :is() for the children's specificity, so a top-level :is() can be

package/src/utilities.js

@@ -19,19 +19,6 @@ function resolveUnicodeEscape (hex) {
   return String.fromCodePoint(codePoint);
 }
 
-/**
- * Escapes special regex metacharacters in a string so it can be safely used
- * as a literal pattern in a RegExp constructor.
- *
- * @param  {string} input  The string to escape.
- * @return {string}        The escaped string safe for use in a RegExp.
- */
-function escapeRegexString (input) {
-  // Escape all regex metacharacters: . * + ? ^ $ { } ( ) | [ ] backslash
-  return input.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
-}
-
 export {
-  escapeRegexString,
   resolveUnicodeEscape
 };

package/src/value/minify.js

@@ -7,8 +7,10 @@ import {
   findMatchingParenthesis,
   skipParenthesizedGroup,
   skipQuotedString,
+  splitTopLevelComponents,
   startsUrlToken
 } from '../parser/source-search.js';
+import { tokenizeCssValue } from '../parser/tokenizer.js';
 import { resolveUnicodeEscape } from '../utilities.js';
 
 import { evaluateColorMix } from './color-mix.js';
@@ -30,6 +32,12 @@ import {
   simplifyStandaloneCalc
 } from './math.js';
 import { namedColors } from './named-colors.js';
+import {
+  formatShortestNumber,
+  parseNumericParts,
+  scaleByPowerOfTen,
+  shortenNumericText
+} from './numbers.js';
 import { isQuotesNoneEquivalent } from './quotes.js';
 import {
   evaluateRelativeColor,
@@ -918,26 +926,89 @@ function convertBackgroundPositionKeywords (value) {
 }
 
 /**
- * Converts millisecond time values to seconds when the result is a
- * shorter string. Values of 0ms become 0s (time must keep a unit),
- * and values at or below 99ms stay in milliseconds (shorter representation).
+ * The power of ten that separates a time in seconds from the same time in
+ * milliseconds, keyed by the lowercased time unit.
  *
- * @param  {string} value  The CSS value string potentially containing ms time values.
- * @return {string}        The value with eligible ms times converted to seconds.
+ * @type {{[unit: string]: number}}
  */
-function convertMillisecondsToSeconds (value) {
-  // Match numeric values followed by the "ms" unit at word boundaries
-  return value.replace(/\b(\d+(?:\.\d+)?)ms\b/gi, (match, amount) => {
-    const milliseconds = parseFloat(amount);
-    if (milliseconds === 0) {
-      return '0s';
-    }
-    // Keep ms for values at or below 99ms (ms representation is shorter)
-    if (milliseconds <= 99) {
-      return match;
+const TIME_UNIT_POWERS = {
+  s: 0,
+  ms: -3
+};
+
+/**
+ * Rewrites one time token in whichever of seconds or milliseconds spells it
+ * shortest, scientific notation included. Every conversion moves the exponent
+ * of the exact digits, so no precision is lost however large the time is.
+ * Seconds win a tie, and a zero time becomes `0s`.
+ *
+ * @param  {string} text  The text of a dimension token.
+ * @return {string}       The shortest spelling of the same time.
+ */
+function shortenTimeToken (text) {
+  const parts = parseNumericParts(text);
+  const writtenUnit = parts?.unit.toLowerCase();
+  if (!parts || !(writtenUnit in TIME_UNIT_POWERS)) {
+    return text;
+  }
+  if (!parts.digits) {
+    return '0s';
+  }
+  const writtenSpelling = shortenNumericText(text, true);
+  const secondsSpelling = formatShortestNumber(
+    scaleByPowerOfTen(parts, TIME_UNIT_POWERS[writtenUnit], 's'),
+    true
+  );
+  const millisecondsSpelling = formatShortestNumber(
+    scaleByPowerOfTen(parts, TIME_UNIT_POWERS[writtenUnit] - TIME_UNIT_POWERS.ms, 'ms'),
+    true
+  );
+  // Seconds are the conventional unit, so they win a tie with milliseconds
+  const convertedSpelling = millisecondsSpelling.length < secondsSpelling.length ? millisecondsSpelling : secondsSpelling;
+  return convertedSpelling.length <= writtenSpelling.length ? convertedSpelling : writtenSpelling;
+}
+
+/**
+ * Reports whether rewriting a number keeps its numeric type. A number written
+ * with a decimal point or an exponent has the `<number>` type, while one
+ * written with digits alone is an `<integer>`. A custom property can be
+ * substituted into, or registered with, a grammar that tells the two apart, so
+ * `100.0` cannot become `100` there.
+ *
+ * @param  {string}  originalNumber   The number as it was written.
+ * @param  {string}  rewrittenNumber  The number as it would be rewritten.
+ * @return {boolean}                  True when both spellings have the same type.
+ */
+function keepsNumberType (originalNumber, rewrittenNumber) {
+  return isIntegerSpelling(originalNumber) === isIntegerSpelling(rewrittenNumber);
+}
+
+/**
+ * Reports whether a number is spelled as an `<integer>`: digits with an
+ * optional sign, and no decimal point or exponent.
+ *
+ * @param  {string}  number  The number as written.
+ * @return {boolean}         True when the spelling is an integer.
+ */
+function isIntegerSpelling (number) {
+  // An optional sign followed by nothing but digits
+  return /^[+-]?\d+$/.test(number);
+}
+
+/**
+ * Converts each time in a value between seconds and milliseconds, whichever
+ * is the shorter string.
+ *
+ * @param  {string} value  The CSS value string potentially containing time values.
+ * @return {string}        The value with each time in its shortest unit.
+ */
+function convertTimesToShortestUnit (value) {
+  return tokenizeCssValue(value).map((token) => {
+    if (token.type !== 'dimension') {
+      return token.text;
     }
-    return roundCompactNumber(milliseconds / 1000) + 's';
-  });
+    return shortenTimeToken(token.text);
+  }).join('');
 }
 
 /**
@@ -1304,7 +1375,7 @@ function applyPropertyOptimizations (val, property, urlTokens) {
 
   // Convert ms to s for time-related properties when the seconds form is shorter
   if (TIME_PROPERTIES.has(property)) {
-    val = convertMillisecondsToSeconds(val);
+    val = convertTimesToShortestUnit(val);
   }
 
   // Transition: remove " 0s" duration (transition: all 0s -> transition: all)
@@ -1536,7 +1607,12 @@ function applyPropertyOptimizations (val, property, urlTokens) {
   // Shorthands: margin, padding, border-width, border-style, border-color, inset
   // Check if property supports box-model shorthand collapsing (4 → 3 → 2 → 1 values)
   if (/^(margin|padding|inset|border-width|border-style|border-color|gap|overflow)$/.test(property)) {
-    val = collapseShorthandParts(val.split(' ')).join(' ');
+    // Split components instead of splitting on spaces, so values that legally
+    // touch, like the adjacent hex colors of `#ddd#ddd`, count separately
+    val = collapseShorthandParts(splitTopLevelComponents(val))
+      .join(' ')
+      // A hash token may touch the component before it, so the separator space is not needed
+      .replace(/ #/g, '#');
   }
 
   if (property === 'hyphenate-limit-chars') {
@@ -1616,12 +1692,17 @@ function computeMinifiedValue (declaration) {
     // character budget a number is written within
     if (/^[+-]?(?:\d+|\d*\.\d+)([a-z%]+)?$/i.test(val)) {
       const [, rawNumber, rawUnit = ''] = val.match(/^([+-]?(?:\d+|\d*\.\d+))([a-z%]+)?$/i);
-      const scientificValue = isCustomProperty(declaration.property) ? val : shortenDimensionNumbers(val);
+      const isCustom = isCustomProperty(declaration.property);
+      const scientificValue = isCustom ? val : shortenDimensionNumbers(val, declaration.property);
       const roundedNumber = formatResolvedNumber(rawNumber);
       const losesPrecision = Number(roundedNumber) !== Number(rawNumber);
       // Preserve tiny dimensions whose significant digits would otherwise be
       // rounded away before their shorter exponent form can be considered.
-      val = losesPrecision && scientificValue !== val ? scientificValue : roundedNumber + rawUnit;
+      if (losesPrecision && scientificValue !== val) {
+        val = scientificValue;
+      } else if (!isCustom || keepsNumberType(rawNumber, roundedNumber)) {
+        val = roundedNumber + rawUnit;
+      }
     }
 
     val = lowercaseHexColors(val);
@@ -1670,7 +1751,7 @@ function computeMinifiedValue (declaration) {
     !isCustomProperty(declaration.property)
   );
   if (elidesRedundantSeparators) {
-    val = shortenDimensionNumbers(val);
+    val = shortenDimensionNumbers(val, declaration.property);
     // A property that punctuates its own components already had the whitespace
     // after its closing parentheses taken out, and only the separators its
     // grammar still needs put back, so those are the ones left alone here.
@@ -1685,12 +1766,25 @@ function computeMinifiedValue (declaration) {
  * Memoizes minified values for the current stylesheet. Minification runs many
  * passes over the same declarations (deduplication, shorthand assembly,
  * CSS-wide keyword hoisting, stringification), and the result only depends on
- * the declaration fields that make up the cache key, so each distinct
+ * the declaration's property, its value, and whether it is an assembled
+ * shorthand, so each distinct
  * property/value pair is minified once per stylesheet.
  *
- * @type {Map<string, string>}
+ * Values are filed under their property first, and assembled shorthands are
+ * kept apart from authored declarations, so a lookup reuses the property and
+ * value strings as they are instead of building a combined key on every call.
+ *
+ * @type {Map<string, Map<string, string>>}
+ */
+const minifiedValuesByProperty = new Map();
+
+/**
+ * The memoized values of shorthands the minifier assembled itself, filed the
+ * same way as `minifiedValuesByProperty`.
+ *
+ * @type {Map<string, Map<string, string>>}
  */
-const minifiedValueCache = new Map();
+const assembledMinifiedValuesByProperty = new Map();
 
 /**
  * Discards every memoized value. The minifier calls this at the start of each
@@ -1698,20 +1792,27 @@ const minifiedValueCache = new Map();
  * the cache should not outlive the pass that filled it.
  */
 function clearMinifiedValueCache () {
-  minifiedValueCache.clear();
+  minifiedValuesByProperty.clear();
+  assembledMinifiedValuesByProperty.clear();
 }
 
 /**
- * Builds the cache key for a declaration from every field the value minifier
- * reads. A null character cannot appear in a property name or in a parsed CSS
- * value, so it safely delimits the parts.
+ * Finds the memoized values for a declaration's property, creating the empty
+ * collection the first time the property is seen.
  *
- * @param  {object} declaration  The CSS declaration object.
- * @return {string}              The cache key.
+ * @param  {object}              declaration  The CSS declaration object.
+ * @return {Map<string, string>}              Map of value to its minified form for that property.
  */
-function createMinifiedValueCacheKey (declaration) {
-  const assembledFlag = declaration.isAssembledShorthand ? '1' : '0';
-  return declaration.property + '\u0000' + assembledFlag + '\u0000' + declaration.value;
+function getMinifiedValuesForProperty (declaration) {
+  const valuesByProperty = declaration.isAssembledShorthand ?
+    assembledMinifiedValuesByProperty :
+    minifiedValuesByProperty;
+  let minifiedValues = valuesByProperty.get(declaration.property);
+  if (!minifiedValues) {
+    minifiedValues = new Map();
+    valuesByProperty.set(declaration.property, minifiedValues);
+  }
+  return minifiedValues;
 }
 
 /**
@@ -1727,13 +1828,13 @@ function minifyValue (declaration) {
   if (typeof declaration.value !== 'string') {
     return computeMinifiedValue(declaration);
   }
-  const cacheKey = createMinifiedValueCacheKey(declaration);
-  const cachedValue = minifiedValueCache.get(cacheKey);
+  const minifiedValues = getMinifiedValuesForProperty(declaration);
+  const cachedValue = minifiedValues.get(declaration.value);
   if (cachedValue !== undefined) {
     return cachedValue;
   }
   const minifiedValue = computeMinifiedValue(declaration);
-  minifiedValueCache.set(cacheKey, minifiedValue);
+  minifiedValues.set(declaration.value, minifiedValue);
   return minifiedValue;
 }