On 8/15/16 9:46 AM, Daniel Glöckner wrote:
Make the selectors as specific as possible. Avoid the universal selector
'*' if you can.
We recently came across a number of performance issues which were caused by our
Our stylesheet contained too many selectors, specifically too many generic selectors
targeting "common" JavaFX controls (.text, .label etc.).
This sounds like some code that would be good to share with the
We found the culprits by patching the JRE, adding some statistics to
SimpleSelector and CompoundSelector. I was wondering whether there are easier
ways but anyway, it works ;)
I think if you are going to go this route, you might want to use
Region#getUserAgentStylesheets() which adds the styles as user-agent
styles. But I don't think it will buy you much in terms of CSS performance.
We've meanwhile improved our CSS performance (by making a bunch of selectors
more specific) but want to re-structure the stylesheets to be more future-proof
(with even better performance ;)).
Could you quickly comment on the following idea?
Our CSS is already divided into several stylesheets (e.g. table.css,
These stylesheets are all imported via @import into a global theme.css.
theme.css is then added to the scene.
We're thinking about adding the individual stylesheets only to nodes which need them, for
example our UI component factory would add table.css to a TableView's list of stylesheets
(tv. getStylesheets().add("/path/to/table.css"). The global theme.css would be
minimal and only define colors and fonts.
What do you think about this approach? Will this work nicely with caching of
CSS styles in JavaFX?
If you the biggest bang for your buck relative to JavaFX CSS
performance, avoid style lookup and relative font sizes.