Forum Academy Marketplace Showcase Pricing Features

Performance as rated by Google

Hi, my name is Aaron and we are using Bubble for a two-sided marketplace focused on classic cars. I’ll start by saying that Bubble is a brilliant idea and has loads of useful and intuitive functionality. The rate at which we are able to build things is incredible. A huge kudos to Emmanuel for the work he and the team has done! I recommend Bubble to anyone who will listen, whetheror not they ask :grin:. With that said, I will now call out one of the biggest issues we’ve experienced since using Bubble, performance.

As we are an e-commerce site SEO is very important to us. Google announced that Core Web Vitals will start being a factor in SEO rankings starting in May 2021. It’s unclear how strong of a signal Core Web Vitals will be but there’s no doubt Google uses performance as a factor in rankings. This led me to test our Core Web Vitals on our Bubble site. The results weren’t great. For a simple support page without any repeating groups or searches, the score was 7 / 100. Our SEO expert tells me we should try to get this score to at least 50/100. However, there doesn’t seem to be much we can do to optimize the page. I’ve run a similar test on a blank page with literally nothing on it and the score was still less than 10/100. You can easily replicate this yourself using the built-in lighthouse tool in Chrome.

Performance issues aren’t only impacting our Google rankings. We’ve also seen poor performance on low-power machines (like Chromebooks) to the point where customers have asked us if the site is having issues. I’ve also experienced issues with infinite scroll essentially locking the entire window with no good user feedback making the page feel broken when people scroll beyond the existing list. There are a number of other areas, especially around search, I have experienced performance issues as well. And yes, I know there is a number of things you can do to optimize search and we have implemented them. If there was one thing that would make us migrate off of Bubble performance issues would probably be it.

I write this in the hopes that the fine folks at Bubble will take notice and consider this when deciding on future feature work to tackle. I have no doubt there is a seemingly endless backlog of things to work through and some really important features in the piple line but I believe this should be on the list. At the very list there should be a goal to get the performance of a blank bubble page to 75/100 using the lighthouse tool. That seems like a reasonable goal.

Thanks for listening.

PS: someone has taken the time to write an entire book on Bubble performance optimization. I haven’t read it but it looks pretty cool. It’s great that Bubble has a community of people that do things like this.

3 Likes

Putting aside speed and SEO rankings… I tried some searching/sorting and there does seem to be something going on that’s causing the site to be laggy. Who knows – might be calls to the database, workflows running or image sizes. I have a ton of data in my site and some pretty complex searching, and it runs fast.

Did you use a template to build this or did you do it yourself?

Good looking site by the way.

1 Like

Thanks for the good wishes! Good luck with yours as well!

We’ve got a number of workflows running and some pretty complex searches. There probably is some more optimization we can do. We are using the Canvas template from AirDev. We also use AirDev for the build. Those folks are amazing by the way, highly recommend them. They are really responsive and easy to work with.

The 7/100 on a blank page is what really got me. I was able to replicate that on a new bubble app without any workflows or data.

Cheers,

Hello @aaron2

It took 0.7 second to load your Simple Support Page. SEO must be at least 90/100 :sweat_smile:


Contradictory results from Google…

added: It took 3.5 seconds on my old iPhone with a score of 6 / 10

HI John. Lol, at .7 it should be a 90/100!

Google lowers the bandwidth on the mobile test which will artificially drop the speed. This isn’t the case for desktop.

When I use the network monitor in Chrome over my 1 gb internet connection The domcontent loaded comes in around 700ms as you note

Perhaps it’s just the way Google measures performance on the support page and blank pages. If that is the case it’s still probably worth understanding why it’s the case.

I have definitely experienced lag with the search page (home page) but that could be more attributed to how the site is built.

1 Like

The lagging and freezing in your search pages is more likely something sub-optimal in the way the site was built, not Bubble, and therefore it’s fixable (my unsubstantiated guess is a funky filter setup that is running client side that you should move to server side). You have a cool site – don’t let a bad user experience hold you back!

If you post some info on your search structures and workflows someone on the forum will likely be able to get to the bottom of it.

The book you mentioned by @petter is a must read. As are a few epic threads on this forum devoted to performance like Performance Q&A guide and Alternative approach to the Bubble’s recent tutorials for list of things

And in case the picture uploading is screwed up, that’s covered in these posts where @keith figured out the fix: VERY slow load time (for 12 listings) and Uploading an image from the State of an element so that it can be retrieved "properly"

3 Likes

Thanks for the really thoughtful response! I’m going to kick the search page performance question back to AirDev and let them look at it.

We do have a number of filters and it’s very possible that is a contributing factor. Here is some of the config:

The list is set up as Ext. vertical scrolling

The filters on the searches are complex

