I’ve been trying to understand the difference between dynamic and static collection pages and how they work with Supabase as a backend. Here’s what I’ve gathered so far:
static pages seem to be better optimized for SEO
If you’re using Supabase as the backend (as of October 2024), dynamic collection pages are the only available option.
Static pages are individual pages for each item in a collection, while dynamic pages also generate individual pages for each item in a collection—so I’m confused about the real difference here.
There’s a workaround to use static collection pages with Supabase by using a REST API.
For my own project, I ended up creating a dynamic collection page, but I had trouble binding the elements as I wanted. Instead, I connected the page using WeWeb’s API and linked it to my Supabase API URL, as shown in this video.
I found this solution after a lot of searching, and I feel the WeWeb docs were unclear about the differences between static and dynamic pages. The workaround I’ve seen for static collection pages with Supabase is to create a new collection using the REST API as the source, link it to Supabase, and bind elements to this REST API collection rather than using WeWeb’s standard Supabase integration.
I’m still a bit confused though. Did I accidentally create a dynamic page when I should have used a static one, or is my current setup correct? Can someone explain the difference between static and dynamic pages more clearly?
This is the difference, dynamic pages don’t pre-generate a page for your items in a collection, whereas static pages do, so that’s why it’s better for SEO. With Static collections, you get the prerendered page by default.
In my case, I’m trying to create a dynamic collection page for bookings. For example, if the URL is example.com/bookings/777, I want to be able to update the booking ID in the URL (e.g., change 777 to 778) and have the page dynamically load the corresponding booking.
I understand that dynamic collection pages don’t pre-render. My question is: will I still be able to visit a URL like example.com/bookings/778 and have the page load the content dynamically once I land on it, even though it’s not pre-rendered? Will this approach work in practice for loading individual booking pages based on the booking ID in the URL?
So if I would use a static collection and only add elements to the collection on a monthly basis, would it be possible to then just refresh the collection each much to reflect the new elements? Thanks.
I am building the same, a booking engine and I am applying based in this video, as long as the page parameter is defined the example.com/bookings/778 should work fine as that 778 is in the database and data will be pulled from the API request.