Skip to main content

Release 0.12.0

· 2 min read
Melissa Liu
Nicolas Gallagher

StyleX v0.12.0 introduces performance optimizations, several bug fixes, a new lint rule, and some cleanup of deprecated packages.

Performance

Object key minification

The keys of compiled style objects are now minified to reduce overall code size.

Faster theme compilation

Compiling createTheme calls is now several orders of magnitude faster. This was achieved by caching evaluated theme objects.

ESLint improvements

New no-legacy-media-queries rule

A new rule has been added to the StyleX ESLint plugin to flag uses of the deprecated media query and pseudo-class syntax. This rule flags usage of the legacy media query and pseudo-class syntax that wraps multiple property values inside a single @-rule or pseudo-class block. This pattern is deprecated and should be replaced with the updated syntax here. (Thanks vincentriemer!)

Bug fixes

Styling pseudo-elements in dynamic styles

Dynamic styles can now be used to style pseudo-elements. Previously, the generated CSS variables could not be inherited by pseudo-elements.

Disallow object spreads in create

Object spreading in create calls is now disallowed by the compiler, as this breaks runtime caching of style merging.

Deprecations

The following bundler integration packages have been deprecated. We're focusing development on the core StyleX toolchain, and providing consistent tools for use across different bundlers. We recommend using the @stylexjs/postcss-plugin.

  • @stylexjs/esbuild-plugin
  • @stylexjs/nextjs-plugin
  • @stylexjs/webpack-plugin

The @stylexjs/rollup-plugin remains, but may be generalized into an unplugin package to extend this option to other bundlers.

The following other packages have also been deprecated.