Skip to main content

Revisiting UDJO: How an 18-Year-Old CSS Optimization Technique and Modern Deduplication Tooling Streamline Web Style Sheets

Cascading Style Sheets optimization often carries the reputation of a straightforward, largely solved domain in modern web development. Equipped with powerful automated minifiers, post-processors, and build pipelines, developers frequently operate under the assumption that every low-hanging performance optimization has already been thoroughly exploited. Yet, claiming that web engineering has exhausted all possibilities in CSS efficiency may be naive, particularly for a language that continues to evolve almost daily.

Among the various strategies modern developers can deploy, one technique originating at least 18 years ago warrants renewed scrutiny: UDJO, or "using declarations just once." Heavily rooted in the core software engineering principle of DRY—"don’t repeat yourself"—UDJO functions by systematically identifying and paring down declaration redundancy across a style sheet.

When a property-value pair such as display: flex appears across separate rule blocks—such as independently within .example and .sample—the technique reconciles them into a single consolidated rule with a combined selector list, matching .example, .sample to the shared display: flex declaration.

While conceptually straightforward, the practical success of UDJO depends on two key factors: the intelligence of the deduplication process and the physical length of the targeted selectors. Algorithmic intelligence governs whether consolidation offers a genuine maintainability advantage—ensuring that modifying a shared declaration aligns logically across all attached selectors. Meanwhile, selector length directly impacts asset size. Because grouping selectors requires prepending every instance of a repeated declaration with the full list of matching class names or identifiers, consolidating rules with long selectors can accidentally introduce more byte overhead than the eliminated declaration saves.

Furthermore, shifting the location of selectors during consolidation directly affects cascade ordering rules as specified by the W3C CSS Cascade specification, meaning automated tooling must carefully navigate cascade behavior to preserve visual integrity.

Because manual deduplication across complex enterprise style sheets demands significant manual testing, software tooling has recently been introduced to evaluate how effectively UDJO can be automated today. The utility, named CSS Dedup, was created to detect declaration repetition and safely consolidate CSS. To gather empirical data on whether UDJO remains effective and relevant for contemporary site architectures, CSS Dedup was deployed against a series of real-world websites to assess file size impacts across different optimization thresholds.

Is There Anything to Deduplicate in Modern CSS?

To test the viability of UDJO on modern production platforms, an initial analysis examined 20 distinct websites spanning international institutions, civil liberties groups, and media organizations. The experiment benchmarked style sheets using two distinct configuration modes: a standard, provably safe deduplication mode (-f) that reconciles valid redundancies regardless of raw file size changes, and an aggressive mode restricted exclusively to modifications that deliver net file size savings (-f -a -s).

The standard approach captures the natural outcome of declaration deduplication, while the restricted aggressive mode reflects the setup site owners prefer when balancing clean architecture with bandwidth reduction.

The findings across the first batch revealed sharp contrasts depending on selector structure and optimization rules. For many complex sites, standard UDJO optimization increased uncompressed file sizes because long selector strings repeated across combined rules outweighed the payload savings of consolidated declarations.

For instance, on the European Commission portal (commission.europa.eu), standard UDJO deduplication increased external style sheet payload by 64.9 KB (+6.4%). However, when configured to aggressive savings-only mode, the tool pruned 51.9 KB (-5.1%) from the site’s total style sheet size.

Similarly, political organization site die-linke.de saw a payload expansion of 104.0 KB (+20.5%) under standard deduplication, but achieved a 21.2 KB (-4.2%) reduction when optimized purely for size savings.

The Electronic Frontier Foundation (eff.org) displayed a similar pattern: standard deduplication expanded payload by 120.8 KB (+27.7%), whereas aggressive savings optimization trimmed style sheets by 8.5 KB (-2.0%).

The Non-Aligned Movement site for Uganda (nam.go.ug) experienced an 84.5 KB (+9.2%) expansion in default mode, which converted into a 53.9 KB (-5.9%) savings under aggressive mode.

The Iranian Ministry of Foreign Affairs (en.mfa.ir) moved from a +58.7 KB (+5.1%) increase under default rules to a net savings of 51.2 KB (-4.5%) in savings-only mode.

Other sites in the initial study mirrored this trend. The United Nations Relief and Works Agency (unrwa.org) saw standard deduplication add 87.4 KB (+13.2%), while aggressive savings cut payload by 4.8 KB (-0.7%).

Middle East Eye (middleeasteye.net) moved from a +60.9 KB (+8.6%) expansion to a 20.5 KB (-2.9%) reduction.

Movimiento Sumar (movimientosumar.es) shifted from +98.8 KB (+13.6%) under standard mode to a 5.0 KB (-0.7%) size cut under aggressive filtering.

European Vegetarian Union (euroveg.eu) turned a +78.8 KB (+9.3%) increase into a 12.4 KB (-1.5%) drop, while Vegan Europe (veganeurope.eu) moved from +37.3 KB (+17.7%) to a 1.3 KB (-0.6%) payload decrease.

