First Impressions

[7576457]

Hi everyone!

I've been aware of Reflex for a while but only took a deep dive yesterday. My background is in Dart/Flutter and Python/Flet, with zero experience in React/JavaScript. What I particularly admire about Flutter and Flet's codebase:

• Clear separation of logic and UI through OOP,
• Typed data classes for component properties,
• Enums for constrained values (e.g., TextAlign.left).

When I explored Reflex's source code, I felt disappointed. I acknowledge my expectations are my own responsibility, but I genuinely wish Reflex had the same API rigor and thoughtfulness as Flutter/Flet.

Issues I Noticed

1. Weak Component Typing

   • No equivalents to Flutter's @immutable classes or Python dataclass.

2. Unhelpful IDE Support
   For example, inspecting rx.center arguments doesn't show:

   • Valid values (like Flutter's alignment options).
   • Required parameters.
     
     How this could look:
     

3. Unconventional Naming
   Components appear as variables (rx.center), though they're actually factory methods:

   center = Center.create  # Not a class!

   
   While Python developers might find this normal, coming from Flutter it feels inconsistent.

---

What I'd Like to See in Reflex

1. Strictly Typed Props
   Using Pydantic or validated annotations:

   class BoxProps(BaseModel):
       width: Union[int, str]  # "100px" or 100
       color: str = "white"

2. Enums for Constrained Values

   class TextAlign(Enum):
       LEFT = "left"
       CENTER = "center"
   
   rx.text(align=TextAlign.LEFT)  # Flutter-style!

3. True Classes Over Factories
   Instead of:

   button = Button.create  # Current approach

   Prefer:

   class Button(Component):
       def __init__(self, child: str, on_click: Callable):
           super().__init__(child=child, on_click=on_click)

4. Better IDE Integration
   Hints like:

   • "color must be a HEX string or named color (red, blue)".

---

Why This Matters

• Reliability: Fewer runtime errors.
• Learnability: Faster onboarding for new developers.
• Maintainability: Easier refactoring and scaling.

Reflex bills itself as "React for Python", but currently lacks mature typing practices. This may improve with time—the library is young and evolving.

Question for the community:
What are your thoughts on Reflex's current typing approach? Are there plans to strengthen it?

I haven't properly explored Reflex yet. My experience is still very superficial, but these are the things I've noticed so far.

I really like the applications built with Reflex - they're truly impressive. What I'm suggesting is meant to improve the developer experience.

[Alek99]

Thanks for the feedback - I don't share the same perspective on the API as I prefer it over flutter/flet especially for things like components and making more complex UIs. We do put a lot of thought in our design - it may not match your opinion.

I think we can look into the better IDE support in the future a few people have mentioned it

[7576457]

Thank you for your response. Could you please address this specific question about the component design:

Currently, components that developers use are pre-created references, like button = Button.create. I'm curious about the reasoning behind this design choice. Why can't I directly instantiate components like rx.Button() instead of using rx.button?

[benedikt-bartscher]

I like the current design, and I can see less benefit migrating to another one. For me, this is just some personal preference nit. The only thing that disturbs me is that my lsp jumps to the button = Button.create line if I jump through the code with "goto definition".