Table of Contents
Why comparing these two approaches?
Since the beginning of our no-code agency (and even before) we’ve worked primarily with Bubble.io to build no-code apps for our clients. However some time ago we started to see some disadvantages of Bubble platform and we started looking for some alternatives. We already knew Xano as a reliable and scalable no-code back-end but we wanted to find an alternative to build UI of our web applications – we found WeWeb and from then, we keep using it for almost all of projects for our clients.
But that doesn’t mean Bubble is not a great tool to build apps, definitely not. It’s just that we found a better alternative that is more suitable for most of our projects
All-in-one vs separated front-end & back-end
Summary: Separated FE & BE is better for apps that require more complex functionalities and scalability, while all-in-one solution is better for more simple tools and non-tech app builders.
Before jumping into individual features of these platforms, let’s state that we are comparing not only tools, but also two different approaches to build no-code applications. While Bubble.io is a platform that combines front-end and back-end for your app, WeWeb is only front-end builder and Xano is only for back-end business logic. One could say that the comparison might not be entirely fair and we respect such opinion 
.
What are the main advantages of having separated tools?
- You have more control over the functionality of your app
- The vendor lock is not for the entire app (you can always switch only front-end or back-end, you don’t have to rebuild an entire application)
- Usually the performance of dedicated back-end is higher (be it Xano or alternatives such as Buildship or Fastgen)
What are the advantages of having all-in-one tool?
- It is more simple/faster to build apps because FE and BE are already “wired together”
- Pricing – you pay only for one development platforms
- Version control – different environments of your app are automatically synced for back-end and front-end
How we compared Bubble and WeWeb + Xano?
We looked at all aspects that we handle for most of our projects, starting from building UI, some front-end business logic, database management, performance, pricing but also some things that are relevant only for some use-cases (such as HIPPAA or GDPR compliancy).
We wanted to evaluate these approaches as objectively as possible. Although we switched from Bubble to WeWeb/Xano we still believe that Bubble is a great no-code development platform for some use-cases.
UI Editor – building front-end
Summary: Building in WeWeb feels much closer to traditional development, while taking advantage of no-code speed and efficiency. Bubble’s editor is easier to work with especially for builders without technical background.
We say that because when we work with WeWeb, the experience and entire structure of the editor is much more similar to what full-code developer does. But let’s look at different aspects of building UI.
Components
WeWeb uses notion of components to create re-usable elements, that can be used across your entire application. What is even better is that it allows you to create libraries of custom components that can be shared between different projects. WeWeb components allow you to define properties, local variables (that might or might not be exposed outside of the component), workflows, formulas and triggers. Everything you need to create scalable “atomic design system”
Bubble uses so called re-usable components. Few months ago these components had quite a limited functionality, but recently Bubble introduced use of “properties” that allow you to pass data from parent elements to these components. Use of re-usable components is good but it has some limitations when you want to interact with “outside elements”. Bubble allows you to create local custom states, workflows and custom events for each reusable element.
Styles/classes/design system
WeWeb uses equivalent of CSS classes that you can apply to elements/components. We find this concept very useful especially in more complex apps. In addition, you can define your own color scheme, typographies or spacing. (although usually classes are used instead of these functionalities)
Bubble uses so called “styles”. Imagine style being a visual variant of the element. The disadvantage of this approach is that it doesn’t allow you to combine multiple styles. You can always apply only one style to your element.
Responsiveness
WeWeb uses concept of breakpoints, very similar to Webflow approach. This makes it much easier to define responsivness of your app. However currently it is not possible to change the breakpoint values, which in some cases is definitely not ideal. If you want to enforce specific behavior outside of these breakpoints, you need to find a “hacky way” to do so.
Bubble allows you to create condition for each components, e.g. if screen size is < breakpoint, change the font size of this paragraph to 12px. The good thing about this is that it allows you to have flexibility for your breakpoints, as you can define any values in the condition. Downside is that you need to define these conditions individually (or in some cases globally for the “style”). One thing that is not ideal is that some properties cannot be changed in conditional expressions, so you need to create another element/component e.g. for mobile view.
Front-end workflows/business logic
Summary: WeWeb front-end workflows are visually more clear while Bubble has more pre-defined actions.
Both WeWeb and Bubble allows you to create front-end business logic – so called workflows.
WeWeb: It is more visaully clear to create more complex workflows in WeWeb, you create diagrams that in our opinion can be understood better.
Bubble: From functionality perspective, it offers slightly more (e.g. you have more pre-built actions such as show/hide components, send data to group etc.) actions, but if you want to create slightly more complex business logic – it’s a mess.
Database management
Summary: You have more control in Xano, but it is easier to manage the database in Bubble.
Xano allows you to fully manage your PostgreSQL database. You can work with standard database functions such as DB triggers or custom DB indexing and querying data has very similar logic as you would do in SQL. In addition, you can easily work with the data in Excel-like UI.
Bubble on the other hand gives you higher level abstraction of working with the data. It has it’s advantage mainly for non-tech people, because you don’t need to configure stuff which as non-tech person might not understand properly. It has support of DB triggers, but what we miss in Bubble is control over the DB indexes, that allow you to make your DB queries significantly faster.
Custom code
Summary: Using custom code in WeWeb & Xano feels much more native and reusable than using it in Bubble which for some cases requires external plugins. (e.g. to run plain JS)
In WeWeb, you can easily work with either plain JavaScript and create re-usable JS functions/formulas that you can use across the entire project or you can also import your own Vue.js components from GitHub
Xano allows you to write JavaScript “lambda functions” – so you can use it when necessary (some use-cases – especially complex data transformations can be done more easily with JS than with Xano no-code stack)
In Bubble we have mixed feelings about using custom code – it doesn’t allow you to re-use javascript functions across different “places” of the app and you even have to use external plugin to run JavaScript (not ideal if you want to interact with other components/elements/data on the page)
But still, Bubble allows you to create custom plugins (both front-end and back-end) that you can use either within your project or share it and monetize in community
Code export
Summary: WeWeb allows code export, Xano doesn’t and neither does Bubble
WeWeb allows you to export and self-host your entire Vue.js application, here is more information if you are interested to know more. The only “catch” is that you have an ability to export the code only if you subscribe to annual WeWeb subscription.
Xano doesn’t offer code export, but it allows you to host your Xano instance either on-premise or within your own cloud. This option is only available on enterprise plane
Bubble doesn’t allow you neither to export your app nor self-host but you can subscribe to dedicated instance which allows you to host your Bubble instance in a region of your choice (otherwise, public Bubble instance is hosted in the US)
Back-end performance
Summary: When done properly, you can achieve much better performance with Xano but if you don’t know what you are doing, you can more easily screw up the performance.
Xano, as already mentioned gives you more control about some performance aspects of your application such as database indexes and response caching. Especially caching functionality, if used properly, can improve performance of your APIs significantly. So if you are building an app where you expect heavy user load or you work with huge amounts of data, Xano gives you more tools to do it right and keep the performance of your queries fast enough
Bubble handles all queries “out of the box”, therefore there is no room for query optimization, response caching or optimizing queries with indexes. However that doesn’t mean that data retrieval in Bubble is slow! Please have this in mind. Most of the apps that we were building would be absolutely fine with Bubble’s out-of-the-box data querying, because usually you don’t work with such huge amounts of data.
One thing that we really miss in Bubble is a proper caching mechanism – especially if you want to make some of your pages with ultra low-latency.
Security
Summary: Bubble has built-in mechanisms to prevent seeing data that some users shouldn’t have while Xano has more “enterprise” certifications (GDPR, SOC2, and HIPAA compliant and it has ISO 27001, 27701, and 9001 certifications)
Xano has almost all of the certifications that you need to run enterprise application that hosts sensitive and private data. So the question of infrastructure security is difinitely answered as “fully compliant”.
Regarding security functionalities, Xano provides built-in authentication/authorization using JWE tokens. So it is quite easy to quickly secure your endpoints and make them private.
What we miss in Xano is ability to more easily work with “row level” and “column level” security. So for example use case of user X can only access DB records where the user is owner and to see only subset of fields – this must be implemented manually.
Bubble is SOC 2 certified and it can be GDPR compliant with proper “legal work” (DPA). We want to highlight Bubble’s way of handling row level and column level data privacy. You can easily setup so called privacy rules which sets rules who can see what across the entire application. This is really powerful feature that helps you to maintain your app secure.
Community and marketplace
Summary: Bubble has much bigger developer community and has marketplace with thousands of user-made plugins, while WeWeb has this in short-term roadmap and Xano has marketplace that is not yet so developer friendly.
WeWeb is planning to release marketplace feature in upcoming weeks. In the first phase, it will give access to free user-made components and plugins with paid components coming later during the year. The size of the developer’s community is not that big, but you’ll always find people willing to help you with your problem. (including inhouse WeWeb team)
Xano has marketplace of user-made snippets. Snippets are pieces of business logic implemented as API endpoints or functions. Having said that, it doesn’t allow you to search through the marketplace so there’s a limited way how you can find an appropriate plugin/snippet for your project. With the community, it’s similar as WeWeb, not that huge but lot of people willing to help you.
For Bubble, the size of the community and amount of available plugins is the biggest one among no-code web app development tools. Markeplace offers both free and paid plugins, that ranges from custom components or advanced integrations to 3rd party tools. Since Bubble is probably one of the most used no-code development tool available on the market, the size of the community is incomparable with the other two platforms. This gives you much more space to solve your problems with fellow no-code developer.
Pricing
Summary: All platforms give you an option to try out basic version of the platform for free, but none gives you ability to launch to production without paid plan.
WeWeb offers 3 different paid plans – Starter, Scale and Enterprise. These plans differ in maximum number of monthly app visits and some additional features such as caching or having multiple app environments.
Xano starts with with launch plan that offers most of the features and infrastructure that will easily cover most of the applications, being it early customer facing app or an internal app. Scale plangives you an option to choose between 4 variants – each with different API and CPU performance. Enterprise plan allows you to have additional enterprise level security measures and host your back-end either on-premise or host it in your own cloud.
Bubble has 4 different paid plans. The main difference between the plans is amount of workload units (WU) included in each program plus some additional features. On top of your paid plan, you can purchase additional WU package to cover your needs.
Summary
Both approaches to build your app with no-code has its own place. Bubble is a great tool that combines front-end and back-end functionality and allows less tech-savvy people to build web applications.
On the other hand, we think that combination of WeWeb and Xano is better suited for more complex projects, that require more control over the functionality and performance of the application.
We in QikBuild are primarily building apps for our clients with WeWeb and Xano tech-stack, because of the nature of thee projects (more complex applications). But Bubble still remains a strong player in the field of no-code software development.
Are you not sure which no-code tool stack is the best fir for you project? Our CEO Juraj will be happy to provide a free consultation whether no-code is the right way and which tools to pick.
