Best practices for page load speed & performance

  • 1
  • Question
  • Updated 1 year ago
  • Answered
Hey all,

I'm working on a redesign of some of our Skuid pages. A lot of our high-traffic pages are quite complex and include multiple (10+ if not more) models and tabs. The upshot of this is that page load speed is high (read: really high).

I've made some significant improvements by doing the following:
  • Limit # models, model fields and records loaded per model
  • Use page includes/popouts for creation of new records (e.g. new tasks, opportunities)
  • Load custom CSS as a static resource instead of inline
However, I'm getting the feeling there must be more I can do. In an ideal world, I would like all pages to load in less than 5 seconds.

Can anyone comment on whether this is realistic (perhaps I should aim for even better load times) and what are some pitfalls I should watch out for? Some other posts I've seen point out that tab sets are often a culprit, which made me I'm curious about what else might be dragging the speed down.

Thanks in advance!
Photo of Kathryn Castle

Kathryn Castle

  • 814 Points 500 badge 2x thumb

Posted 2 years ago

  • 1
Photo of Skuidward Tentacles (Raymond)

Skuidward Tentacles (Raymond), Champion

  • 17,224 Points 10k badge 2x thumb
I believe Rockaway has some performance enhancements built in when using multiple models from the same object on a page. This might help boost speed if you have not already upgraded.
Photo of Skuidward Tentacles (Raymond)

Skuidward Tentacles (Raymond), Champion

  • 17,224 Points 10k badge 2x thumb
Also, in one org I built what I call a "dashboard" which is basically a complex set of lazy load tab sets that display page includes, tables, and field editors, etc... I basically use the tabs as "menus" so that a user can navigate back and forth to different pages without having to reload the entire page. The initial page loads at the usual speed, but the page includes in the tabs load extremely fast, so it cuts a ton of page load time out in total.
Photo of Kathryn Castle

Kathryn Castle

  • 814 Points 500 badge 2x thumb
Thanks Raymond - this was a really helpful tip. I switched out the majority of the tables in my tabs with one-model page includes and got the load speed down by an additional 3 seconds. Very pleased with the result!
Photo of Skuidward Tentacles (Raymond)

Skuidward Tentacles (Raymond), Champion

  • 17,224 Points 10k badge 2x thumb
Awesome!
Photo of Mansour

Mansour

  • 1,932 Points 1k badge 2x thumb
We employed a process we call Sequential loading to take advantage of page caching.
We cache our Skuid pages and no models load upon page load.  When the record page loads, we have a tab-action that loads the first model, then the subsequent model.

Eg. on an Opportunity Page, no models load upon page load.  When the page loads, a tab action Loads the Opportunity Model, then the Line Items, attachments, contact roles, activities, etc...

This way, the page loads instantly, provides the user the details they want first (e.g. the opportunity record) instantly, and by the time they want the related details, it's all there.

Photo of Kathryn Castle

Kathryn Castle

  • 814 Points 500 badge 2x thumb
That's a really interesting solution. Does caching the page run the risk of not retrieving the newest data or is there a way around that?
Photo of Mansour

Mansour

  • 1,932 Points 1k badge 2x thumb
Page caching ABSOLUTELY runs the risk of not retrieving the newest data if you load models on page load.  Outside of a handful of models that never change (e.g. email to Salesforce, Running User), all models are queries after the page loads. 
If you query models after the page loads, the data won't be stale.
Photo of Kathryn Castle

Kathryn Castle

  • 814 Points 500 badge 2x thumb
Makes sense - thanks. Definitely food for thought!
Photo of Barry Schnell

Barry Schnell, Champion

  • 18,086 Points 10k badge 2x thumb
Very interesting approach Mansour!

One thing to note is that, as Mansour said, page caching will run the risk of not retrieving the latest data, however the risk is dependent on how the model is configured.  If you have the model marked to "process client-side", the page HTML will be cached but since the models will be loaded on the client, you will always receive the latest data on page load.
Photo of Skuidward Tentacles (Raymond)

Skuidward Tentacles (Raymond), Champion

  • 17,224 Points 10k badge 2x thumb
I like that a lot
Photo of Erik Wahlberg

Erik Wahlberg

  • 2,156 Points 2k badge 2x thumb
We're working on the Lightning re-design and i'm absolutely incorporating the sequential loading method. 

I do have a secondary question related to field rendering. Our opportunity detail page is filled with rendering conditions based on the Recordtype.Name. Now this is a second level field so I was wondering if creating a formula field at the opportunity level would improve page performance (even marginally)? We have about 81 of these in page for reference. 

Referencing the documentation below
https://docs.skuid.com/latest/en/skuid/best-practices/#optimize-conditions-sort-on-first-level-field...
Photo of Bill McCullough

Bill McCullough, Champion

  • 12,436 Points 10k badge 2x thumb
Erik,

I am not sure whether a formula field to display the recordtype.name will help with the page performance.  You can switch to using the recordtypeid itself since this doesn't change between your sandboxes and production.

Thanks,

Bill