Smaller sites and public platforms registered similar metric shifts:

  • diem25.org shifted from +40.5 KB (+10.7%) to a reduction of 4.4 KB (-1.2%).
  • podemos.info moved from +23.2 KB (+5.5%) to a savings of 6.0 KB (-1.4%).
  • laquadrature.net shifted from +14.0 KB (+4.2%) to a savings of 3.0 KB (-0.9%).
  • icanw.org moved from +5.5 KB (+2.9%) to a decrease of 3.5 KB (-1.8%).
  • taxmenow.eu transitioned from +1.7 KB (+2.1%) to a reduction of 4.0 KB (-4.6%).
  • 12371.cn shifted from +2.9 KB (+14.3%) to a modest reduction of 45 Bytes (-0.2%).
  • gruene.de moved from +1.6 KB (+1.1%) to a drop of 0.7 KB (-0.5%).
  • ccc.de shifted from +0.8 KB (+2.2%) to a savings of 0.1 KB (-0.3%).

Intriguingly, a small subset of general sites achieved payload reductions even under default, unconstrained UDJO rules. Global Sumud Flotilla (globalsumudflotilla.org) registered a natural file size reduction of 17.0 KB (-6.5%) in default mode, which broadened to an 18.7 KB (-7.2%) reduction under aggressive mode. The Organization of Islamic Cooperation (oic-oci.org) likewise saw natural savings of 6.3 KB (-4.0%) under default processing, expanding to a 9.3 KB (-6.0%) size drop under aggressive optimization.

To test whether authoring habits influence how stylesheets respond to deduplication, a second study cohort evaluated personal sites built by prominent web developers and CSS specialists. The hypothesis held that industry professionals might write more concise selectors, altering the efficiency ratio of combined rule blocks.

The data gathered from web developers’ personal sites supported this premise. Several sites yielded net file size reductions even under standard default deduplication.

For instance, the website of developer Sara Soueidan (sarasoueidan.com) saw standard UDJO deduplication shrink style sheet size naturally by 2.9 KB (-7.3%), with aggressive savings mode yielding a 4.5 KB (-11.1%) reduction.

Educational author Josh W. Comeau (joshwcomeau.com) registered a natural reduction of 2.7 KB (-3.8%) in default mode, expanding to a 5.0 KB (-7.2%) cut under aggressive filtering.

Web developer Paweł Grzybek (pawelgrzybek.com) achieved natural savings of 0.5 KB (-2.7%), which reached 0.7 KB (-4.3%) in savings-only mode.

CSS Working Group member Lea Verou (lea.verou.me) recorded a natural drop of 0.4 KB (-1.4%), expanding to 0.6 KB (-2.3%) under aggressive configuration.

Specification editor Miriam Suzanne (miriamsuzanne.com) showed natural savings of 0.2 KB (-0.5%), reaching a 0.7 KB (-2.0%) total reduction under aggressive settings.

Among other developer platforms analyzed:

  • Bramus Van Damme (bram.us) saw default mode add +19.6 KB (+7.3%), while aggressive mode secured a 4.2 KB (-1.6%) size reduction.
  • Ahmad Shadeed (ishadeed.com) shifted from +4.2 KB (+11.4%) in standard mode to a 0.2 KB (-0.5%) savings in aggressive mode.
  • Paul Kinlan (paul.kinlan.me) moved from +3.3 KB (+8.0%) in default mode to a 1.0 KB (-2.4%) payload reduction under savings mode.
  • Kizu (kizu.dev) shifted from +1.0 KB (+1.7%) to a 0.1 KB (-0.2%) savings.
  • Kevin Powell (kevinpowell.co) moved from +0.1 KB (+0.6%) in default mode to a 0.1 KB (-0.5%) payload reduction under aggressive mode.

The stark difference between the institutional cohort and the web developer cohort suggests that developer-authored sites often utilize shorter selector strings and concise architectural patterns. Shorter selectors reduce the byte overhead of grouping rules, enabling default UDJO to produce direct payload savings more frequently.

Crucially, raw file size variations do not serve as an absolute proxy for overall CSS quality. The ultimate impact of deduplication remains deeply tied to selector design, cascade maintenance, and whether grouping declarations improves structural clarity for developers. Additionally, these figures evaluate uncompressed external style sheets; accounting for post-transfer compression techniques like Gzip or Brotli represents a key area for expanded research.

On the Effectiveness of UDJO as a CSS Optimization Technique

The empirical data indicates that UDJO remains a viable and effective CSS optimization technique in modern web engineering. While straightforward declaration deduplication can sometimes expand raw byte counts if selector lists grow too long, utility configurations targeting net file size savings consistently reduce transfer payloads across both enterprise platforms and technical blogs.

Because automated utilities like CSS Dedup can be configured to filter out size-expanding changes while respecting cascade safety rules, deduplication presents a low-cost, automated vector for performance tuning—particularly when applied to minified production assets. When integrated into modern build chains, UDJO demonstrates that meaningful efficiency gains can still be extracted from long-standing architectural principles.

Nila Kartika Wati

Author at DesignEnt.

Flash News