Adding/removing style-classes is simply bad practice. And not just in JavaFX. It is better to use pseudo-class state.

When the style-class changes, the set of styles that match a node can, and is very likely to, change. The css implementation 're-applies' css to the node and its children by finding the new set of matching styles, resetting all properties that were set by css to their defaults, and then setting the properties according to the new set of matching styles. With pseudo-class state, the only thing that happens is the set of styles that match the pseudo-class state are applied. Much less overhead.

That said, there are plenty of places where the css implementation could be better optimized. This use-case is certainly one of them.

On 12/22/15 1:15 AM, Tom Schindl wrote:
Hi,

While debugging some code I attached a listener to a property and
noticed that whenever a style-class is added to the control or even
worse somewhere in the parent hierarchy that FX resets the value to its
initial state (Node#reapplyCss & CssStyleHelper) only to set it back to
it's real value with the next CSS-Pass triggered by the next pulse.

I don't want to imagine if this happens with many value set via CSS and
eg adding/remove a styleclass to the scene root. Is this behavior really
by design like this?

You can try that yourself with the attached program below and using the
css at the end. I'm writing this because of Kevins request what the team
should invest time to because of Java9 delays and frankly all of those
bugs/features sound relevant and interesting but JavaFX performance
(most important CSS-Performance) is still miles away from eg browsers
who are the main competitors.

It doesn't help me to get an java.awt.Desktop replacement if my
input-forms do not render in a decent time frame - I would even say
rendering them in 2015 most be almost instant.

Tom

package application;

import javafx.application.Application;
import javafx.stage.Stage;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.StackPane;


public class Main extends Application {
        @Override
        public void start(Stage primaryStage) {
                try {
                        BorderPane root = new BorderPane();

                        StackPane p = new StackPane();
                        p.getStyleClass().add("test-css");
                        p.maxWidthProperty().addListener( (o, ol, ne) -> {
                                System.err.println("Modified : " + ol + " " + 
ne);
                                Thread.dumpStack();
                        });

                        root.setCenter(p);

                        HBox box = new HBox();

                        {
                                Button b = new Button("Modify Pane CSS");
                                b.setOnAction( e -> 
p.getStyleClass().add("dummy"));
                                box.getChildren().add(b);
                        }

                        {
                                Button b = new Button("Modify Root CSS");
                                b.setOnAction( e -> {
                                        root.getStyleClass().add("dummy");
                                });
                                box.getChildren().add(b);
                        }

                        root.setBottom(box);

                        Scene scene = new Scene(root,400,400);
                        
scene.getStylesheets().addAll(getClass().getResource("application.css").toExternalForm());
                        primaryStage.setScene(scene);
                        primaryStage.show();
                } catch(Exception e) {
                        e.printStackTrace();
                }
        }

        public static void main(String[] args) {
                launch(args);
        }
}

.test-css {
        -fx-max-width: 300;
}



Reply via email to