This is the filter that’s in the second list filter “This Product’s Cars:filtered:count>0 or …” for reference.

There are also some conditionals

We are using Algolia for text search but only after a search string has been entered.

The product card images are configured as such

I haven’t experienced any issues uploading images which is good.

Like I said I’ll kick this over to AirDev for review but if anything sticks out let me know.

I’m still curious why a blank page in a fresh app has a lighthouse performance rating <10. That doesn’t seem right.

Hi, on why a blank page has a bad lighthouse rating, I can’t help you there since that’s beyond my pay grade. I do recall seeing posts on Bubble not rating the best on Google, though one post pointed out that YouTube ranked poorly as well! I’m sure, as you point out, it has something to do with how Bubble is built.

As to your setup, I am seeing a lot of :filters and advanced filters. Most stuff after the “:” runs client side, and all advanced filters run client side. Combine those with big data sets and you get slow performance.

Since the advanced filter is running client side (as opposed to the server side stuff in the “Search for Products” box), Bubble has to keep loading data into the browser until it gets enough results to fill the slots in your RG. This isn’t an issue if your dataset is small, but if you have a big dataset, that means tons of data being sent from Bubble to the page (like thousands or tens of thousands of records), and the browser having to do a ton of work to churn through all that data to figure out what sliver of data matches all your advanced filters and fill all the available slots in the RG. So you get the lagging and freezing.

On the other hand, searches performed server side are crazy fast (presumably because the cloud servers Bubble uses are powerful), and only the actual results are sent to the browser, so everything feels fast and lightweight.

I’d say to dupe your product page and play around with it. Delete all the advanced filters and see how the page runs just on the server side constraints, and that will tell you just how much the advanced filters are slowing you down. If they are, then you’ve got to work to get rid of them by moving those constraints to the server side where possible. If one can’t be moved there, think about if you really have to have it. Maybe if you only had a minimal amount of advanced filters, then users would usually not hit them, so the problems would decrease. But my guess is your goal is for your parts database to grow and have tens or hundreds of thousands of records, so any advanced filter is just going to make things worse and worse for the reasons I’ve outlined.

1 Like

Ed I really appreciate your replies. Very thoughtful again.

I’ll dup the search page and test the impact of removing advanced filters. If all advanced filters are run client-side it would certainly explain some lag. We currently have over 10k products and plan to grow to many times that size so it’s good to address this now.

We only have a handful of product filters (store, rating, price, category, and make/model) but plan to add a lot more, like eBay or amazon. It seems like the filters that are problematic are the ones based on data types linked to the product data type (store and make/model) as it requires the use of advanced filters. For example, I may want to filter on only products whose store (a joined table) is in a certain country. I’m curious if there is any way to implement that logic that doesn’t require the use of advanced filters. I could replicate all the store information into the product table but that seems like a bad data design with its own issues. I’m also curious if there is a reason Bubble executes advanced filters client-side instead of server-side. That seems like it would be the simplest answer and would probably solve a lot of issues for folks.

Anyway, thank you again for taking your time to review and respond. The community is very lucky to have you here!

A selected option between server-side and client-side will be great. For now, your best option is to duplicate values.

That becomes impractical with vehicle fitment data. There are over 300,000 unique car models in our cars table and any given part can fit hundreds of models. Having a list of hundreds of models associated with each part wouldn’t be performent either.

Also, let’s say there are 50k parts in our parts table, 300k models in our car table and each part on average fits 100 models. If a model name changes or a year gets added in our car table that would require a massive update to the parts table to keep it in synch.

Unless I am misunderstanding something, which is very possible, it sounds like bubble may not be well suited for large relational datasets that have queries that require joins. It’s something I could efficiently do in sql fairly easily.

Not much to add here, but my app is kinda similar structure, albeit a bit simpler, however at the end of the day it is mostly one big Repeating Group.

It should have pretty good SEO, since there is nice keyword-rich content added nearly every day that should be evergreen. However, I realise that it is not getting much Google love so far and presumably most of that reason is the poor page structure. I know it scores badly with the Google checks I had done before but I had not seen Lighthouse before. I get 2/100 for performance. I think because of the infinite loading RG?

I just wanted to comment here to follow the discussion and share experience. My app is just a hobby project so not so important, but i would like it to rank higher in Google. I think it deserves it!

Despite the poor scores I see with my apps, I’ve found success ranking with google using Google My Business, uploading/updating sitemaps, and throwing a few dollars toward Google Ads. Doing these three things has really helped.

1 Like

Lighthouse performance is a huge issue that I’m trying to improve on one of my projects.

This is the best that I’ve got so far and that is on a static landing page.

2021-04-15_10-28

@emmanuel @josh Will the new responsive engine improve this at all?

1 Like