Skip to content

Releases: reflex-dev/reflex

v0.8.5

04 Aug 20:21
Compare
Choose a tag to compare

Release Notes

More accurate progress tracking

When compiling a large app, we weren't incrementing the counter for some time-consuming tasks. Like collecting imports and stateful-izing components. Now we do, so the progress bar is a more accurate estimate of how much progress has been made.

Remove autofocus (not auto_focus)

autofocus is an old guy we had and it wasn't working. Now we only have the HTML/React field auto_focus.

Make Tag immutable

If you happened to have overwrote _render or such, you might be familiar with Tag. We modified it to be immutable as we have been the victims of misusing its mutability. Review your code that involves _render or render.

Bugfixes

Chores

Cleanups

Full Changelog: v0.8.4...v0.8.5

v0.8.4

28 Jul 21:28
Compare
Choose a tag to compare

Release Notes

Add query_parameters to router.url

It should be similar to router.page.query and be its long-term replacement.

Bugfixes

Chores

Full Changelog: v0.8.3...v0.8.4

v0.8.3

21 Jul 21:25
Compare
Choose a tag to compare

Release Notes

Disable stateless app detection

If you have a stateless app, now you need to explicitly set rx.App(enable_state=False) for it to be truly stateless.

reflex db status

A helpful command to visualize your migrations!

Add rx.el.figure

I'm not sure why it was missing, but better late than never. https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/figure

WindowEventListener

You can use rx.window_event_listener to add event handlers to the Window instance. For example:

rx.window_event_listener(on_key_down=rx.console_log)

would log key presses on the whole window. It also supports: on_resize, on_scroll, on_focus, on_blur, on_visibility_change, on_before_unload, on_key_down, on_popstate, and on_storage.

Default event action flags in @rx.event

class State(rx.State):
    @event(throttle=500, stop_propagation=True)
    def handle_with_defaults(self):
        pass

It supports stop_propagation, prevent_default, throttle, debounce, and temporal.

Increase number of default workers in production

You can change the number of workers in production by setting the GRANIAN_WORKERS. If you don't, and you are using Redis, we set a higher value depending on the number of cores in your CPU.

Add useful information to frontend exceptions

Previously they only had the stack, which was not very helpful. Now they include the type and the message.

Bugfixes

Chores

New Contributors

Full Changelog: v0.8.2...v0.8.3

v0.8.2

14 Jul 20:40
Compare
Choose a tag to compare

Release Notes

Deprecated: overlay_component

rx.App.overlay_component is deprecated. You can use rx.App.extra_app_wraps instead.

For example, if you had:

rx.App(overlay_component=rx.box(rx.text("Overlay Component")))

You can instead do:

app = rx.App(
    extra_app_wraps={
        (1, "Overlay Component"): lambda _: rx.box(rx.text("Overlay Component"))
    }
)

The (1, "Overlay Component") defines the nestedness and an ID of the Component. The higher the number the higher it is. For example, if ComponentA had nestedness of 1, and ComponentB had a nestedness of 2, then the output is going to be roughly:

<ComponentB>
  ...
  <ComponentA>...</ComponentA>
<ComponentB>

The value is a function that takes one boolean argument, that is, if the app is stateful (true) or not (false).

Get client ip from X-FORWARDED-FOR header if present

If you were running a your reflex app behind a proxy, this should improve the usefulness of this field.

  • Extract client_ip from x-forwarded-for header by @masenf in #5547

Enable SitemapPlugin by default

We will enable SitemapPlugin by default for apps that do not specify them in the plugins field. If you want to explicitly enable it, add it to plugins:

rx.Config(
    ...,
    plugins=[rx.plugins.sitemap.SitemapPlugin()],
)

Or if you would like to disable it:

rx.Config(
    disable_plugins=[
        "reflex.plugins.sitemap.SitemapPlugin",
    ]
)

The disable_plugins takes a list of strings representing the fully qualified (module + class name) name of the plugins.

Frontend is public to network by default

Previously, the backend was exposed to local network (0.0.0.0) but frontend wasn't (127.0.0.1). Now frontend matches the backend. We will add an option to change this later (both frontend and backend).

rx.Config is now a dataclass

If you were inheriting from rx.Config (for some reason?) you might want to update your code. This provides nicer type hints and might warn you about wrong fields.

Misc

Bugfixes

Chores

Full Changelog: v0.8.1...v0.8.2

v0.8.1

07 Jul 19:28
Compare
Choose a tag to compare

Release Notes

router.url

If you just want the url of the page the user is on, then rx.State.router.url is what you need. It's very similar to urllib.parse url, so you can do host, port, and whatnot. The plan is to move away from router.page.

  • add url and route_id to routerdata as a replacement for pagedata by @adhami3310 in #5516

Blur focus

Do you want to de-focus an element? You can use rx.event.blur_focus

  • If we have set_focus() we need blur_focus(). by @riebecj in #5522

Load plugins from environ

