Further improve natural sorting of classes (#13532)

* skip initial character we just saw

Thanks Richard for noticing!

Co-authored-by: Richard van Velzen <[email protected]>

* prevent calling `charCodeAt()` if we already computed the value

* update changelog

---------

Co-authored-by: Richard van Velzen <[email protected]>

Author: RobinMalfait

CHANGELOG.md

@@ -14,7 +14,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## Changed
 
 - Use `rem` units for breakpoints by default instead of `px` ([#13469](https://github.com/tailwindlabs/tailwindcss/pull/13469))
-- Use natural sorting when sorting classes ([#13507](https://github.com/tailwindlabs/tailwindcss/pull/13507))
+- Use natural sorting when sorting classes ([#13507](https://github.com/tailwindlabs/tailwindcss/pull/13507), [#13532](https://github.com/tailwindlabs/tailwindcss/pull/13532))
 
 ## [4.0.0-alpha.14] - 2024-04-09
 

packages/tailwindcss/src/utils/compare.ts

@@ -20,15 +20,17 @@ export function compare(a: string, z: string) {
     // If both are numbers, compare them as numbers instead of strings.
     if (aCode >= ZERO && aCode <= NINE && zCode >= ZERO && zCode <= NINE) {
       let aStart = i
-      let aEnd = i
+      let aEnd = i + 1
       let zStart = i
-      let zEnd = i
+      let zEnd = i + 1
 
       // Consume the number
-      while (a.charCodeAt(aEnd) >= ZERO && a.charCodeAt(aEnd) <= NINE) aEnd++
+      aCode = a.charCodeAt(aEnd)
+      while (aCode >= ZERO && aCode <= NINE) aCode = a.charCodeAt(++aEnd)
 
       // Consume the number
-      while (z.charCodeAt(zEnd) >= ZERO && z.charCodeAt(zEnd) <= NINE) zEnd++
+      zCode = z.charCodeAt(zEnd)
+      while (zCode >= ZERO && zCode <= NINE) zCode = z.charCodeAt(++zEnd)
 
       let aNumber = a.slice(aStart, aEnd)
       let zNumber = z.slice(zStart, zEnd)