Persistent Rendering and Dynamic Content Challenges on My Restaurant Menu Website in Webflow

I am currently developing a restaurant menu website in Webflow that features multiple categories, detailed item descriptions, prices, images, and promotional offers. While building the site, I have encountered a persistent problem where certain sections of the menu fail to render correctly on the live site, even though they display perfectly in the Webflow Designer. Entire categories sometimes disappear or show only partial content, and refreshing the page occasionally resolves the issue temporarily. I have verified that all CMS collections and fields are correctly set up, but the inconsistency remains, making it difficult to ensure a reliable experience for users.

Another major issue involves images. The site relies heavily on high-resolution photos for each menu item, but loading performance is inconsistent across browsers and devices. Some images fail to appear entirely or take excessive time to load, which significantly affects the user experience. I have tried optimizing images and using Webflow’s native responsive image features, but the problem persists, especially when multiple CMS items are loaded dynamically on a single page. I am seeking guidance on the best practices for managing large media assets in a CMS-driven Webflow site without compromising load times or layout stability.

Dynamic filtering and search functionality is another area where I have run into challenges. The menu should allow users to filter items by category, dietary preferences, or availability, and the results should update in real time. However, when applying multiple filters simultaneously, some items do not appear as expected, or the filtering becomes slow and unresponsive. I suspect this may be related to CMS collection limits, custom code conflicts, or client-side rendering delays, but I have not been able to pinpoint the cause. Advice on implementing reliable dynamic filtering in a Webflow CMS environment would be extremely helpful.

Promotional offers and combo deals add further complexity. Some items require conditional pricing based on user selections or time-sensitive specials. I have tried implementing custom code to handle dynamic price calculations, but it sometimes produces incorrect totals or fails when multiple options are selected quickly. Additionally, integrating these calculations with Webflow’s CMS collections and dynamic lists has proven challenging, especially when the content updates frequently. I need recommendations on handling conditional logic and dynamic pricing efficiently within Webflow’s architecture.

Collaboration and content updates are also problematic. Multiple team members need to edit the menu, add new items, and update descriptions simultaneously. While Webflow allows CMS access for contributors, changes sometimes override or conflict with other edits, particularly when multiple users update the same collection items in quick succession. I am looking for strategies to manage multi-user updates, avoid conflicts, and maintain version control in a CMS-heavy Webflow site.

Finally, I am planning to scale the website to support multiple restaurant locations, each with unique menu items, pricing, and specials. This introduces additional complexity in managing CMS collections, dynamic content templates, and site structure while keeping the website fast, responsive, and easy to maintain. I would greatly appreciate advice on architecture, CMS organization, and workflow best practices to handle multi-location dynamic menus effectively in Webflow without causing rendering issues or breaking the user experience. Sorry for long post

Hey Joe, what image format are you using? You may have more luck with AVIF if you haven’t tried that. I would recommend capping your images at 100KB (even this is pretty large)

Additionally, I may be wrong here, but I believe that Webflow’s native responsive image feature (I assume you’re talking about the one where Webflow creates multiple images at different sizes and displays the most appropriate one for the device) does not apply to CMS items. The image in the CMS is the one that’s loaded regardless of screen size. The responsive feature only works for static images.

Not sure I have much advice with regards to dynamic filtering, but I know finsweets CMS filter is widely used.
It does sound like the custom code may be causing issues here though.

Never heard of CMS images not loading at all - but it’s well-known that CMS content heavy sites / complex CMS bindings etc in Webflow can have a huge impact on page speed.
You mentioned the loading performance is inconsistent - in my experience, this is often due to cache misses (cold server response). You can test this by appending /?123 to your URL and checking the performance in devtools. It should cause a cache miss, which allows you to see the worst-case page load speed scenario, server response time will likely be high. If your pages usually either load pretty fast or really slow, it’s probably this.
In previous conversations with Webflow support, they have acknowledged that cache misses can result in a server response time of 8 seconds and upwards.

Unfortunately, this also seems to only be degrading with time. Just take a look at the CrUX report of the Webflow site itself - they fail on both mobile and desktop, and the history shows a gradual increase in LCP. TTFB has also narrowly avoided being classed as ‘poor’ until recently and seems to be increasing.

Honestly, it sounds like you are going to be fighting Webflow’s limitations to achieve what you really want here. For static sites, Webflow is fine. Complex CMS sites, however, are probably best avoided if you care about user experience.