Skip to main content

We have the need for a custom navigation menu within our application.  The nav menu will appear at the top of each on of our Skuid pages.  To achieve this, I’d like a reusable “component” that I can just drop in to each page - no further steps required.  The component requires access to various models with certain conditions, etc.  Originally I had written a custom component with a builder (which worked well) but required each page that used the component to define models, add resources, set conditions, etc.  To further abstract, I want to place the menu in it’s own page (with necessary resources, models, etc. defined) and then drop it on pages using a page include.

I’ve got this working but am finding that even with Lazy Loading disabled, the included page has a delay when the page loads - seems as though the primary page loads first and then the page include gets loaded.  This results in a “Loading…” message appearing for a brief period of time.  Since the included page in this case contains site navigation and is the first thing at the top of the page, this is not the ideal user experience.

Is there a way to ensure that the included page gets loaded first or immediately to avoid the “Loading” delay?  Or is there a better way to achieve the desired outcome of having a reusable “component” that doesn’t require each page that needs it to ensure all models and resources are also defined?  I’m thinking maybe the component itself could define it’s own models (via code) but then we would lose some of the declarative features.

Thank you!

Be the first to reply!

Reply