If you need to override plugins through an environment variable, now you can do so.

REFLEX_PLUGINS=reflex.plugins.tailwind_v3.TailwindV3Plugin

rx.el.a maps to react router link

You can still get the original through rx.el.elements.a.

  • ENG-6503: use react-router Link instead of rx.el.a by @masenf in #5529

Bugfixes

Chores

New Contributors

Full Changelog: v0.8.0...v0.8.1

v0.8.0

01 Jul 19:37
Compare
Choose a tag to compare
Reflex_080.mp4

Release Notes

Breaking Changes

Local JS files

If your app included local .js files (from assets or elsewhere), and those files contain JSX syntax, they must be renamed with a .jsx suffix now.

REMOVED DEPRECATIONS

The following has been removed and was previously deprecated:

  • UploadFile.filename, deprecated in 0.7.1. Use UploadFile.name instead (which strictly returns the file name with no slashes or such). To get the full path, use UploadFile.path.

  • App.error_boundary, deprecated in 0.7.1. Use App.app_wraps (which has other app wraps as well, most likely you would like to provide those, as well as your different error wrap).

  • App.api, deprecated in 0.7.9. Use api_transformer=your_fastapi_app instead. Read: https://reflex.dev/docs/api-routes/overview#api-transformer

  • App.add_custom_404_page, deprecated in 0.6.7. Use add_page with /404 route instead.

  • Component.__init__, deprecated in 0.7.2. Now it only inits the component and doesn't call post init to add events and such.

  • Non prefixed config env vars, deprecated in 0.7.13. Things like ENV_FILE now have to be passed explicitly as `REFLEX_ENV_FILE.

  • Gunicorn configuration env variables, deprecated in 0.7.9. Removed: timeout, gunicorn_worker_class, gunicorn_workers, gunicorn_max_requests, gunicorn_max_requests_jitter. If you would like to customize those, I encourage you to either call gunicorn directly (reflex.App is a factory for ASGI apps), or do so using gunicorn environment variable flags.

  • Inferring TailwindV3, deprecated in 0.7.13. We assume no Tailwind unless explicitly enabled through the plugins config.

  • get_decorated_pages, deprecated in 0.7.9. If you need to use a similar function you most likely need to implement your own page registry.

  • validate_parameter_literals, deprecated in 0.7.11. I don't think anyone but us used this function but it's nonetheless removed now.

  • Var._var_name, Var._var_name_unwrapped, Var.create_safe, and Var._type. All deprecated in various releases. All have better named equivalents.

This was done in this PR:

[MAJOR REWRITE] Replace Next with React Router

NextJS has served us well, but the needs of the framework has grown and we hit certain limits that made NextJS a suboptimal choice. To not go too long, compilation times and other factors have encouraged us to cut down on a big dependency that we barely use most of its features.

Breaking Changes

THIS MOST DEFINITELY HAS BREAKING CHANGES. Especially if you used something deeply attached to how JS works. During this prerelease we are going to triage regressions and fix them til they are at an acceptable state.

  • Static exports are now stored in .web/build/client (instead of .web/_static)

[REMOVED] reflex.suneditor

We have moved suneditor to its own package: https://github.com/reflex-dev/reflex-suneditor

[REMOVED] Experimental layout

We will be leaning more heavily into less in the core package (where less, is less opinionated UI).

  • remove experimental layout and clean up old experiments by @adhami3310 in #5392

[Major Rewrite] rx.State no longer inherits from Pydantic

rx.State is now a simple python Class. Nothing that fancy. The changes were made to be backwards compatible but you can optionally use rx.field(...) (or rx.field(default_factory=...)) to define fields more explicitly.

  • [0.8] remove pydantic as a base class of state by @adhami3310 in #5396
  • fix missing value for mutable state field leading to shared field value by @adhami3310 in #5416

[BREAKING] rx.Component.get_event_triggers is now a classmethod

We still invoke it mostly from a self context, but you should port it to be a classmethod.

  • [0.8] get_event_triggers should be classmethod by @Lendemor in #5344

[Major Rewrite] Remove Pydantic as a dependency of PropsBase

You can use it as before, it's just not a Pydantic class. (TODO: add code here about using component field)

Enable TailwindV4 by default

Newly generated apps with reflex init will have the tailwindV4 plugin enabled by default instead of the v3 one.

Add earlier checks for wrong app names

If you had your name named wrong, now we check that a tad bit earlier in the compile process and with a more helpful message.

Additional Event Info

Now you can use information about the pointer (the mouse thingy) in pointer events. (TODO: remind me to write an example here).

Also you could use on_scroll_end when.. the scroll ends! Unless you are in Safari, in which case you have to wait until they implement that :/

Improved Error Messaging that contains Vars

If you noticed some weird "rx__state__..." names, those are backend vars JS output. Now we strip those form compilation errors and replace them with what you might expect as more normal names. (TODO, add concrete examples)

  • replace compiled state name with module and name in errors by @adhami3310 in #5381

Add suffix to user defined vars to avoid clash with JS keywords

Javascript has a decent amount of keywords, and sometimes you might accidentally call your variable package and get a syntax error. This should solve this.

Built-in style reset

rx.App now has a parameter named reset_style that is True by default. It's there if you are not using Tailwind and you want to reset differences between the browsers.

Hot reload with REFLEX_ENV_FILES

If you are using Granian, now we pass the REFLEX_ENV_FILES environment flag for it to watch its changes.

Bugfixes

Read more

v0.7.14

03 Jun 02:09
Compare
Choose a tag to compare

Release Notes

[WARNING: different UI output] add style recursive for memo

Previously, we were not adding the app styles to memoized components. Now that's fixed, but in certain apps some of your memoized components might look different, so adjust your styles after upgrading.

Context on what page failed to evaluate

If you're on Python 3.11+, you will get a helpful message indicating which route is the one that caused the error.

Full Logging support

If you want to run reflex with a high loglevel but want to store debug logs just in case. You can set the environment variable REFLEX_ENABLE_FULL_LOGGING to true. This will by default store it in the user directory (something like .locals/shared/reflex). You can change the path of the log file with the environment variable REFLEX_LOG_FILE.

Components Improvements

Bugfixes

Chores

Misc

Full Changelog: v0.7.13...release/reflex-0.7.14

v0.7.13

26 May 19:03
Compare
Choose a tag to compare

Release Notes

Remove Pydantic as a base class of Component

rx.Component used to inherit from BaseModel, but that's no longer the case. We opted to write our own Metaclass to handle the specific needs of Components better.

This has great improvements for hot reload time for small apps as Pydantic spent around 75% of import time just deep copying fields. On my own machine, a hot reload of a simple app went down from ~1.2sec to just around 200ms!

While this is not intended to be a breaking change, it's likely that a very introspective code could behave differently with this one. So please test it and report to us so we can preserve behavior as best as possible.

length() for dicts

If you are using object vars (State fields of type dict or Base/dataclasses), you can now call .length() on them. This is a simple wrapper over .keys().length().

Allow Vars to be the result of the render function of Foreach

This relaxes the requirement from being a component. Vars are wrapped in a Fragment.

Prefix Config Vars with REFLEX_

The environment variables defined in Config will now be read with REFLEX_ as a prefix. Previous not prefixed names are still names but are deprecated.

Stronger type checking against partially filled variables

If you were unlucky enough, you might have written some code where you capture some arguments but reflex decides that it wants to give your event handler even more arguments. In these cases, we weren't checking the types of such arguments against the event callback. This now triggers a compilation error.

Ignore certain file formats from hot reload

Granian was reloading on more file formats than necessary, so we manually exclude a set of file formats that are unlikely to be a cause of hot reload. If you still notice weird hot reloads on file changes that are irrelevant to your application, we can append that list with more values.

Tailwind V3 is now contained in a module (and rudimentary Reflex Plugin System)

We now have a basic plugins system with a few hooks. It's not very documented, but you can basically provide a list of plugins to the plugins argument in rx.Config. You can add compile time hooks to create files, modify files, define stylesheets, define javascript dependencies, and more.

We moved our tailwind v3 code to use such plugin system. You should either set tailwind=None inside of your rx.Config or set plugins to [rx.plugins.TailwindV3Plugin()]. Automatic assumption of tailwind is deprecated.

We're also starting our work on Tailwind V4. You can try it by setting plugnis to rx.plugins.TailwindV4Plugin().

Bugfixes

Chores

Full Changelog: v0.7.12...v0.7.13

v0.7.12

19 May 21:10
c27bd39
Compare
Choose a tag to compare

Release Notes

Bugfixes

Chores

Full Changelog: v0.7.11...v0.7.12

v0.7.11

12 May 21:11
9b8aab9
Compare
Choose a tag to compare

Release Notes

[DEPRECATION] rx.next.video

It wasn't particularly usable to begin with.

Slightly stronger hydration mismatch strictness

This will stop you from putting rx.el.p inside of a rx.el.p and such.

Add option to disable auto-setters

This can allow you to be more explicit on what public State fields can be set by the user.

Use Javascript syntax over JSX

This shouldn't affect you, but our output code is now using normal Javascript and no JSX syntax. This solves some of the issues we had with context swapping between Vars and Components.

Upgrade rx.icon

Lucide has updated their list of icons, and now those changes are available in Reflex.

Remove Cond as a Memoization leaf

This might improve the runtime performance of your frontend!

  • Allow auto memoization of Component Cond by @masenf in #5272

Optimizations

  • ⚑️ Speed up function to_camel_case by 128% by @misrasaurabh1 in #5239
  • use knowledge about generic types to improve their getters and checkers by @adhami3310 in #5245
  • optimize rx.color to not use validate literal parameters by @adhami3310 in #5244

Bugfixes

Misc

Chores

New Contributors

Full Changelog: v0.7.10...v0.7.11