Bubble introduced Option sets in in December of 2019 and they added an incredibly powerful feature that had been missing from Bubble. At their most basic, option sets can be used to store dropdown values (like a list of countries or sorting categories), but they’re flexible enough the be used in a range of creative ways.
The reason Option Sets are lightning fast is that the are saved as part of your app’s total code base (along with workflows, conditions and everything else Bubble needs to make your app function). This means that:
- They never touch the database
- They can be cached by your browser to be quickly accessed on the next page visit
- They are served via the Cloudflare CDN
- They are stored in a lightweight JSON format that’s kind on performance
You can also check out our FAQ on Option Sets.
What does Option Set mean?
As the name suggest, it simply means a Set of Options that you can add to your app. We’ll use some specific terminology when we’re talking about Option Sets, so let’s first break those down:
| Term | Meaning |
|---|---|
| Option Set | The Option Set is a collection of Options Example: Country |
| Option | An Option within that set. Example: Norway |
| Attribute | A field saved on an Option. Example: Name or Population |
| Display | The only built-in attribute. A text field to identify the set. Example: Norway (being the Display value of the Option) |
How do Option Sets work?
In many ways, Option Sets are similar to the Bubble database. You can create new types, link them to each other and reference them everywhere in your app. But there are some main differences:
Option sets are static
Unlike the database, any values that you store in Option Sets are unchanging, and can only be edited in the Bubble editor. The changes are not visible in your app until you deploy a new version of it.
Option sets are fast
Every time you reference something in your database, Bubble needs to fetch that information from the Bubble server. Option Sets, on the other hand, are downloaded as a JSON object along with everything else on your page when it’s first loaded and don’t require any searches after that. Any listing, sorting or filtering of data stores in Option Sets after that is done client-side, meaning it’s lightning fast.
After that first page load, Bubble doesn’t need to perform any extra database look-ups to get Option Set data.
A database Thing can contain an Option set – but not the other way around
Option Sets are designed to live independently from the database. You can reference them from wherever you want in your app, but you can’t reference a database entry from an Option. Options can reference each other just fine though, as we’ll see in the example further down.
How to create an Option Set in Bubble
Option sets are found in the Data tab, along with data database editor. There are no default sets, so you’ll find a completely empty canvas. In our example, we’re going to set up two different Option sets: Countries and Continents, and bind them to each other. You’ll see that the process is very similar to working with the database.
Countries and Continents
Let’s first get our Country type set up. In the Option sets editor, type in Country as illustrated below, and then set up one called Continent in the same way:
Having set up Country and Continent, click on the Country Option set to edit it. We’re going to add one attribute to it to bind it to a continent:
Then, let’s set up our first Continent with the New Option input field:
Do the same thing, and create a Country such as Norway, and then click the Modify attributes link, and pick the newly created Continent as the Country’s continent:
Great! Now we have a Country belonging to a continent. Feel free to add a few more countries and continents to the list, and let’s look at how we can show this list in the front-end. Remember to save the Continent on each Country.
Using Option Sets in dropdowns and other elements
With a few Countries with Continents, let’s now leverage both of them in the front-end. First, set up a dropdown that simply lists all the Continents we’ve saved. Remember that this will only work in the version-test in your app, until you’ve deployed it.
Showing Option Sets in a dropdown
- Type of choices: Set the Continent Option set that we just created
- Choices source: Set the top All Continent
- Option caption: User Current Option’s Display.
Filtering the Option Sets
Next, we’ll use the Continent field saved on each Country to filter the countries by. Start by adding another dropdown next to the first one, and set it up exactly like the first one, except showing Country instead of Continent.
Now, we’ll make one important change to show the correct list of Countries after having picked a Continent. We do this by adding the :filter operator at the end of the Country list. What we’re telling Bubble is to take the full list of Countries, and then apply a filter to them:
Then, we’ll set up the Constraint telling Bubble that it should only show Countries that have a Continent that is the same as the User has picked in the Continent dropdown.
The filtering of Option Sets all happens client-side, so it’s lightning-fast and doesn’t spend your servers capacity.
Option Sets and security
As a final note, keep in mind that Option Sets are downloaded in plaintext JSON on every page of your app. They are not meant to store any kind of confidential or sensitive information and simply creating an Option Set in your app makes any kind of information it stores available to anyone.
If you want to learn more about Option Sets our updated FAQ answers a lot of common questions.
Option Set FAQ
What are Option Sets in Bubble?
Option set are a kind of “light” database in Bubble that you can use to store static information. They are great for storing values that you need around in your app, such as the options you want to show in a dropdown or your app’s settings.
Typically, Option Sets are used to store values that rarely change, such as app settings or a list of countries, languages, categories, etc.
How do I add and update Option Sets?
Option sets are added in the Bubble editor, and you need to deploy your app before they are visible in the front-end. You’ll find them in the Data tab under Option sets.
How are Option Sets downloaded?
Option Sets are downloaded to your page on page load, along with the other parts of your app that Bubble needs (elements, workflows, conditions, etc). Technically, it’s downloaded as a JSON file, which means it’s quickly processed on the page.
The Option Sets are part of your app’s total Javascript file, meaning it’s both cacheable and served over the Cloudflare network, making them a lot faster than reading from the database.
How are Option Sets filtered?
You can filter Option Sets by adding the :filtered operator in a Bubble expression. As you technically never “search” for an Option set, you can’t add constraints like you would in a database search – Bubble always downloads the full list.
The filtering of Option Sets happens 100% on the client-side, and not on the server. Our How-to Guide on Option sets explains how to filter them.
Does Bubble download only the Option Sets it needs?
Bubble will download all Option Sets on every page, regardless if that Option Set is used on that page. But since they are part of your app’s total code base, they can be cached by your browsers, meaning they will only download the first time (or whenever they are by deploying a new version of your app).
Can Users edit Option Sets from my app?
No. Option Sets are part of your app’s code base, and require your app to be re-deployed to be updated. They can only be edited in the Bubble editor.
Will Option Sets slow down my page?
Option Sets on their own are stored as plain text in a JSON format. This means they are very light on their own, Technically, all data you add to your page will of course slow it down, but you would have to add a lot of them before they start slowing your page down.
Are Option Sets secure?
The clearest answer is that all Option Sets are stored as plain text in your user’s browsers and is easily accessible. It’s not meant to store confidential or sensitive information, so always avoid that. Assume that all info you store in Option Sets is public and available to anyone who visits your any one of your pages.
Are Option Sets protected by Privacy Rules?
No, Privacy Rules do not affect Option Sets in any way. They only affect your database.
You can reference Option Sets in your Privacy Rules (such as storing a User’s Role as an Option Set) from a Data Type Field, making them useful for setting up different rules across your app.
Are Option Sets encrypted?
No, Option Sets are stored in plaintext format and are not encrypted. Do not store any sensitive or confidential information in them.
