We just pushed another update to Convex!

The big updates this time around are:

  • Error Handling
  • Create React App Support
  • Function Size Improvements
  • Polish

If you aren't already in the Convex Slack Community, join us! We'd love to hear about your experience using Convex and answer your questions.

Error Handling

We've made some big changes in how you manage errors in your Convex query and mutation functions. All of the details are explained in the new Error Handling doc, but here are the basics.

Query Functions

Use React error boundaries to manage errors thrown from query functions. These make it super simple to render a fallback UI and record the error in an exception reporting service.

Mutation Functions

If a mutation function hits an error, this will

  1. Cause the promise returned from your mutation call to be rejected.
  2. Cause your optimistic update to be rolled back.

If you have an exception reporting service like Sentry hooked up this should be reported automatically. If you want to render specific UI in response to a mutation failure you can handle the promise rejection.

Internal Convex Errors

If there is an internal problem within your Convex deployment (like a network blip), those errors are now handled automatically. Previously they would often be exposed to your application, but now Convex will automatically retry your queries and mutations until the problem is resolved and they succeed.

Create React App Support

We now support the popular Create React App method of setting up React projects. Now you can run

npx create-react-app my-app
cd my-app/
npx convex init --beta-key <your beta key>

to start your Convex project.

When you are using Create React App, Convex will place your convex.json file and convex/ directory inside of src/ (matching the Create React App organization structure).

If you aren't using Create React App, no worries! The old setup will also continue to work.

Function Size Improvements

When you run npx convex push, the Convex CLI bundles up each file of query and mutation functions with its dependencies and uploads the bundles to your deployment. Convex has an 8MB limit on bundled function sizes.

We've changed the way that our bundling works so that it's much less likely that you'll hit this limit. The CLI now uses bundle splitting. If you have common code or npm packages that are reused across your query and mutation functions they will now be bundled separately instead of with each module.

The result is that your bundled functions are smaller, npx convex push is now faster, and you're much less likely to hit the 8MB limit.

Additionally, you can now run npx convex push -v to print out each source file's bundled size when you push.

Polish

We also made a couple of smaller tweaks:

  • Added documentation on how Convex compares to Firebase and Relational Databases.
  • Changed the color used in our console messages so that it's also readable for developers using dark mode.
  • Added support for React 18.
  • Fixed several bugs and usability issues in the Convex Dashboard.
  • Renamed Convex “instance” to “deployment” to be more clear.
  • Fixed a few bugs in the ConvexReactClient.
  • Improved our error messages and documentation.